Discussion :

[mld_webcom2d]

Bonjour a tous,

j'essaie de récupérer des coordonnées gps de villes avec google map. Je me prend la tête sur un bête petit problème :
gclient.getLatLng, qui renvoie des coordonées d'après une chaine prend en argument une chaine de caractère et une fonction callback a laquelle elle envoie un objet GLatLng.
J'essaie de faire passer un indice de tableau en plus de cet objet mais pas moyen...
Les coordonnées s'affichent bien avec le alert alert("insee:"+" "+latln.lat()+","+latln.lng());
mais le alert(i); m'indique "undefined"
Quelqu'un aurait-il une solution ?
Merci...

PS : j'avais déjà essayer avec juste test(latln, i) à la place de function(latln, i){alert(i);test(latln, i)}) comme callback.


Voici le code en question :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function gmap_sql(responseObject)
{
	chaine = new Array();
	var gclient = new GClientGeocoder;
	for(var i=0; typeof(responseObject[i]) !="undefined"; i++)
	{
	var loader = document.createElement('div');
    loader.innerHTML = responseObject[i].chaine+" "+responseObject[i].insee ;
	chaine[i] = responseObject[i].chaine ;
	insee[i] = responseObject[i].insee ;
 
//########## ICI #########
	gclient.getLatLng(chaine[i]+" "+insee[i],function(latln, i){alert(i);test(latln, i)});
 
    document.getElementById("cont").appendChild(loader);
	}
}
//Callback
function test(latln,i)
{
 
alert("insee:"+" "+latln.lat()+","+latln.lng());
 
}

[DoubleU]

Essaie ca:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
var cb = function(_i)
{
  return function(latln)
  {
    alert(_i)
    test(latln, _i);
  }
}(i)
 
gclient.getLatLng(chaine[i]+" "+insee[i],cb);

[mld_webcom2d]

merci d'avoir répondu mais ça ne fonctionne pas (les alert ne se déclenchent pas)...
J'ai trouvé quelque chose qui marche presque :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
for(var i=0; typeof(responseObject[i]) !="undefined"; i++)
{
...
gclient.getLatLng(chaine[i]+" "+insee[i],function(latln){
			test(i,latln)});
...
}
 
function test(_i,latln)
{
alert(_i); 
alert(latln.lat()+","+latln.lng());
}

Le gros problème, c'est que le alert(_i) m'affiche toujours le dernier indice du tableau. Je suppose que les fonctions callback sont stockées dans une pile d'appel et lorsque qu'elles démarrent la boucle for est déjà terminée donc i vaut le dernier indice...

[mld_webcom2d]

autrement i doit passer par référence et pas par valeur...
quelqu'un peut-il m'aider ?

[DoubleU]

Le gros problème, c'est que le alert(_i) m'affiche toujours le dernier indice du tableau. Je suppose que les fonctions callback sont stockées dans une pile d'appel et lorsque qu'elles démarrent la boucle for est déjà terminée donc i vaut le dernier indice...

Normalement, la syntaxe que je t'ai donné résoud ce problème.
Fais voir comment tu l'as retranscrite?

[mld_webcom2d]

ça à l'air de fonctionner de cette manière :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
function gmap_sql(responseObject)
{
 
	var gclient = new GClientGeocoder;
	for(var i=0; typeof(responseObject[i]) !="undefined"; i++)
	{
	var loader = document.createElement('div');
    loader.innerHTML = responseObject[i].chaine+" "+responseObject[i].insee ;
	chaine = responseObject[i].chaine ;
	insee = responseObject[i].insee ;
	  document.getElementById("cont").appendChild(loader);
	  gclient.getLatLng(chaine[i]+" "+insee[i],
		function(_i)
		 {
		  return function(latln)
		  {
		    test(latln, _i);
		  }
		}(i)
		);
  }
 
}
function test(latln, _i)
{
alert(_i);
alert("insee:"+" "+latln.lat()+","+latln.lng());
lat= latln.lat();
lng = latln.lng();

Merci beaucoup, maintenant yapluka (enfin, j'espère)... !

Par contre, je débute avec ce genre d'utilisation de javascript et je ne comprend pas la syntaxe (pourquoi ne passe-t-on pas latln dans la function callback ?, l'histoire du return function, et le paramètre qu'on passe avec (i))...
Si tu sais où trouver un tutoriel là dessus, je suis preneur.

[DoubleU]

C'est vrai qu'au premier abord, c'est assez complexe ^^

En fait, tu déclares une fonction qui va prendre en argument le ou les paramètres que tu veux passer, et tu l'exécutes immédiatement avec ces arguments

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
var f = function(_i)
{
// ..
}(i)

De cette façon, tu vas créer un contexte d'exécution qui va préserver ces variables pour tout le code que tu exécutes dans la fonction (c'est ce qui va te permettre par exemple d'éviter que ton i vaille toujours la dernière valeur dans ta boucle).

Ensuite, à l'intérieur de cette fonction tu vas déclarer une fonction anonyme, avec en paramètres les arguments que le callback va te passer (un point je crois dans le cas de ton GClientGeocoder), qui va donc avoir accès aux variables du contexte que tu viens de créer, et tu la retournes de suite.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
  return function(latln)
  {
    alert(_i)
    test(latln, _i);
  }

Comme ca, quand tu exécutes la ligne, tu crées bien un callback qui prend un seul argument et qui à accès à des variables qui seraient normalement hors de son contexte d'exécution.

[mld_webcom2d]

Merci vraiment pour cette solution et son explication tu m'enleve une grosse épine du pied!

Une dernière question si tu as le temps comme tu as l'air de maitriser le sujet.
Voici maintenant mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
function gmap_sql(responseObject)
{
 
	var gclient = new GClientGeocoder;
	for(var i=0; typeof(responseObject[i]) !="undefined"; i++)
	{
	var loader = document.createElement('div');
    loader.innerHTML = responseObject[i].chaine+" "+responseObject[i].insee ;
	chaine[i] = responseObject[i].chaine ;
	//insee[i] = responseObject[i].insee ;
	  document.getElementById("cont").appendChild(loader);
	  gclient.getLatLng(chaine[i]+" "+responseObject[i].insee,
		function(_insee, _i)
		 {
		  return function(latln)
		  {
		    test(latln, _insee, _i);
		  }
		}(responseObject[i].insee, i)
		);
 
      }
	setTimeout("timer()",3000);
}
function test(latln, _insee, _i)
{
lat[_i] = latln.lat();
lng[_i] = latln.lng();
insee[_i] = _insee;
alert("i:"+_i+" insee:"+insee[_i]+" "+lat[_i]+","+lng[_i]);
}
function timer(){
	alert("timer insee:"+insee[1]+" "+lat[1]+","+lng[1]);
}

Je rempli un des tableaux globaux pour ensuite les envoyer en ajax et faire une requete d'update.
Je n'ai pas trouvé d'autre solution pour attendre la fin du remplissage des tableaux que le setTimeout... Ici c'est pas très génant car il s'agit d'un script que je n'executerai qu'une fois sur mon pc, avec un timeout large ça devrait passer.
Mais j'imagine qu'il y a beaucoup plus propre pour faire du temps réel en production...
Si tu as (ou quelqu'un d'autre aurait) une piste ?

[DoubleU]

Je ne suis pas sur d'avoir bien compris, mais si c'est ce que je pense, tu n'as qu'a rajouter un paramètre à ton callback pour lui dire s'il vient de traiter la dernière valeur de ton tableau. Dans ce cas, tu appelles ta fonction ajax pour faire ton update.

Quelque chose dans ce genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
		function(_insee, _i, _isLast)
		 {
		  return function(latln)
		  {
		    test(latln, _insee, _i);
                    if(_isLast) 
                      doUpdate();
		  }
		}(responseObject[i].insee, i, i==responseObject.length)

[mld_webcom2d]

ok ça marche nickel à part que c'est i==responseObject.length-1, l'indice du tableau commençant à 0.
Encore une fois merci.
Je ne suis pas encore très à l'aise avec les callbacks et autres threads, tes explications m'ouvrent les portes.