MarkerClusterer - Optimal Method for Handling large amounts of Data in the Google Map API

This library, which is written by Xiaoxi Wu and is part of the Google Maps Open Source Utility Library is easy to use and shows excellent performance.

Like some of the other libraries it reduces the number of visible markers by clustering them together making it easier to get an overview. Watch the image below to see how.

Image by Xiaoxi Wu

It’s constructor takes three arguments, the first one being a reference to the map, the second one being an array of GMarkers and the third one being an object literal with options. Only the first one is required.

var markerCluster = new MarkerClusterer(map, markers, opts);

So to add a bunch of markers to the map having the default settings of the MarkerClusterer you do this:

view plaincopy to clipboardprint?

1. var markers = [];  
2. // Insert code to fill the markerArray with markers...  
3. // Creating a new cluster by adding the map and the array of markers  
4. var markerCluster = new MarkerClusterer(map, markers);  

See the documentation for a full explanation of the library and it’s capabilities. Also read MarkerClusterer: A Solution to the Too Many Markers Problem on the Google Geo Developer blog for more information.

Download markerclusterer.js