MAJ 30/09/2022 : Attention, la bibliothèque mentionnée dans cet article n’est plus à jour. La nouvelle bibliothèque à utiliser se trouverait ici : https://github.com/googlemaps/js-markerclusterer

Curieusement, le regroupement de marqueurs n’est pas une fonctionnalité prévue dans l’API Google Maps pour Javascript, alors même qu’elle existe dans sa version Android.

On trouve néanmoins sur github une bibliothèque qui fait le boulot : Marker Clusterer. La documentation inclue n’est pas forcément très explicite, aussi essayerais-je de revenir sur cet article pour détailler les points importants.

Sachez tout de même qu’il est possible de créer une info-bulle (infowindow) sur un regroupement. La bibliothèque met à disposition un événement nommé « clusterclick ». Il suffit donc, après déclaration du Marker Clusterer, d’ajouter le code suivant :

google.maps.event.addListener(markerClusterer,'clusterclick',function(mCluster){
	infowindow.setContent('Le contenu de mon infobulle');
	infowindow.setPosition(mCluster.getCenter());
	infowindow.open(map.this)
});

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Bonjour, comment puis-je vous aider ?