Fire event after MarkerClusterer has finished

Question

So I have an application that contains a map with (several hundreds) of markers. I use the markerclusterer.js supplied by Google to cluster my markers and make the whole thing easier to look at. I'm using API V3.

I'm fine with all of that. But what I would like to do is perform some action when the markerclusterer has finished clustering all the markers. I've tried to do it myself but with no look.

Any suggestions? (I'm assuming this will be easier than I think and my brain is just fried)

Answer 1

I was just wondering the same thing. This is how I did it:

google.maps.event.addListener(markerClusterer, 'clusteringend', myFunction);

Answer 2

Will the map "idle" event work for you? It should fire once the MarkerClusterer has finished (assuming you are loading the MarkerClusterer when the page loads).

Answer 3

It seems this library is not being maintained. It does not work with v3 properly for years and no solution has been developed.

So, I downloaded the non-minimised version and put it into source code for the projects I am working. Accepted solution will only work(for v3) if you make the below changes directly in the library:

find createClusters_ function add google.maps.event.trigger(this, "clusteringend", this); after the for loop. So it will look like below:

MarkerClusterer.prototype.createClusters_ = function() {
  if (!this.ready_) {
    return;
  }

  // Get our current map view bounds.
  // Create a new bounds object so we don't affect the map.
  var mapBounds = new google.maps.LatLngBounds(this.map_.getBounds().getSouthWest(),
      this.map_.getBounds().getNorthEast());
  var bounds = this.getExtendedBounds(mapBounds);

  for (var i = 0, marker; marker = this.markers_[i]; i++) {
    if (!marker.isAdded && this.isMarkerInBounds_(marker, bounds)) {
      this.addToClosestCluster_(marker);
    }
  }
  google.maps.event.trigger(this, "clusteringend", this);
};

Now you can use:

google.maps.event.addListener(markerClusterer, 'clusteringend', myFunction);