Déplacer les marqueurs Google Maps à la sourisL’exemple ci-dessous propose de déplacer un marqueur à l’aide de la souris en utilisant la technique dites « drag & drop ». Pour cela, il est nécessaire d’indiquer au marqueur dans un premier temps que celui-ci à la possibilité d’être déplacer : d’où le « {draggable: true} » en second paramètres du constructeur « GMarker ».
Ensuite, mais cela reste facultatif, il est possible d’attacher des « listeners » qui vont intervenir lors des différents évènements engendrés par le déplacement du marqueur. Dans notre cas, seuls les évènements « dragstart » et « dragend » seront pris en compte./* Création du marqueur attaché au point
* Le marqueur est ici déplaçable à l'aide de la souris
*/
var marker = new GMarker(point, {draggable: true});
/* Lorsque son déplacement commence, on ferme l'info-bulle */
GEvent.addListener(marker, "dragstart", function() {
map.closeInfoWindow();
});
/* Lorsque son déplacement se termine, on affiche l'info-bulle */
GEvent.addListener(marker, "dragend", function() {
marker.openInfoWindowHtml("Bien joué !");
}); Un marqueur déplaçable La liste complète des évènements Google Maps pour l’API 2 est disponible à l’adresse ci-dessous au niveau de la partie « Events » :
Consulter la liste des évènements Google Maps. Visualiser l’exemple du marqueur « drag & drop ». Télécharger les sources de cet exemple.
|