Javascript 单击标记时打开错误的弹出窗口

Javascript 单击标记时打开错误的弹出窗口,javascript,leaflet,leaflet.markercluster,Javascript,Leaflet,Leaflet.markercluster,我有很多标记,所以我把它们聚在一起。我遇到了一个问题,当用户从集群中缩小时,我想保持弹出窗口打开,我找到了这个解决方案 它很好用。但问题是当标记离集群本身太近时 当我尝试同样的解决方案时,我得到了这个结果 当我点击集群时,会显示两个标记。例如,如果我点击左侧的标记,会弹出文本1。当我关闭此弹出窗口时,我再次尝试打开左边的标记,然后弹出文本2,这是错误的。相反,我得到了一个。我的错误在哪里,希望解决方案可以调整到非常接近坐标的标记 clustered.on('popupopen', func

我有很多标记,所以我把它们聚在一起。我遇到了一个问题,当用户从集群中缩小时,我想保持弹出窗口打开,我找到了这个解决方案

它很好用。但问题是当标记离集群本身太近时 当我尝试同样的解决方案时,我得到了这个结果

当我点击集群时,会显示两个标记。例如,如果我点击左侧的标记,会弹出文本1。当我关闭此弹出窗口时,我再次尝试打开左边的标记,然后弹出文本2,这是错误的。相反,我得到了一个。我的错误在哪里,希望解决方案可以调整到非常接近坐标的标记

clustered.on('popupopen', function(e) {
    console.log('open');
    const m = e.popup._source;
    clustered.removeLayer(m);
    unclustered.addLayer(m);
    m.openPopup();
});
unclustered.on('popupclose', function(e) {
    console.log('close');
    let m = e.popup._source;
    unclustered.removeLayer(m);
    clustered.addLayer(m);
    m.closePopup();
});
更新-完整解决方案


这是因为您从
集群组中删除了该层。将其再次添加到组后,它将有一个新订单

您可以这样做:

let popup;
const mkMarker = function(lat, lng, txt) {
    const m = L.marker(L.latLng(lat, lng));
    m.addTo(clustered);
  m.popupText = txt;
  m.on('click',(e)=>{
    var marker = e.target;
    var latlng = marker.getLatLng();
    var offset = [0,0];
    if(marker._preSpiderfyLatlng){
        latlng = marker._preSpiderfyLatlng;
    }else{
      offset= marker.options.icon.options.popupAnchor;
    }
    
    popup = L.popup({offset: offset}).setContent(marker.popupText).setLatLng(latlng).addTo(map)
  })
    return m;
};

并删除popupopen/close listener函数,这是因为您从
集群
组中删除了该层。将其再次添加到组后,它将有一个新订单

您可以这样做:

let popup;
const mkMarker = function(lat, lng, txt) {
    const m = L.marker(L.latLng(lat, lng));
    m.addTo(clustered);
  m.popupText = txt;
  m.on('click',(e)=>{
    var marker = e.target;
    var latlng = marker.getLatLng();
    var offset = [0,0];
    if(marker._preSpiderfyLatlng){
        latlng = marker._preSpiderfyLatlng;
    }else{
      offset= marker.options.icon.options.popupAnchor;
    }
    
    popup = L.popup({offset: offset}).setContent(marker.popupText).setLatLng(latlng).addTo(map)
  })
    return m;
};

并删除弹出打开/关闭侦听器功能

谢谢您的回复和时间。请告诉我如何解决这个问题?我对这张地图不熟悉,我需要帮助来调整解决方案。为什么像我的情况一样,当坐标彼此接近时会给我带来问题,但在第一个例子中一切都很好?@pece我更新了答案谢谢你的解决方案Falke。非常感谢你,我需要的只是抵消在中间,而不是点击标记。谢谢你的反应和时间福克。请告诉我如何解决这个问题?我对这张地图不熟悉,我需要帮助来调整解决方案。为什么像我的情况一样,当坐标彼此接近时会给我带来问题,但在第一个例子中一切都很好?@pece我更新了答案谢谢你的解决方案Falke。非常感谢你,我只需要把偏移放在中间而不是点击标记。