Markers multiples

Version imprimable

Markers multiples

Bonjour,

j'ai un petit probleme avec google maps :calim2:

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
function initialize()
{

// tableaux des points avec les noms a afficher dans la bulle
var TabPoints = ["38, rue St Dizier 54000 Nancy "," Place Stanislas 54000 Nancy","Rue Baron Louis 54000 Nancy","Rue Victor Poirel 54000 Nancy","3, rue Victor 54000 Nancy"];

var TabNoms=["HALL DU LIVRE - 38, rue St Dizier "," OFFICE DU TOURISME - Place Stanislas","MEDIATHEQUE – Rue Baron Louis","SALLE POIREL – Rue Victor Poirel","CINEMA KINEPOLIS - 3, rue Victor"];


if (GBrowserIsCompatible())
{
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(48.700,6.200),13);
geocoder = new GClientGeocoder();

function createMarker(point, number,texte)
{
var marker = new GMarker(point);
marker.value = number;
GEvent.addListener(marker,"click", function()
{
var myHtml = texte;
map.openInfoWindowHtml(point, myHtml);
});
return marker;
}
for (var i = 0; i< TabPoints.length; i++)
{
geocoder.getLatLng(
TabPoints[i],
function(point)
{
if (!point) {
alert(TabPoints[i]+"not found");
} else {

map.addOverlay(createMarker(point,i,TabNoms[i]));
}
});

}
}
}

Mon problème est que dans la fonction point (en gras) dans le code ne reconnai pas l'indice "i" de ma boucle plus précisement il me le met a 5 ( nombre d'élément dans mon tableau ).
J'ai un peu de mal a comprendre la, si quelqu'un pouvait m'expliquer ce serai gentil. :ccool:
merci d'avance

03/06/2009, 12h26
babou54

En faisant d'autre test j'ai découvert que "apparement" le boucle s'executait totalement avant d'exescuter la fonction point.
Ce qui est super bizard quand même c'est que les markers se placent correctement sur ma carte.

Code:

1
2
3
4
5
6
7
8
9
10
11
for (var i = 0; i< TabPoints.length; i++) {
geocoder.getLatLng(TabPoints[i], (function (index) {
    return function(point) {
        if (!point) {
            alert(TabPoints[index]+"not found");
        } else {
            map.addOverlay(createMarker(point,index,TabNoms[index]));
        }
    }
})(i)); // là on oblige le script à prendre la valeur courante de i
}

Un truc dans le genre peut-être ?

03/06/2009, 13h34
babou54

viii c'est ça !! merki :ccool:
Pourquoi y faut la fonction index ?? Enfin à quoi ca sert et pourquoi la valeur de i avant était fausse ??

Le problème c'est que dans le code du début, toutes les fonctions font référence au même i. Js est flemmard et execute les choses au dernier moment, donc pour toutes tes fonctions, i vaut 5.

Pour que ça marche il faut fixer le i pour chaque appel de map.overlay(). Donc il faut "enfermer" la bonne valeur du i quelque part. Les boucles n'ont pas de variables locales en js, donc pour ça on utilise une fonction. On doit crée une closure (documente toi sur le sujet si la suite n'est pas très clair…)

Ça sera peut-être plus clair comme ça :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 function returnFunction (index) { return function(point) { if (!point) { alert(TabPoints[index]+"not found"); } else { map.addOverlay(createMarker(point,index,TabNoms[index])); } }; } for (var i = 0; i< TabPoints.length; i++) { geocoder.getLatLng(TabPoints[i], returnFunction(i)); // là on oblige le script à prendre la valeur courante de i }
On rend la variable i, ayant la bonne valeur, locale à la fonction returnFunction. On garde la bonne valeur du i parce que en déclarant une fonction dans une fonction, on crée une closure. Donc index (ayant la bonne valeur) est une variable uniquement accessible à la fonction qui a été renvoyée. donc tes fonctions ne pointent plus vers le même i, mais vers des variables index, différente pour chaque itérations.

Je sais pas si c'est très clair… a faire ok, mais à expliquer… c'est moins mon fort.

03/06/2009, 14h35
babou54

Ok je vois en tout cas merci pour le coup de main et pour les explications :D