RSS Feed
^__^

Googlemaps Marker Clustering

,

Wer schonmal mehr als 50 Marker auf einer Googlemap unterzubringen hatte wird wissen, wie das auf die Performance gehen kann.

Um das Clustering Thema kommt man also früher oder später nicht herum.

Neben kommerziellen Lösungen (zB. mapToolKit)

gibt es auch, unscheinbar versteckt in den Weiten von GoogleCode, den opensource MarkerClusterer.
Anhand eines definierbaren Rasters werden benachbarte Marker dann zusammengefasst und durch die entsprechende Anzahl ersetzt.

Implementiert ist das Dingen zB. mit folgender Zeile:

var markerCluster = new MarkerClusterer(map, markers);

Auf den Beispielseiten hier und hier bekommt man einen ganz guten Eindruck was das Tool kann.

Auch die anderen mapTools der gmaps-utility-library sollte man sich mal anschauen, wenn man mit googleMaps zu tun hat.

8 responses to “Googlemaps Marker Clustering”

  1. Heißt das dann im Klartext, dass die Marker sozusagen nur per Kartenausschnitt geladen werden? Also wie so eine Art Datagrid-Pager, nur in 2D anstatt 1D?

  2. Max Girkens says:

    ich weiss garnicht in wie fern der den sichtbaren Bereich berücksichtig.

    Der kümmert sich vor allem um die Darstellung.
    Heisst du fütterst dem ein 400Marker JS array
    (kann ja gut sein, dass die alle im sichtbaren Bereich wären)
    und der malt trotzdem nur 10 Clustermarker auf die Map.

  3. Aye, genau das meinte ich. Klingt sehr interessant, vor allem wenn das Ding auch andere Datenquellen frisst wie bspw. sowas wie ‘n JsonService. Quasi gib’ dem Server die Koordinaten des aktuellen Kartenausschnitts und kriege nur die Marker, die gerade darzustellen sind…

  4. Max Girkens says:

    das kann man sich sonst auch selbst zusammenschrauben aus dem “moveend” event

    GEvent.addListener(map, "moveend", function() { doSomething(); });
    

    ( der auch änderung der zoomstufe einschliesst)
    und “map.bounds”:

    bounds = map.getBounds();
    var southWest = bounds.getSouthWest();
    var northEast = bounds.getNorthEast();
    	
    getResults( southWest.lat(), northEast.lat(), southWest.lng(), northEast.lng() );
    
    

    dann serverseitig nur die Daten für den entsprechenden Auschnitt holen.

  5. Aye, gut zu wissen… sowas brauch ich sicher mal irgendwann ;)

  6. Ralf Schmitt says:

    der MarkerClusterer ist wirklich ok bis ca. 1000 Punkte. dann lässt die Performance wieder deutlich nach. für alle grösseren sachen hab ich gute erfahrungen mit geocubes .

  7. Ingo says:

    Hoffe hier ließt noch einer, suche nämlich schon seit Tagen nach einer Lösung.

    Mein Problem ist, dass bei “moveend” die vorherigen Marker vom MarkerClusterer nicht entfernt werden. Es werden die neuen Cluster gebildet und angezeigt, die alten bleiben aber auch da. Ist aber nur bei “moveend” so, bei draggend oder zoomend ist das Problem nicht.

    Weiß einer Rat?

  8. Max Girkens says:

    tut es nicht vielleicht sowas schon?

    GEvent.addListener(map, "moveend", function() { 
    
        map.clearOverlays() 
    
    });
    

Leave a Reply

Your email address will not be published. Required fields are marked *