标记未删除：传单答案

【问题标题】：Marker not being removed : Leaflet标记未删除：传单
【发布时间】：2015-09-16 10:49:54
【问题描述】：

我正在使用传单 api。我在其中为标记添加了自定义控件。

我有一个按钮可以删除所有标记。

问题

通过包装，我必须删除所有标记但功能不起作用....浏览器没有给出任何控制台错误，所以我一头雾水，没有完全理解 api 的结构。

脚本

            var markers = new L.FeatureGroup();
            map.on('click', function markerPlace(e) {
                //L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);
            marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);
                markers.addLayer(marker);
                map.off('click', markerPlace);
            });
        }).addTo(map);

    //onClick this button we have to remove all marker
    <button id="removeMarker">Remove Markers</button>      
    $('#removeMarker').click(function (e) {map.removeLayer(markers) });

如果有人对此有任何想法，请提供帮助或任何形式的参考将不胜感激。感谢您的宝贵时间

【问题讨论】：

标签： leaflet angular-leaflet-directive dc.leaflet.js

【解决方案1】：

当您正确识别您的代码时，您可以轻松发现第一个错误：

var markers = new L.FeatureGroup();

map.on('click', function markerPlace(e) {
    //L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);
    marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);
    markers.addLayer(marker);
    map.off('click', markerPlace);
});

}).addTo(map); // <- What is this doing here

这应该会给你一个很大的控制台错误。我假设它属于您的L.FeatureGroup，如下所示：

var markers = new L.FeatureGroup().addTo(map); <- Moved to here

map.on('click', function markerPlace(e) {
    //L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);
    marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);
    markers.addLayer(marker);
    map.off('click', markerPlace);
});

所以您希望将标记添加到名为 markers 的 L.FeatureGroup 中，那么为什么要将它们添加到地图中？

marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(map);

应该改为：

marker = L.marker(e.latlng, { icon: markerIcon, draggable: true }).addTo(markers);

简而言之：在地图的点击事件中，您尝试从地图中删除标记要素图层，该标记要素图层尚未正确添加，并且您已将标记添加到地图，而不是要素组。

PS：您想要删除标记，但您实际上想要做的是删除整个功能组。如果您想保留功能组并仅删除标记，您也可以使用L.FeatureGroup 的clearLayers 方法：

markers.clearLayers();

【讨论】：