Google Maps API v3: How to remove all markers?

google-maps, google-maps-api-3, html, javascript

Solution

Simply do the following:

I. Declare a global variable:

var markersArray = [];

II. Define a function:

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

OR

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

III. Push markers in the 'markerArray' before calling the following:

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

IV. Call the `clearOverlays();` or `map.clearOverlays();` function wherever required.

That's it!!

Problem

In Google Maps API v2, if I wanted to remove all the map markers, I could simply do: ``` map.clearOverlays(); ``` How do I do this in Google Maps API v3? Looking at the Reference API, it's unclear to me.

Original source

Related problems