Bonsoir,

J'ai un petit problème avec un code censé afficher des repères et créer les infobulles pour chacun des ces repères. Les info bulles doivent s'afficher au clic sur le repère.
Voici le code :

var batiments = 
[
  new google.maps.Marker({ position: new google.maps.LatLng(45.066624, 4.312027), map: carte, draggable: false, animation: google.maps.Animation.DROP, zIndex: 3 }),
  new google.maps.Marker({ position: new google.maps.LatLng(45.066824, 4.311965), map: carte, draggable: false, animation: google.maps.Animation.DROP, zIndex: 1 }),
  new google.maps.Marker({ position: new google.maps.LatLng(45.066464, 4.311815), map: carte, draggable: false, animation: google.maps.Animation.DROP, zIndex: 2 }),
  // Et encore plus ...
];

var batBulles = 
[
  new google.maps.InfoWindow({ content: 'Le bâtiment administratif', maxWidth: 400 }),
  new google.maps.InfoWindow({ content: 'L\'internat "Sangree"', maxWidth: 400 }),
  new google.maps.InfoWindow({ content: 'Le foyer Theis', maxWidth: 400 }),
  // Et encore plus ...
];
	
for(var i = 0; i < batiments.length; i++)
{
  google.maps.event.addListener(batiments[i], 'click', function() { batBulles[i].open(carte, batiments[i]); });
}

Merci d'avance de votre aide,

willys

Au pif :

for(var i = 0; i < batiments.length; i++)
{
    (function(i) {
        google.maps.event.addListener(batiments[i], 'click', function() { batBulles[i].open(carte, batiments[i]); });
    }(i));
}

?

Bonjour,

Très bon pif !
Par contre je comprends pas vraiment ? Un explication serait bienvenue.

@+

C'est un peu compliqué à expliquer.

En fait, la fonction anonyme utilisée dans l'événement ne capture pas la valeur de la variable i.
Cela signifie que la variable continue d'évoluer dans la boucle, et de s'incrémenter.

Lorsque la boucle sera terminé, i sera égal à batiments.length.

Et lorsque l'événement sera déclenché, c'est cette valeur finale de i qui sera utilisée... et non pas la valeur qu'elle avait au moment de l'utilisation de la fonction anonyme.

Utiliser une closure (cette fonction déclarée et exécutée immédiatement) en passant i en paramètre permet de capturer la valeur de i à l'intérieur de cette fonction.
Ainsi, la fonction anonyme a accès à cette valeur capturée. Et lorsque l'événement se déclenchera, i aura la bonne valeur.

Plus d'informations dans ce tuto :
Les closures en JavaScript

Pense à mettre ton sujet en résolu à l'aide du bouton approprié


EDIT : Notons que dans le tuto, la closure n'est pas utilisée au même endroit. Mais personnellement, je préfère faire comme dans mon précédent post : c'est légèrement plus court, et plus clair également.

Merci