Marker Manager

Tuesday, November 07, 2006 at 7:08:00 PM

With 2.67, we're releasing the new GMarkerManager class. The marker manager is our contribution toward helping users display many points on a map, and while it may not fit every scenario, we hope it will be useful as an "out-of-the-box" ready-made solution. It manages the task of displaying markers relevant to the user's viewport and zoom level. Your comments in the API Discussion Group are welcome and may help us with future improvements to this and other features of the API.

Marker Manager Example: Weather Map

The following example creates a mock weather map for Europe. At zoom level 3, 20 randomly distributed weather icons are displayed. At level 6, when all 200 cities with population over 300,000 are easily distinguished, an additional 200 markers are shown. Finally, at level 8, 1000 markers are shown. (Note: to simplify the example, markers will be added at random locations.)

function setupMap() {
 if (GBrowserIsCompatible()) {
   map = new GMap2(document.getElementById("map"));
   map.addControl(new GLargeMapControl());
   map.setCenter(new GLatLng(41, -98), 4);
   window.setTimeout(setupWeatherMarkers, 0);

function getWeatherMarkers(n) {
  var batch = [];
  for (var i = 0; i < n; ++i) {
    batch.push(new GMarker(getRandomPoint(), 
      { icon: getWeatherIcon() }));
  return batch;

function setupWeatherMarkers() {
  mgr = new GMarkerManager(map);
  mgr.addMarkers(getWeatherMarkers(20), 3);
  mgr.addMarkers(getWeatherMarkers(200), 6);
  mgr.addMarkers(getWeatherMarkers(1000), 8);

View example (weather_map.html)

Update: The link above used to link to an example showing how to use GMarkerManager. Since then, the GMarkerManager class has been open-sourced here and the internal class has been deprecated. Check out the version using the open source library here.