使用 Leaflet.draw 从多层中删除特征

Question

地图中显示了多个图层，我想要一个删除按钮来从这些图层中删除选定的标记。

我正在使用 Leaflet.draw 插件来实现它，但似乎绘图控件必须绑定到单个图层，而我有多个图层。

我试图将图层中的所有功能复制到一个 FeatureGroup 并将 FeatureGroup 与绘图控件绑定以完成此操作，但它破坏了图层控件的行为，因为我无法再控制图层的可见性。（特征组中的重复特征）。

有没有办法在不破坏图层可见性控制的情况下启用多层特征删除？

var layerControl = new L.Control.Layers({}, {});

var geojsonLayer = L.geoJson(data);
geojsonLayer.getLayers()[0].addTo(drawnItems);

var geojsonLayer2 = L.geoJson(data2);
geojsonLayer2.getLayers()[0].addTo(drawnItems);

map.addControl(layerControl);
layerControl.addOverlay(geojsonLayer, 'layer1');
layerControl.addOverlay(geojsonLayer2, 'layer2');

Answer 1

我想我仍然必须在 FeatureCollection 层中保留标记的副本，并在 drawDelete 事件中相应地从特定层中删除它们。当层可见性从 LayerControl 更改时，add/remove 来自 FeatureCollection 层的标记。

    // Draw Control
    var editableFeatures = L.featureGroup();
    map.addLayer(editableFeatures);
    var drawControl = new L.Control.Draw({
        draw: false,
        edit: {
            edit: false,
            featureGroup: editableFeatures
        }
    });

    map.on('draw:deleted', function(e) {
        var layers = e.layers;
        layers.eachLayer(function(feature) {
            map.eachLayer(function(mapLayer) {
                if (mapLayer.hasLayer) {
                    mapLayer.removeLayer(feature);
                }
            });
        });
    });

    map.addControl(drawControl);

    //LayerControl
    var layerControl = new L.Control.Layers({}, {});
    map.addControl(layerControl);

    map.on('overlayadd', function(layer, name) {
        layer.layer.eachLayer(function(feature) {
            editableFeatures.addLayer(feature);
        });
    });

    map.on('overlayremove', function(layer, name) {
        layer.layer.eachLayer(function(feature) {
            editableFeatures.removeLayer(layer);
        });
    });

使用 Leaflet.draw 从多层中删除特征

Delete feature from multiple layers with Leaflet.draw

leaflet