Comment faire pour modifier le centre de la carte en Leaflet.js

Le code suivant initialise une notice de la carte. La fonction d'initialisation des centres de la carte basée sur la localisation de l'utilisateur. Comment puis-je changer le centre de la carte pour un nouveau poste après l'appel de la fonction d'initialisation?

function initialize() {
map = L.map('map');
L.tileLayer('http://{s}.tile.cloudmade.com/BC9A493B41014CAABB98F0471D759707/997/256/{z}/{x}/{y}.png', {
    maxZoom: 18,
    attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://cloudmade.com">CloudMade</a>'
}).addTo(map);

map.locate({setView: true, maxZoom: 8});    
}
InformationsquelleAutor Joel James | 2012-10-04
  1. 128

    Par exemple:

    map.panTo(new L.LatLng(40.737, -73.923));
    • La Documentation est disponible à l'adresse leafletjs.com/reference.html#map-panto
    • map.panTo([40.737, -73.923]) fonctionne aussi bien!
    • map.flyTo([40.737, -73.923], 8) si vous souhaitez agrandir et d'animer ainsi
    • Dans mon cas, cependant, panTo(), flyTo(), setView() - tous me prendre pour le en haut à gauche de la carte, et pas le centre.
    InformationsquelleAutor Paulo Rodrigues
  2. 103

    Vous pouvez également utiliser:

    map.setView(new L.LatLng(40.737, -73.923), 8);

    Tout dépend ce comportement que vous souhaitez. map.panTo() fera un pan de l'emplacement avec zoom/pan animation, tandis que map.setView() immédiatement le nouveau point de vue à l'emplacement souhaité/niveau de zoom.

    • Je l'aime parce que vous obtenez également le niveau de zoom, ce qui est très utile.
    • Vous pouvez également passer les coordonnées dans un tableau: map.setView([40.737, -73.923], 8) ou un objet map.setView({lat:40.737, lng:-73.923}, 8)
    • S'il vous plaît comment pouvons-nous réaliser ceci: stackoverflow.com/q/35740338/44080
    • panTo ne montrait pas d'animation, j'utilise map.setView(latlng, map.getZoom(), { animation: true });
    InformationsquelleAutor Greg Wilson
  3. 6

    Utilisation map.panTo(); ne fait rien si le point est dans la vue actuelle. Utilisation map.setView() à la place.

    J'ai eu une polyligne et j'ai du centre de la carte vers un nouveau point en polyligne à chaque seconde. Vérifier le code :
    BON: https://jsfiddle.net/nstudor/xcmdwfjk/

    mymap.setView(point, 11, { animation: true });

    MAUVAIS: https://jsfiddle.net/nstudor/Lgahv905/ 

    mymap.panTo(point);
mymap.setZoom(11);
    InformationsquelleAutor Stefan Nedelcu
  4. 1

    Vous pouvez également utiliser:

    var latLon = L.latLng(40.737, -73.923);
var bounds = latLon.toBounds(500); //500 = metres
map.panTo(latLon).fitBounds(bounds);

    Ceci permettra de définir le niveau d'affichage pour l'adapter les limites de la carte en dépliant.

    InformationsquelleAutor Latinrickshaw