Google Maps API v3: cómo eliminar todos los marcadores?

Question

En Google Maps API v2, si quería eliminar todos los marcadores de mapa, yo podría simplemente hacer:

map.clearOverlays(); 

¿Cómo puedo hacer esto en Google Maps API v3 ?

Mirando el Reference API, no está claro para mí.

Answer 1

Parece que todavía no hay tal función en V3.

La gente sugiere mantener referencias a todos los marcadores que tiene en el mapa en una matriz. Y luego, cuando desee eliminar em all, simplemente recorra el array y llame al método .setMap (null) en cada una de las referencias.

See this question for more info/code.

Mi versión:

google.maps.Map.prototype.markers = new Array(); 

google.maps.Map.prototype.getMarkers = function() { 
    return this.markers 
}; 

google.maps.Map.prototype.clearMarkers = function() { 
    for(var i=0; i<this.markers.length; i++){ 
     this.markers[i].setMap(null); 
    } 
    this.markers = new Array(); 
}; 

google.maps.Marker.prototype._setMap = google.maps.Marker.prototype.setMap; 

google.maps.Marker.prototype.setMap = function(map) { 
    if (map) { 
     map.markers[map.markers.length] = this; 
    } 
    this._setMap(map); 
} 

El código es la versión editada de este código http://www.lootogo.com/googlemapsapi3/markerPlugin.html que elimina la necesidad de llamar addMarker manualmente.

Pros

• Haciendo de esta manera se mantiene el código compacto y en un lugar (no contamina el espacio de nombres).
• No es necesario hacer un seguimiento de los marcadores a sí mismo ya que siempre puede encontrar todos los marcadores en el mapa llamando map.getMarkers()

Contras

• Uso de prototipos y envoltorios como lo hice ahora, mi código depende del código de Google, si hacen un cambio importante en su fuente, esto se romperá.
• Si no lo entiende, no podrá repararlo si se rompe. Es poco probable que vayan a cambiar algo que pueda romper esto, pero aún así ...
• Si elimina un marcador manualmente, su referencia seguirá estando en el conjunto de marcadores. (Se puede editar mi método setMap para solucionarlo, pero a costa de un bucle marcadores mínimas matriz y la eliminación de la referencia)

Answer 2

google.maps.Map.prototype.markers = new Array(); 

google.maps.Map.prototype.addMarker = function(marker) { 
    this.markers[this.markers.length] = marker; 
}; 

google.maps.Map.prototype.getMarkers = function() { 
    return this.markers 
}; 

google.maps.Map.prototype.clearMarkers = function() { 
    for(var i=0; i<this.markers.length; i++){ 
     this.markers[i].setMap(null); 
    } 
    this.markers = new Array(); 
}; 

no creo que hay uno en V3, así que utiliza la costumbre anterior implementación.

Descargo de responsabilidad: No escribí este código pero olvidé retener una referencia cuando lo fusioné en mi código base, así que no sé de dónde vino.

Answer 3

La función "set_map" publicada en ambas respuestas parece que ya no funciona en la API de Google Maps v3.

Me pregunto qué pasó

Actualización:

Parece Google cambió su API de tal manera que "set_map" no es "setMap".

http://code.google.com/apis/maps/documentation/v3/reference.html

Answer 4

mismo problema. Este código ya no funciona.

He corregido ella, clearMarkers método de cambio de esta manera:

set_map (nulo) ---> setMap (nulo)

google.maps.Map.prototype.clearMarkers = function() { 
    for(var i=0; i < this.markers.length; i++){ 
     this.markers[i].setMap(null); 
    } 
    this.markers = new Array(); 
}; 

documentación ha sido actualizada para incluir más detalles sobre el tema: https://developers.google.com/maps/documentation/javascript/markers#remove

Answer 5

Simplemente haga lo siguiente:

I. declarar una variable global:

var markersArray = []; 

II. Definir una función:

function clearOverlays() { 
    for (var i = 0; i < markersArray.length; i++) { 
    markersArray[i].setMap(null); 
    } 
    markersArray.length = 0; 
} 

O

google.maps.Map.prototype.clearOverlays = function() { 
    for (var i = 0; i < markersArray.length; i++) { 
    markersArray[i].setMap(null); 
    } 
    markersArray.length = 0; 
} 

III. Presione los marcadores en 'markerArray' antes de llamar a lo siguiente:

markersArray.push(marker); 
google.maps.event.addListener(marker,"click",function(){}); 

IV. Llame a la función clearOverlays(); o map.clearOverlays(); donde sea necesario.

Eso es todo!

Answer 6

En la nueva versión v3, recomendaron tener en matrices. como siguiendo.

Ver muestra a overlay-overview.

var map; 
var markersArray = []; 

function initialize() { 
    var haightAshbury = new google.maps.LatLng(37.7699298, -122.4469157); 
    var mapOptions = { 
    zoom: 12, 
    center: haightAshbury, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 

    google.maps.event.addListener(map, 'click', function(event) { 
    addMarker(event.latLng); 
    }); 
} 

function addMarker(location) { 
    marker = new google.maps.Marker({ 
    position: location, 
    map: map 
    }); 
    markersArray.push(marker); 
} 

// Removes the overlays from the map, but keeps them in the array 
function clearOverlays() { 
    if (markersArray) { 
    for (i in markersArray) { 
     markersArray[i].setMap(null); 
    } 
    } 
} 

// Shows any overlays currently in the array 
function showOverlays() { 
    if (markersArray) { 
    for (i in markersArray) { 
     markersArray[i].setMap(map); 
    } 
    } 
} 

// Deletes all markers in the array by removing references to them 
function deleteOverlays() { 
    if (markersArray) { 
    for (i in markersArray) { 
     markersArray[i].setMap(null); 
    } 
    markersArray.length = 0; 
    } 
} 

Answer 7

Lo siguiente de Anon funciona perfectamente, aunque con parpadeos al despejar repetidamente las superposiciones.

Simplemente haga lo siguiente:

I. declarar una variable global:

var markersArray = []; 

II. Definir una función:

function clearOverlays() { 
    if (markersArray) { 
    for (i in markersArray) { 
     markersArray[i].setMap(null); 
    } 
    } 
} 

III. Empuje marcadores en la 'markerArray' antes de llamar a los siguientes:

markersArray.push(marker); 
google.maps.event.addListener(marker,"click",function(){}); 

IV. Llame a la función clearOverlays() donde sea necesario.

Eso es todo !!

Espero que te ayude.

Answer 8

me encontré con el uso de la biblioteca MarkerManager en el proyecto google-maps-utilidad-biblioteca-v3 como la manera más fácil.

1. Establecer el MarkerManager

mgr = new MarkerManager(map); 
google.maps.event.addListener(mgr, 'loaded', function() { 
    loadMarkers(); 
}); 

2. Agregar marcadores a la MarkerManager

function loadMarkers() { 
    var marker = new google.maps.Marker({ 
      title: title, 
      position: latlng, 
      icon: icon 
    }); 
    mgr.addMarker(marker); 
    mgr.refresh(); 
} 

3. Para borrar los marcadores sólo tiene que llamar a la función del MarkerManger clearMarkers()

mgr.clearMarkers(); 

Answer 9

Demostración Galería de Google tiene una demostración sobre cómo lo hacen:

http://code.google.com/apis/maps/documentation/javascript/examples/overlay-remove.html

Usted puede ver el código fuente para ver cómo añadir marcadores.

larga historia, que guarda los marcadores en una matriz global. Cuando los borre/borre, recorrerán la matriz y llamarán ".setMap (null)" en el objeto marcador dado.

Sin embargo, este ejemplo muestra un 'truco'. "Limpiar" para este ejemplo significa eliminarlos del mapa pero mantenerlos en la matriz, lo que permite que la aplicación los vuelva a agregar rápidamente al mapa. En cierto sentido, esto actúa como "esconderlos".

"Borrar" borra la matriz también.

Answer 10

acabo intentado esto con kmlLayer.setMap (nulo) y ha funcionado. No estoy seguro de si eso funcionaría con marcadores regulares, pero parece funcionar correctamente.

Answer 11

si utiliza el plugin gmap V3: $("#map").gmap("removeAllMarkers");

véase: http://www.smashinglabs.pl/gmap/documentation#after-load

Answer 12

Puede hacerlo de esta manera también:

function clearMarkers(category){ 
    var i;  

    for (i = 0; i < markers.length; i++) {       
    markers[i].setVisible(false);   
    }  
} 

Answer 13

for (i in markersArray) { 
    markersArray[i].setMap(null); 
} 

sólo se está trabajando en el IE.

---

for (var i=0; i<markersArray.length; i++) { 
    markersArray[i].setMap(null); 
} 

trabajando en Chrome, Firefox, es decir, ...

Answer 14

Para clara de todas las superposiciones de polígonos que incluyen, marcadores, etc ...

simplemente utilizar:

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);}

Aquí es una función que le escribí al hacerlo me formulario en una aplicación de mapas:

function clear_Map() { 
    directionsDisplay = new google.maps.DirectionsRenderer(); 
    //var chicago = new google.maps.LatLng(41.850033, -87.6500523); 
    var myOptions = { 
     zoom: 8, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: HamptonRoads 
    } 

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
    directionsDisplay.setMap(map); 
    directionsDisplay.setPanel(document.getElementById("directionsPanel")); 
} 

Answer 15

Sé que esto tal vez una solución simiple, pero esto es lo que hago

$("#map_canvas").html(""); 
markers = []; 

funciona todo el tiempo para mí.

Answer 16

Aquí se puede encontrar un ejemplo de cómo quitar marcadores:

https://developers.google.com/maps/documentation/javascript/examples/marker-remove?hl=es

// Add a marker to the map and push to the array. 
function addMarker(location) { 
    var marker = new google.maps.Marker({ 
    position: location, 
    map: map 
    }); 
    markers.push(marker); 
} 

// Sets the map on all markers in the array. 
function setAllMap(map) { 
    for (var i = 0; i < markers.length; i++) { 
    markers[i].setMap(map); 
    } 
} 

// Removes the markers from the map, but keeps them in the array. 
function clearMarkers() { 
    setAllMap(null); 
} 

// Deletes all markers in the array by removing references to them. 
function deleteMarkers() { 
    clearMarkers(); 
    markers = []; 
} 

Answer 17

I 'No sé por qué, pero, estableciendo setMap(null) a mis marcadores no funcionó para mí cuando yo m utilizando DirectionsRenderer.

En mi caso tuve que llamar setMap(null) a mi DirectionsRenderer también.

Algo así:

var directionsService = new google.maps.DirectionsService(); 
var directionsDisplay = new google.maps.DirectionsRenderer(); 

if (map.directionsDisplay) { 
    map.directionsDisplay.setMap(null); 
} 

map.directionsDisplay = directionsDisplay; 

var request = { 
    origin: start, 
    destination: end, 
    travelMode: google.maps.TravelMode.DRIVING 
}; 

directionsDisplay.setMap(map); 
directionsService.route(request, function (result, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(result); 
    } 
}); 

Answer 18

Este fue el más simple de todas las soluciones Iniciado por YingYang Mar 11 '14 a las 15: 049 bajo la respuesta original a los usuarios pregunta original

estoy usando su misma solución de 2,5 años más tarde con los mapas de Google v3.18 y funciona como un encanto

markersArray.push(newMarker) ; 
while(markersArray.length) { markersArray.pop().setMap(null); } 

// No need to clear the array after that. 

Answer 19

¿Quiere decir r etirar como en ocultarlos o eliminarlos?

si escondite:

function clearMarkers() { 
      setAllMap(null); 
     } 

si desea eliminarlos:

function deleteMarkers() { 
      clearMarkers(); 
      markers = []; 
     } 

aviso que utilizo una matriz de marcadores para realizar un seguimiento de ellos y reiniciarlo manualmente.

Answer 20

Una aplicación limpia y fácil de la respuesta de rolinger.

function placeMarkerAndPanTo(latLng, map) { 
     while(markersArray.length) { markersArray.pop().setMap(null); } 
     var marker = new google.maps.Marker({ 
     position: latLng, 
     map: map 
     }); 
     map.panTo(latLng); 

     markersArray.push(marker) ; 
    } 

Answer 21

Este es el método de Google a sí mismos ser usado en al menos una muestra:

var markers = []; 

// Clear out the old markers. 
markers.forEach(function(marker) { 
    marker.setMap(null); 
}); 
markers = []; 

control de la muestra Google, por ejemplo, código completo:

https://developers.google.com/maps/documentation/javascript/examples/places-searchbox

Answer 22

Sólo hay que pasar a través de los marcadores y retire a partir de un mapa, mapas vacíos marcadores matriz después de que:

var markers = map.markers; 
for(var i = 0; i < markers.length; i++) { 
    markers[i].setMap(null); 
} 
map.markers = []; 

Answer 23

apenas claro Googlemap

mGoogle_map.clear(); 

Answer 24

La solución es muy fácil. Es posible utilizar el método: marker.setMap(map);. Aquí, define en qué mapa aparecerá el pin.

Por lo tanto, si configura null en este método (marker.setMap(null);), el pin desaparecerá.

---

Ahora, puede escribir una función que, si bien hace desaparecer todos los marcadores en su mapa!

Tan sólo ha de poner los alfileres en una matriz y declara con markers.push (your_new pin) o este código, por ejemplo:

// Adds a marker to the map and push to the array. 
function addMarker(location) { 
    var marker = new google.maps.Marker({ 
    position: location, 
    map: map 
    }); 
    markers.push(marker); 
} 

Ésta es una función que puede poner o desaparecer todos los marcadores de la matriz en el mapa:

// Sets the map on all markers in the array. 
    function setMapOnAll(map) { 
    for (var i = 0; i < markers.length; i++) { 
     markers[i].setMap(map); 
    } 
    } 

Para desaparecer todos sus marcadores, debe llamar a la función con nulo:

// Removes the markers from the map, but keeps them in the array. 
    function clearMarkers() { 
    setMapOnAll(null); 
    } 

Y, para eliminar y desaparecer, todos sus marcadores, debe restablecer la matriz de marcadores de la siguiente manera:

// Deletes all markers in the array by removing references to them. 
    function deleteMarkers() { 
    clearMarkers(); 
    markers = []; 
    } 

---

Este es mi código completo. Sé atención integral puede reemplazar YOUR_API_KEY en el código de su API de Google clave:

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Remove Markers</title> 
    <style> 
    /* Always set the map height explicitly to define the size of the div 
    * element that contains the map. */ 
    #map { 
     height: 100%; 
     } 
    </style> 
</head> 
<body> 

<div id="map"></div> 
<p>Click on the map to add markers.</p> 
<script> 

    // In the following example, markers appear when the user clicks on the map. 
    // The markers are stored in an array. 
    // The user can then click an option to hide, show or delete the markers. 
    var map; 
    var markers = []; 

    function initMap() { 
    var haightAshbury = {lat: 37.769, lng: -122.446}; 

    map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 12, 
     center: haightAshbury, 
     mapTypeId: 'terrain' 
    }); 

    // This event listener will call addMarker() when the map is clicked. 
    map.addListener('click', function(event) { 
     addMarker(event.latLng); 
    }); 

    // Adds a marker at the center of the map. 
    addMarker(haightAshbury); 
    } 

    // Adds a marker to the map and push to the array. 
    function addMarker(location) { 
    var marker = new google.maps.Marker({ 
     position: location, 
     map: map 
    }); 
    markers.push(marker); 
    } 

    // Sets the map on all markers in the array. 
    function setMapOnAll(map) { 
    for (var i = 0; i < markers.length; i++) { 
     markers[i].setMap(map); 
    } 
    } 

    // Removes the markers from the map, but keeps them in the array. 
    function clearMarkers() { 
    setMapOnAll(null); 
    } 

    // Shows any markers currently in the array. 
    function showMarkers() { 
    setMapOnAll(map); 
    } 

    // Deletes all markers in the array by removing references to them. 
    function deleteMarkers() { 
    clearMarkers(); 
    markers = []; 
    } 

</script> 
    <script async defer 
    src="https://maps.googleapis.com/maps/api/js key=YOUR_API_KEY&callback=initMap"> 
    </script> 
</body> 
</html> 

---

Puede consultar google developer o la documentación completa aquí en, también, google developer web site.

Answer 25

Debe establecer el mapa nulo en ese marcador.

var markersList = [];  

function removeMarkers(markersList) { 
    for(var i = 0; i < markersList.length; i++) { 
     markersList[i].setMap(null); 
    } 
} 

function addMarkers() { 
    var marker = new google.maps.Marker({ 
     position : { 
      lat : 12.374, 
      lng : -11.55 
     }, 
     map : map 
     }); 
     markersList.push(marker); 
    } 

Answer 26

El uso de este se puede eliminar todo el marcador del mapa.

map.clear(); 

Esto le ayudaría, que me ayude ..

Answer 27

Para eliminar todos los marcadores del mapa crear funciones algo como esto:

1.addMarker (ubicación): esta función utiliza para añadir marca en el mapa

2.clearMarkers(): esta función eliminar todos los marcadores de mapa, no de la matriz

3.setMapOnAll (mapa): esta función se utiliza para añadir marcador s info en array

4.deleteMarkers(): esta función borra todos los marcadores en la matriz eliminando las referencias a ellos.

// Adds a marker to the map and push to the array. 
     function addMarker(location) { 
     var marker = new google.maps.Marker({ 
      position: location, 
      map: map 
     }); 
     markers.push(marker); 
     } 


// Sets the map on all markers in the array. 
     function setMapOnAll(map) { 
     for (var i = 0; i < markers.length; i++) { 
      markers[i].setMap(map); 
     } 
     } 



// Removes the markers from the map, but keeps them in the array. 
    function clearMarkers() { 
    setMapOnAll(null); 
    } 

// Deletes all markers in the array by removing references to them. 
     function deleteMarkers() { 
     clearMarkers(); 
     markers = []; 
     } 

Answer 28

He encontrado una solución simple (creo):

var marker = new google.maps.Marker(); 

function Clear(){ 
    marker.setMap(null); 
} 

Answer 29

utilizo una abreviatura que hace bien el trabajo. Sólo hacer

map.clear(); 

Answer 30

He intentado todas las soluciones propuestas, pero nada funcionó para mí, mientras que todos mis marcadores estaban bajo un clúster. el tiempo me acaba de poner esto:

var markerCluster = new MarkerClusterer(map, markers, 
    { imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m' }); 
agentsGpsData[agentGpsData.ID].CLUSTER = markerCluster; 

//this did the trick 
agentsGpsData[agentId].CLUSTER.clearMarkers(); 

En otras palabras, si usted envuelve marcadores en un clúster y desea eliminar todos los marcadores, se llama:

clearMarkers();