弹出窗口中的单张缩放按钮

问题描述

我试图在单张弹出窗口中添加一个“缩放至”按钮，单击该按钮可平移和缩放该功能。我无法弄清楚如何用下面的代码来做到这一点（我知道我在屠杀代码）：

function getLoc(e){
    map.setView(e.latlng);
    }
        
        // Load Mile Castles
        $.ajax({url:'load_milecastles.PHP',success: function(response){
                   
                   
                       
                   jsnParks = JSON.parse(response);
                   lyrParks = L.geoJSON(jsnParks,{ pointToLayer: function(feature,latlng){return L.marker(latlng,{icon: redMarker});},onEachFeature: function (feature,layer) {
                                layer.bindPopup(
                       "<center><h4><b>"+feature.properties.full_name+"</b></h4></center>" +
                       "<button onclick= 'getLoc(e)'>Zoom</button>");
                      }
                 }).addTo(map);

解决方法

将代码替换为：

function getLoc(latlng){
    map.setView(JSON.parse(latlng));
}

var latlngStr = JSON.stringify([layer.getLatLng().lat,layer.getLatLng().lng]);
layer.bindPopup("<center><h4><b>"+feature.properties.full_name+"</b></h4></center>" +
                       "<button onclick= 'getLoc(\""+latlngStr+"\")'>Zoom</button>");

e应该是变量，但由于是字符串onclick='getLoc(e)'
e从未定义过，您应该将latlng添加到函数中而不是事件中
现在latlng将转换为数组，然后作为字符串添加到函数中。调用该函数时，它将其转换回数组，然后将视图移至latlng

使用此方法，对我有用。

var coord;

function getLoc(){
map.setView(coord,13);
}
lyrParks = L.geoJSON(jsnParks,{ pointToLayer: function(feature,latlng){return 
L.marker(latlng,{icon: redMarker});},onEachFeature: function (feature,layer) {
                                layer.bindPopup(
                       "<center><h4><b>"+feature.properties.full_name+"</b></h4></center>" +
                       "<button onclick= 'getLoc()'>Zoom</button>");

                                 layer.on('click',function(e){
                        coord =[e.latlng.lat,e.latlng.lng];
                           }

                         }
                 }).addTo(map);

Zoom button in Popup with leaflet

javascript leaflet zoom