1 pièce(s) jointe(s)
Infobulle des marqueur - Api v3
Bonjour,
Je développe avec l'api v3 de Google Map.
J'ai réalisé une application me permettant d'afficher sur une carte les marqueurs correspondant à des adresses situées dans un fichier xml.
J'ai ajouté à ces marqueurs une infobulle afin d'indiquer le nom et l'adresse correspondante.
Or avec l'api V3, les infobulles restent ouvertes même quand on clique sur un autre marqueur.
Je cherche une solution pour retrouver le fonctionnement de la v2 qui fermait l'infobulle lorsqu'on cliquait sur un autre marqueur.
Voici la partie de code Javascript correspondante:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61
| /*
Fonction appellée au chargement de la page index.php
Parametres: les coordonnées du point de centrage de la carte et le niveau de zoom
*/
function load(lat,lng,zoom)
{
//Définition du point central de la carte
var coord_centre = new google.maps.LatLng(lat, lng);
//Définitions des options de la carte
var option = {
zoom: zoom,
center: coord_centre,
scaleControl: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
//Création de la carte dans le div correspondant et avec les options précédentes
map = new google.maps.Map(document.getElementById("div_map"), option);
//Instanciation d'un objet Geocoder pour conversion des adresses postales en coordonnées GPS
geocoder = new google.maps.Geocoder();
//Lecture du fichier xml et création des marqueurs
downloadUrl("markers.xml", function(data) {
var markers = data.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++)
{
CreerMarker(markers[i].getAttribute("nom"),markers[i].getAttribute("adresse"));
}
});
}
/*
Fonction de création des marqueurs
Parametres: l'adresse postale et le nom à afficher
*/
function CreerMarker(nom, adresse)
{
geocoder.geocode( { 'address': adresse}, function(results, status)
{
if (status == google.maps.GeocoderStatus.OK)
{
//Si adresse trouvée, création du marqueur
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location,
title: nom
});
//Ajout de la fenetre d'informations au marqueur
var contenu = nom+"<br />"+adresse;
var infowindow = new google.maps.InfoWindow({
content: contenu
});
//Création du listener du clic de souris sur le marqueur
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
else
{
alert("Géolocalisation échouée a cause de: " + status);
}
});
} |
Je vous ai joint également un screenshot du résultat pour illustrer le problème.
J'ai trouvé ceci sur un site, mais je ne suis pas arrivé à le mettre en pratique:
Citation:
Ok, one more question and I’m covered (I hope). I made all the different infowindows appear, how can I close the others when I click and open a new one?
Tried closeInfoWindow(); in the listener function but it disables all of them… :(
The easiest way to do this is to just have one instance of the InfoWindow object that you reuse over and over again. That way when you click a new marker the infoWindow is “moved” from where it’s currently at, to point at the new marker.
Use its setContent method to load it with the correct content.
Si vous avez une solution, je suis preneur.