web-dev-qa-db-fra.com

MapBox efface tous les marqueurs actuels

J'ai créé une instance MapBox avec:

var map = new mapboxgl.Map({
    container : 'map',
    style : 'mapbox://styles/mapbox/streets-v9'
});

J'ai besoin d'effacer tous les marqueurs, et j'ai essayé des choses comme map.remove (marqueur) sur chacun, et quelques autres choses, mais rien ne semble fonctionner.

Existe-t-il un simple appel de fonction pour simplement effacer tous les marqueurs de la carte?

EDIT: Différent de Comment supprimer toutes les couches et fonctionnalités de la carte? car je reçois "eachLayer n'est pas une fonction reconnue" (ou similaire) dans la console.

9
HomerPlata

Tu as vu ça? https://www.mapbox.com/mapbox-gl-js/api/#marker#remove

Au lieu de map.remove, essayez peut-être marker.remove:

var marker = new mapboxgl.Marker().addTo(map);
marker.remove();
19
Andi-lo

Si vous avez ajouté plusieurs marqueurs et que vous souhaitez les effacer tous sur votre carte, vous devez boucler tous les marqueurs et les supprimer un par un, vous aurez quelque chose comme ceci:

if (currentMarkers!==null) {
    for (var i = currentMarkers.length - 1; i >= 0; i--) {
      currentMarkers[i].remove();
    }
}

Considérez que var currentMarkers contient tous les marqueurs, vous pouvez le faire avec quelque chose comme:

oneMarker= new mapboxgl.Marker(currentMarkerDiv)
    .setLngLat(marker.geometry.coordinates)
    .addTo(mapboxMap);
    currentMarkers.Push(oneMarker);

Où var currentMarkers est une variable globale:

var currentMarkers=[];

Exemple complet:

// markers saved here
var currentMarkers=[];

// tmp marker
var oneMarker= new mapboxgl.Marker(currentMarkerDiv)
    .setLngLat(marker.geometry.coordinates)
    .addTo(mapboxMap);

// save tmp marker into currentMarkers
currentMarkers.Push(oneMarker);


// remove markers 
if (currentMarkers!==null) {
    for (var i = currentMarkers.length - 1; i >= 0; i--) {
      currentMarkers[i].remove();
    }
}
8

Si vous avez ajouté des marqueurs comme celui-ci (pour pouvoir ajouter un style et des images personnalisées en tant que marqueurs), vous pouvez simplement supprimer la classe (je l'ai fait via Jquery cependant).

Ajout de marqueurs dans un GeoJson:

GeoJson.features.forEach(function(marker) {
var el = document.createElement('div');
el.className = 'marker';
new mapboxgl.Marker(el).setLngLat(marker.geometry.coordinates).addTo(map);
});

Suppression des marqueurs:

$( ".marker" ).remove();

0
Ralph1983