传单禁用缩放到标记以及如何保持弹出窗口始终处于活动状态

leaflet disable zoom to marker and how to keep popups always active

本文关键字：窗口 活动状态 何保持 缩放 单禁用      更新时间：2023-09-26

您好，我有一个应用程序，可以在传单地图上绘制人员位置和他的朋友位置。我为此使用两个单独的函数，因为有多个朋友等。

当它绘制登录的用户时，它将缩放到他的位置

，然后当它绘制朋友时，它将缩放到他的位置。我需要它，以便所有标记的弹出窗口始终处于活动状态，并且它不会缩放到任何一个标记。

  var markers = new L.FeatureGroup();
  function addMarkerGroup(lat_ret,lon_ret,map,user){
    map.removeLayer(markers);
    markers = new L.FeatureGroup();
    var marker = L.marker([lat_ret, lon_ret]).addTo(map).bindPopup("User:" + user).openPopup();
    markers.addLayer(marker);
    map.addLayer(markers);
  }
  var friend_markers = new L.FeatureGroup();
  function addFriendMarkerGroup(lat_ret,lon_ret,map,user){
    map.removeLayer(friend_markers);
    friend_markers = new L.FeatureGroup();
    var friend_marker = L.marker([lat_ret, lon_ret]).addTo(map).bindPopup("User:" + user).openPopup();
    friend_markers.addLayer(friend_marker);
    map.addLayer(friend_markers);
  }

您确定打开弹出窗口时地图会缩放吗？我也知道地图仅平移以使弹出窗口可见。我也在您的代码中看到任何实现缩放的内容，所以我认为您错了。如果要禁用平移到刚刚打开的弹出窗口，可以禁用autoPan选项：

new L.Marker([0, 0]).bindPopup('Foo', {
    autoPan: false
}).addTo(map).openPopup();

http://leafletjs.com/reference.html#popup-autopan

同时

打开两个弹出窗口是不可能的，用您自己的功能覆盖L.Map的openPopup功能，您可以在其中注释/省略当前打开的弹出窗口关闭的行：

L.Map.include({
    openPopup: function (popup, latlng, options) { // (Popup) or (String || HTMLElement, LatLng[, Object])
        // Commented out, previous popup(s) will remain open 
        // this.closePopup();
        if (!(popup instanceof L.Popup)) {
            var content = popup;
            popup = new L.Popup(options)
                .setLatLng(latlng)
                .setContent(content);
        }
        popup._isOpen = true;
        this._popup = popup;
        return this.addLayer(popup);
    }
});

示例：http://plnkr.co/edit/0LPYmhJ3ew8wSBXBM6XC?p=preview

在Leaflet 1.0(目前是测试版(中，有一个名为autoClose的新弹出选项可以解决此问题：

new L.Marker([0, 0]).bindPopup('Foo', {
    autoClose: false
}).addTo(map).openPopup();

你必须在 bindPopup(( 中给出 autoPan： false 和 autoClose： false

var testMarkerOne = L.circle([21.7679, 78.8718], 80500, {
                    color: 'red',
                    fillColor: '#f03',
                    fillOpacity: 0.5
    }).bindPopup('Marker 1', { autoPan: false, autoClose: false });
    var testMarkerTwo = L.circle([13.0448, 77.6221], 80500, {
                    color: 'red',
                    fillColor: '#f03',
                    fillOpacity: 0.5
    }).bindPopup('Marker 2', { autoPan: false, autoClose: false } );
var testMarkerThree = L.circle([15.2993, 74.1240], 80500, {
                color: 'red',
                fillColor: '#f03',
                fillOpacity: 0.5
}).bindPopup('Marker 3', { autoPan: false, autoClose: false });
var circleGroup = L.featureGroup([testMarkerOne,testMarkerTwo, testMarkerThree]).addTo(mymap);
circleGroup.eachLayer(function(layer) {
  layer.openPopup();
});

你必须在 bindPopup(( 中给出 autoPan： false 和 autoClose： false

相关文章：