单击传单中的缩放和居中标记 [英] Zoom and center marker on click in leaflet

问题描述

我的传单地图有问题.我的地图上有一些标记，当单击一个标记时，标记居中.现在，我想在单击一个标记时不仅要居中，而且要放大标记.当我添加此

I have a problem with my leaflet map. I have some markers on my map and when clicking on one, the marker is centered. Now I want when clicking on one marker it is not only centered but I want to zoom in to the marker. When I add this

    map.setZoom((16), {animate: true});

到

    map.on('popupopen', function(centerMarker) {
        var cM = map.project(centerMarker.popup._latlng);
        cM.y -= centerMarker.popup._container.clientHeight/2
        map.setZoom((16), {animate: true});
        map.panTo(map.unproject(cM),{animate: true});
    });

我的代码居中并没有真正起作用，因为它会放大但不会使标记居中.但是，如果我处于预期的缩放级别(16)，所有其他标记都将居中.如果我不在缩放级别16范围内，地图会缩放到标记，标记也居中，该怎么办?我对传单和jquery很陌生...

my code the centering doesn't really work because it zooms in but it doesn't center the marker. But all the other markers are centered if I'm in the expected zoom level (16). What can I do that the map zooms to the marker AND the marker is centered as well if I'm outside the zoom level 16? I'm quite new to leaflet and jquery...

推荐答案

除了使用setZoom和panTo，您还可以使用具有zoomoption的单个方法setView.

Instead of using setZoom and panTo, you can use single method setViewwith zoomoption.

map.on('popupopen', function(centerMarker) {
        var cM = map.project(centerMarker.popup._latlng);
        cM.y -= centerMarker.popup._container.clientHeight/2
        map.setView(map.unproject(cM),16, {animate: true});
    });

这篇关于单击传单中的缩放和居中标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！