javascript 如何在添加新的标记和图层之前清除所有标记和图层的传单Map？

thtygnil 于 2023-04-04 发布在 Java

关注(0)|答案(6)|浏览(162)

下面的代码：

map: function (events) {
    var arrayOfLatLngs = [];
    var _this = this;

    // setup a marker group
    var markers = L.markerClusterGroup();

    events.forEach(function (event) {
        // setup the bounds
        arrayOfLatLngs.push(event.location);

        // create the marker
        var marker = L.marker([event.location.lat, event.location.lng]);

        marker.bindPopup(View(event));

        // add marker
        markers.addLayer(marker);
    });

    // add the group to the map
    // for more see https://github.com/Leaflet/Leaflet.markercluster
    this.map.addLayer(markers);

    var bounds = new L.LatLngBounds(arrayOfLatLngs);
    this.map.fitBounds(bounds);
    this.map.invalidateSize();
}

我最初调用这个函数，它会将所有events添加到带有标记和聚类的Map中。
在稍后的时候，我传入一些其他事件，Map将放大到新事件，但旧事件仍在Map上。
我试过this.map.removeLayer(markers);和其他一些东西，但我不能让旧的标记消失

JavaScript

来源：https://stackoverflow.com/questions/28636723/how-to-clear-leaflet-map-of-all-markers-and-layers-before-adding-new-ones

6条答案

按热度按时间

a5g8bdjr1#

如果你想移除你组中的所有当前层（标记），你可以使用L.markerClusterGroup()的clearLayers方法。你的引用被称为markers，所以你需要调用：

markers.clearLayers();

赞(0）回复(0）举报 2023-04-04

qf9go6mv2#

你正在丢失标记引用，因为它是用var设置的。请尝试将引用保存为'this'。

mapMarkers: [],
map: function (events) {
    [...]
    events.forEach(function (event) {
        [...]
        // create the marker
        var marker = L.marker([event.location.lat, event.location.lng]);
        [...]
        // Add marker to this.mapMarker for future reference
        this.mapMarkers.push(marker);
    });
    [...]
}

然后稍后当您需要删除标记时运行：

for(var i = 0; i < this.mapMarkers.length; i++){
    this.map.removeLayer(this.mapMarkers[i]);
}

或者，您可以将集群保存到'this'，而不是保存对每个标记的每个引用。

赞(0）回复(0）举报 2023-04-04

4smxwvx53#

map._panes.markerPane.remove();

赞(0）回复(0）举报 2023-04-04

ecbunoof4#

$(".leaflet-marker-icon").remove();
$(".leaflet-popup").remove();

赞(0）回复(0）举报 2023-04-04

8hhllhi25#

您可以清除所有标记而不保存它

map.eachLayer((layer) => {
  layer.remove();
});

来自https://leafletjs.com/reference-1.0.3.html#map-event

赞(0）回复(0）举报 2023-04-04

slsn1g296#

我使用了来自beije和Prayitno Ashuri的两个最佳答案的组合。
将标记保存到“this”，以便我们稍后可以引用它。

this.marker = L.marker([event.location.lat, event.location.lng]);

然后去掉标记

this.markers.remove()

赞(0）回复(0）举报 2023-04-04

我来回答

javascript 如何在添加新的标记和图层之前清除所有标记和图层的传单Map？

6条答案

相关问题

热门标签

最新问答