传单单击标记时如何设置中心地图

Question

我按照这个例子 http://jsfiddle.net/abenrob/ZkC5M/ ，当我点击标记时我想要地图平移到标记并设置位置中心屏幕我的代码在下面但是当我点击 map.setView（新 L.LatLng （位置），5）；不工作。

 function markerFunction(id){
        for (var i in markers){
            var markerID = markers[i].options.title;
            var position = markers[i].getLatLng();

            if (markerID == id){              
                map.setView(new L.LatLng(position), 5);
                markers[i].openPopup();
            };
        }
    }

谢谢，

Answer 1

您所关注的示例说明了如何通过单击地图外部链接与标记进行交互，并且您正在编辑的功能仅在您单击其中一个链接。它不会影响点击标记本身的行为。

如果您在编辑的函数中将 new L.LatLng(position) 替换为 position，单击链接将导致地图以相关标记为中心，但是你的问题是关于如何通过点击标记本身来获得相同的行为。

为此，您可以创建一个在单击标记时调用的函数：

function clickZoom(e) {
    map.setView(e.target.getLatLng(),5);
}

然后在创建图层时通过附加 .on('click', clickZoom) 将点击事件监听器附加到每个标记，例如：

var marker1 = L.marker([51.497, -0.09], {
  title: "marker_1"
}).addTo(map).bindPopup("Marker 1").on('click', clickZoom);

这里是一个更新的fiddle，展示了所有这一切的工作：

http://jsfiddle.net/ZkC5M/221/

Answer 2

panTo() 也应该有效：

marker.addEventListener("click", function (e){
  map.panTo(this.getLatLng());
});

对于您的示例，它看起来像这样：

for(i = 0; i < markers.length; i++){
    markers[i].addEventListener("click", function(e){
        map.panTo(this.getLatLng());
    });
}

传单单击标记时如何设置中心地图

Leaflet How to set center map when click marker

leaflet