11548 sujets

JavaScript, DOM et API Web HTML5

[résolu] Aide pour conversion code google map API V2 --> V3

Bonjour,

Pour l'une de mes pages, j'utilise un code de l'API V2 de google map. Ce code étant déprécié, je souhaite le convertir à la V3.
Voici le code :

var map = null;
    var geocoder = null;
	var marker;

    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(50.507504,2.484883), 8);
        geocoder = new GClientGeocoder();
		map.setUIToDefault();
      }


    }
	
	function showVille(ville) {
      if (geocoder) {
        geocoder.getLatLng(
          ville,
          function(point) {
            if (!point) {
              alert(ville + " not found");
            } else {
              map.setCenter(point, 11);
            }
          }
        );
      }
    }
	
	function addVille(ville) {
	document.getElementById('submit').disabled=true;
	geocoder = new GClientGeocoder();
		  if (geocoder) {
			geocoder.getLatLng(
			  ville,
			  function(point) {
				if (!point) {
				  alert(ville + " not found");
				} else {
				document.getElementById('position').value=point;
				document.getElementById('submit').disabled=false;
				}
			  }
			);
		  }
		}


J'ai bien essayé de remplacer par exemple le code
geocoder = new GClientGeocoder();
par
geocoder = new google.maps.Geocoder();

sans succès

Merci de votre aide.
Modifié par CyberNord (30 Jan 2011 - 21:13)
<script type="text/javascript">
	
	var map = null;
    var geocoder = null;
	var marker;

    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(50.507504,2.484883), 8);
        geocoder = new GClientGeocoder();
		map.setUIToDefault();
      }


    }
	
	function showVille(ville) {
      if (geocoder) {
        geocoder.getLatLng(
          ville,
          function(point) {
            if (!point) {
              alert(ville + " not found");
            } else {
              map.setCenter(point, 11);
            }
          }
        );
      }
    }
	
	function addVille(ville) {
	document.getElementById('submit').disabled=true;
	geocoder = new GClientGeocoder();
		  if (geocoder) {
			geocoder.getLatLng(
			  ville,
			  function(point) {
				if (!point) {
				  alert(ville + " not found");
				} else {
				document.getElementById('position').value=point;
				document.getElementById('submit').disabled=false;
				}
			  }
			);
		  }
		}

    </script>


<script type="text/javascript">
	
  /* Initialisation de la carte  */
  function initialize() {
   /* Instanciation du geocoder  */
   geocoder = new google.maps.Geocoder();
   var paris = new google.maps.LatLng(48.8566667, 2.3509871);
   var myOptions = {
    zoom: 4,
    center: paris,
    mapTypeId: google.maps.MapTypeId.HYBRID
   }
   /* Chargement de la carte  */
   map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }

	
	function showVille(ville) {
      if (geocoder) {
        geocoder.getLatLng(
          ville,
          function(point) {
            if (!point) {
              alert(ville + " not found");
            } else {
              map.setCenter(point, 11);
            }
          }
        );
      }
    }
	
	function addVille(ville) {
	document.getElementById('submit').disabled=true;
	geocoder = new new google.maps.Geocoder();
		  if (geocoder) {
			geocoder.getLatLng(
			  ville,
			  function(point) {
				if (!point) {
				  alert(ville + " not found");
				} else {
				document.getElementById('position').value=point;
				document.getElementById('submit').disabled=false;
				}
			  }
			);
		  }
		}

    </script>


Qu'est ce qui cloche ?
Eh bien si tu compares ta fonction showVille() à celle utilisée sur l'exemple que j'ai fourni, elles ne sont pas du tout similaires.

Par exemple, toi tu utilises geocoder.getLatLng alors qu'il faut utiliser geocoder.geocode( { 'address': address}, function(results, status) { ........

La méthode getLatLng n'existe pas dans la V3.

ta fonction showVille() devrait plutôt ressembler à ça :

function showVille(ville) {
	if(geocoder){
		geocoder.geocode( { 'address': ville}, function(results, status) {
			/* Si l'adresse a pu être géolocalisée */
			if (status == google.maps.GeocoderStatus.OK)
				map.setCenter(results[0].geometry.location);
			else
				alert(ville + " not found");		
		});
	}
}


Tout est expliqué sur l'exemple que j'ai mis en référence.

Cdlt,
Merci.

Pour l'autre partie ça coince. Pouvez-vous me corriger tout cela ?


	function addVille(ville) {
	document.getElementById('submit').disabled=true;
	geocoder = new google.maps.Geocoder();
    if(geocoder){ 
        geocoder.geocode( { 'address': ville}, function(results, status) { 
            /* Si l'adresse a pu être géolocalisée */ 
            if (status == google.maps.GeocoderStatus.OK)
     document.getElementById('lat').value = results[0].geometry.location.lat();
     document.getElementById('lng').value = results[0].geometry.location.lng();
				document.getElementById('position').value=results[0].geometry.location;
				document.getElementById('submit').disabled=false;
            else 
                alert(ville + " not found"); 				         
        }); 
    } 
}

Modifié par CyberNord (30 Jan 2011 - 13:42)
A première vue, il manque les accolades qui devraient entourer ton second "if" :

function addVille(ville) { 
    document.getElementById('submit').disabled=true; 
    geocoder = new google.maps.Geocoder(); 
    if(geocoder){  
        geocoder.geocode( { 'address': ville}, function(results, status) {  
            /* Si l'adresse a pu être géolocalisée */  
            if (status == google.maps.GeocoderStatus.OK) {
                document.getElementById('lat').value = results[0].geometry.location.lat(); 
                document.getElementById('lng').value = results[0].geometry.location.lng(); 
                document.getElementById('position').value=results[0].geometry.location; 
                document.getElementById('submit').disabled=false; 
           }else  
                alert(ville + " not found");                           
        });  
    }  
}


Cdlt,
ah oui. merci.
ça marche nickel !

Quel différence entre :

        
else {
        alert("Geocode was not successful for the following reason: " + status);


et 

            else 
                alert(ville + " not found");


?
Modifié par CyberNord (30 Jan 2011 - 20:27)
Dans la première, il manque l'accolade qui ferme le "else". A noter que les accolades ne sont pas obligatoires dans les boucles (JS, PHP, ....) quand il n'y a qu'une seule instruction à suivre. C'est notamment l'erreur que tu avais dans ton précédent POST. Tu avais un "if" sans accolades suivi de 4 instructions.

Sinon, dans ton premier "else", tu auras un code d'erreur qui expliquera la raison de l'échec de la géolocalisation (status); dans le second tu auras juste un message qui précisera que la ville n'a pas été trouvée.

Cdlt,
Sujet clos
Aller à