javascript - 传单标记集群 : Exempt marker from clustering

Question

如何检查带有打开弹出窗口的标记在缩小时不会折叠成一个簇？

我正在使用 leaflet和 markercluster在 this example 中设置:

HTML:

<div id="map"></div>

CSS:

html,
body {
  height: 100%;
}

#map {
  height: 100%;
}

JS:

const map = L.map('map', {
    zoom: 5,
    center: [0,0],
    maxZoom: 18
});
const clustered = L.markerClusterGroup();
map.addLayer(clustered);

const m1 = L.marker(L.latLng(0,0));
m1.addTo(clustered);
m1.bindPopup('one');

const m2 = L.marker(L.latLng(0,1));
m2.addTo(clustered);
m2.bindPopup('two');

const m3 = L.marker(L.latLng(1,0));
m3.addTo(clustered);
m3.bindPopup('three');

我想暂时免除一个标记折叠成一个簇只要它的弹出窗口是打开的。例如，这意味着:

1. 放大直到看到各个标记。

2. 单击一个打开弹出窗口。

3. 再次缩小。

“弹出”标记应该与打开的弹出窗口一起可见。其余标记应折叠。

1. 当弹出窗口关闭时，标记应该消失在簇中。

我尝试在 popupopen(和 popupclose)上将标记临时移动到 map (并返回)，但这不起作用:

map.on('popupopen', function(e) {
    const m = e.popup._source;
    clustered.removeLayer(m);
    map.addLayer(m);
});
map.on('popupclose', function(e) {
    let m = e.popup._source;
    map.removeLayer(m);
    clustered.addLayer(m);
});

有什么想法吗？

Answer 1

现在this似乎在工作。我必须添加一个单独的层 unclustered，并且只在聚类层处理 popupopen，并且只在非聚类层处理 popupclose

const unclustered = L.markerClusterGroup(); // NOTE
map.addLayer(unclustered);
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();
});

注意:我对非聚类层使用L.markerClusterGroup 不满意。但我不知道还有什么。只要该层中只有一个标记，它就会起作用。但要避免多个标记折叠成一个簇，必须使用不同的层。哪一个？ L.layerGroup 不起作用。