Remove markers from markerClusterer

Zoé de Moffarts picture Zoé de Moffarts · Apr 10, 2014 · Viewed 15.8k times · Source

I am trying to create an interactive map with cluster that need to be displayed when user checks a box and removed when the box is unchecked again. So far everything is working well, the cluster work and everything, but I have noticed a strange behavior that I can't explain and fix : every time I uncheck the box and check it again, the number displayed in the cluster is incremented by the amount of marker in that region (so it somehow never gets reseted to zero when I do "clearMarkers"

Here is the code for the function concerned :

//Display or remove PREDICTED accident's markers.
function toDisplayPredictedAccidents ()
{
    //If the checkbox is checked : Display all the PREDICTED accident's markers.
    if(checkBoxPredicted.checked == true)
    {
        for (i = 0; i < predictedAccidentArray.length; i++) 
        {  
            marker = new google.maps.Marker
            ({
                position: new google.maps.LatLng(predictedAccidentArray[i][1], predictedAccidentArray[i][2]),
                icon : iconPredicted
            });
            markersPredicted.push(marker); //Put the created marker in an array.


           //Create the pop-up when we click on the marker.
           google.maps.event.addListener(marker, 'click', (function(marker, i)
           {
              return function() 
              {
                  infowindow.setContent(predictedAccidentArray[i][0]);
                  infowindow.open(map, marker);
              }
           })(marker, i));
        }
        markerClusterPredicted = new MarkerClusterer(map, markersPredicted);
    }
    else
    {
        clearPredictedMarkers();
        markerClusterPredicted.clearMarkers();

    }
}

//clearMarkers and setAllMap are related and aim to REMOVE all the PREDICTED accident's markers.
function clearPredictedMarkers() {
  setAllMapPredicted(null, markersPredicted);
}

function setAllMapPredicted(map, markersArray) 
{
  for (var i = 0; i < markersArray.length; i++) 
  {
     markersPredicted[i].setMap(map);
  }
}

Anyone knows how to fix this behavior ? :)

Answer

Kuba Šimonovsk&#253; picture Kuba Šimonovský · May 16, 2017

Just for anyone who is searching on the internet for actual answer (since this question is very old):

var markerCluster = new MarkerClusterer(map, markers);

markerCluster.clearMarkers();

this will remove all markers in markerCluster.

Everything can be found here: https://googlemaps.github.io/js-marker-clusterer/docs/reference.html¨

Update 10.11.2020

js-marker-clusterer has moved and the old repo is no longer maintained. Instead, you should use https://github.com/googlemaps/v3-utility-library