Discussion :

[akrogames]

Bonjour,

Je travail actuellement avec google maps api v3 mais pour obtenir les coordonnées d'une adresse j'ai un peu de mal.

Voici 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
 
function codeAddress(address) {
	if (geocoder) {
		coordonnee = geocoder.geocode( { 'address': address}, function(results, status) {
	        if (status == google.maps.GeocoderStatus.OK) {
	          map.setCenter(results[0].geometry.location);
	          coordonnee = results[0].geometry.location;
	        } else {
	          alert("Geocode was not successful for the following reason: " + status);
	        }
      });
    }
}

Quand j'ajoute un alert dans :

Code :

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

1
2
3
4
5
6
 
if (status == google.maps.GeocoderStatus.OK) {
	          map.setCenter(results[0].geometry.location);
	          coordonnee = results[0].geometry.location;
alert(coordonnee);
	        }

J'obtiens bien les coordonnées mais quand je fais mon alert ou que j'essaye de faire un return de coordonnee il ne connait plus la variable et me dit "undefined" alors je pense que c'est normal vu que c'est une requete asynchrone sur un serveur distant mais comment enregistrer mes coordonnees.

Bonne journée merci d'avance

PS: Un sujet similaire à été créé sur ce forum mais ne répond pas à ma question... Comment récupérer cette variable avec ajax ?

[emmanuel.remy]

Salut,

Ta variable coordonnee semble être globale donc a priori tu n'es pas confronté à un souci de portée de variable (sauf à ne pas avoir tout le code).

Ce n'est pas normal que ton alert n'affiche rien s'il est positionné comme tu l'indiques.

Quant au return dont tu parles (je suppose que tu fais un return coordonnee dans la fonction codeAddress), il n'a pas grand sens car ta fonction geocoder.geocode est asynchrone, donc tu n'as pas encore les coordonnées au moment du return.

C'est ta fonction de callback qui doit faire le traitement, et aucune autre. Et si tu souhaites accéder plus tard à tes coordonnées, assure toi seulement que ta variable coordonnee soit globale.

ERE

[akrogames]

C'est vraiment bizarre alors.... ma variable coordonnee est globale je l'ai déclaré en dehors de toutes fonctions tout en haut de mon fichier JS. Pourtant je n'accède pas à la valeur de coordonnee après... Je ne comprend pas c'est pour cela que je poste...

Tu veux pas essayer avec moi pour voir ce qui ne va pas ?

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
 
var geocoder = new google.maps.Geocoder();
var map;
var coordonnee = null;
 
$(document).ready(function() {
	initialize();
});
 
function initialize() {
	geocoder = new google.maps.Geocoder();
 
    var latlng = new google.maps.LatLng(47.2214229,5.9680312 );
 
    var myOptions = {
      zoom: 11,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
 
    map = new google.maps.Map(document.getElementById("map"), myOptions);
 
    //On récupère les coordonnées de l'adresse de la personne
    codeAddress(adresse);
   alert(coordonnee);
}
 
 
 
function codeAddress(address) {
	if (geocoder) {
		coordonnee = geocoder.geocode( { 'address': address}, function(results, status) {
	        if (status == google.maps.GeocoderStatus.OK) {
	          map.setCenter(results[0].geometry.location);
	          coordonnee = results[0].geometry.location;
 
	          //Pour le debuguage de lappli
	          var marke = new google.maps.Marker({
	              position: coordonnee, 
	              map: map, 
	              title: "adress"
	          }); 
 
	        } else {
	          alert("Geocode was not successful for the following reason: " + status);
	        }
      });
    }
}

Je te remercie par avance.

[emmanuel.remy]

Re,

C'est ce que je te disais: c'est lié à l'aspect asynchrone. Tu écris:

Code :

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

1
2
    codeAddress(adresse);
   alert(coordonnee);

or la fonction geocoder.geocode appelée dans codeAddress est asynchrone, donc quand ta fonction codeAdress se termine, geocoder.geocode est encore en cours d'exécution, d'où une erreur sur le alert.

Tu dois faire:

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
var geocoder = new google.maps.Geocoder();
var map;
 
$(document).ready(function() {
	initialize();
});
 
function initialize() {
	geocoder = new google.maps.Geocoder();
 
    var latlng = new google.maps.LatLng(47.2214229,5.9680312 );
	
    var myOptions = {
      zoom: 11,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    
    map = new google.maps.Map(document.getElementById("map"), myOptions);
    
    //On récupère les coordonnées de l'adresse de la personne
    codeAddress(adresse);
    //
}
 
 
function codeAddress(address) {
	
  if (geocoder) {
		geocoder.geocode( { 'address': address}, function(results, status) {
	        if (status == google.maps.GeocoderStatus.OK) {
	          map.setCenter(results[0].geometry.location);
	          var coordonnee = results[0].geometry.location;
	          
            /* ICI LE CODE DE TRAITEMENT */
            alert(coordonnee);)
            
            
	          //Pour le debuguage de lappli
	          var marke = new google.maps.Marker({
	              position: coordonnee, 
	              map: map, 
	              title: "adress"
	          }); 
	          
	        } else {
	          alert("Geocode was not successful for the following reason: " + status);
	        }
      });
    }
}

C'est ta fonction anonyme passée à geocode qui fait le traitement. Note que depuis cette fonction tu pourrais appeler une autre fonction si cela te parait plus simple:

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
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
// JavaScript Document
var geocoder = new google.maps.Geocoder();
var map;
 
$(document).ready(function() {
	initialize();
});
 
function initialize() {
	geocoder = new google.maps.Geocoder();
 
    var latlng = new google.maps.LatLng(47.2214229,5.9680312 );
 
    var myOptions = {
      zoom: 11,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
 
    map = new google.maps.Map(document.getElementById("map"), myOptions);
 
    //On récupère les coordonnées de l'adresse de la personne
    codeAddress(adresse);
    //
}
 
/* le traitement à appliquer quand on obtient une coordonnée */ 
function doOnCoordonnee(coordonnee) {
    alert(coordonnee);
} 
 
function codeAddress(address) {
 
  if (geocoder) {
		geocoder.geocode( { 'address': address}, function(results, status) {
	        if (status == google.maps.GeocoderStatus.OK) {
	          map.setCenter(results[0].geometry.location);
	          var coordonnee = results[0].geometry.location;
 
            //ICI LE CODE DE TRAITEMENT
	          doOnCoordonnee(coordonnee);
 
	          //Pour le debuguage de lappli
	          var marke = new google.maps.Marker({
	              position: coordonnee, 
	              map: map, 
	              title: "adress"
	          }); 
 
	        } else {
	          alert("Geocode was not successful for the following reason: " + status);
	        }
      });
    }
}

ERE

[ceweb]

Bonjour,

comment on obtient la génération des codes Lat/Lng des villes de France avec l'Api Google map V3 sans utiliser de base de données ou de conversion csv ?

Ci dessus tout est basé sur

Code :

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

var latlng = new google.maps.LatLng(47.2214229,5.9680312 );

Avec ma version d'Api Google map V2 j'allais chercher les villes dans ma base pour afficher les cartes sans convertir en Lat/Lng

Code :

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

<li><b id="adresse">'.$adresse.', '.$cp.' '.$ville.', France</b></li>

et dans mon fichier js

Code :

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

var adresse = $('#adresse').text();

Comment je pourrai faire pour garder mon code (xhtml) et convertir les villes en Lat/Lng pour utiliser cette valeur dans l'Api Google map V3

merci d'avance pour le coup de main

Voici mon code JS que je n'arrive pas à convertir
(désolé pour la longueur du post

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
35
36
37
38
	//initilaisation des variables
	var map = null;
	var geocoder = null;	  
function load() {
	if (GBrowserIsCompatible()) {		
//ajout des options et ADSENSES pour la barre de recherche interne dans la carte   
var mapOptions = {
googleBarOptions : {
style : "new",
}}  
//nouvel objet de type Map	
map = new GMap2(document.getElementById("map"), mapOptions);	
//affichage des contrôleurs de zoom, ...
map.setUIToDefault();
map.enableGoogleBar();    
//nouvel Objet de géocodeur
geocoder = new GClientGeocoder();
}         
//récupération des valeurs des champs d'adresse et nom    
var adresse = $('#adresse').text();
var nom = $('#nom').text();    
if (geocoder) {
geocoder.getLatLng(
adresse,function(point) {
//si l'adresse n'existe pas on l'affiche
if (!point) {
alert(adresse + " introuvable");
} else {
//centrer la carte sur les coordonnées. le chiffre 13 correspond au zoom de visualisation de la carte
map.setCenter(point, 13);
//initialisation du pointer (flêche rouge)
var marker = new GMarker(point);
map.addOverlay(marker);
//création des informations affichées sur le pointeur
marker.openInfoWindowHtml(nom +"<br />"+adresse);
}});}}
// appelle de la fonction d'initailisation et de chargement de la page dès que google est ok.   
google.setOnLoadCallback(load)

Et le code html

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
<!-- Show map from Google map -->
<div id="coordonnee">
<ul>
<li><b id="nom">Ce service est offert Google Map</b><br /></li>
</ul>
<br />
<ul>
<li><b>Plan d\'accès à la ville de : '.$ville.'</b></li>
<li><b id="adresse">'.$adresse.', '.$cp.' '.$ville.', France</b></li>
</ul>
</div>
<div id="map">En cours de chargement</div>
<!-- END Show map from Google map -->