134

以下代码初始化传单地图。初始化函数根据用户位置使地图居中。调用初始化函数后如何将地图的中心更改为新位置?

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});    
} 
4

5 回答 5

206

例如:

map.panTo(new L.LatLng(40.737, -73.923));
于 2012-10-04T20:44:12.373 回答
145

您还可以使用:

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

这仅取决于您想要什么行为。map.panTo()将平移到具有缩放/平移动画的位置,同时map.setView()立即将新视图设置为所需的位置/缩放级别。

于 2012-10-07T21:51:38.487 回答
13

如果该点在当前视图中,则使用map.panTo();不会执行任何操作。改为使用map.setView()

我有一条折线,我必须每秒将地图居中到折线中的一个新点。检查代码:好:https ://jsfiddle.net/nstudor/xcmdwfjk/

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

不好:https ://jsfiddle.net/nstudor/Lgahv905/

mymap.panTo(point);
mymap.setZoom(11);
于 2018-07-17T09:14:28.553 回答
6

您还可以使用:

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

这将设置视图级别以适应地图传单中的边界。

于 2019-05-08T14:07:57.630 回答
0

我正在寻找一种改变边界但没有动画的方法。这对我有用:

var bounds = L.latLng(40.737, -73.923).toBounds();
map.fitBounds(bounds, {animation: false});
于 2021-08-19T17:13:19.947 回答