web-dev-qa-db-fra.com

comment effacer la carte de tous les marqueurs et couches avant d’en ajouter de nouveaux?

j'ai le code suivant:

    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();
        }

j'appelle cette fonction dans un premier temps et elle ajoutera tous les events à la carte avec des marqueurs et des clusters.

à un certain point de la mousse, je passe à d'autres événements, la carte zoomera sur les nouveaux événements, mais les anciens sont toujours sur la carte.

J'ai essayé this.map.removeLayer(markers); et quelques autres trucs, mais je ne peux pas faire disparaître les anciens marqueurs

des idées?

javascriptgoogle-mapsmapsleaflet
28
Patrioticcow

Si vous souhaitez supprimer tous les calques actuels (marqueurs) de votre groupe, vous pouvez utiliser la méthode clearLayers de L.markerClusterGroup(). Votre référence s'appelle markers, vous devez donc appeler:

markers.clearLayers();
39
iH8

Vous perdez la référence au marqueur car elle est définie avec var. Essayez de sauvegarder les références à 'this' à la place.

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);
    });
    [...]
}

Ensuite, lorsque vous devez supprimer les marqueurs, exécutez:

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

Alternativement, au lieu de sauvegarder chaque référence à chaque marqueur, vous pouvez simplement sauvegarder le cluster dans 'this'.

14
beije
map._panes.markerPane.remove();
2
Prayitno Ashuri