Google Maps Geocoding API

-1

Le code suivant affichant la carte et affichant également la partie div mais ne pas afficher le point de repère sur la carte peut-on m'aider à l'avance merci!Google Maps Geocoding API

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false">               </script> 

<script> 
    var myCenter=new google.maps.LatLng(17.382094947877505,78.431396484375); 
    var geocoder,map; 

    function initialize() 
    { 
     geocoder = new google.maps.Geocoder(); 
     var mapProp = { 
      center:myCenter, 
      zoom:5, 
      mapTypeId:google.maps.MapTypeId.ROADMAP 
     }; 

     var map=new google.maps.Map(document.getElementById("googleMap"),mapProp); 
    } 

    function codeAddress() { 
     var address = document.getElementById('address').value; 
     geocoder.geocode({ 'address': address}, function(results, status) { 
      if (status === google.maps.GeocoderStatus.OK) { 
       map.setCenter(results[0].geometry.location); 
       var marker = new google.maps.Marker({ 
        map: map, 
        position: results[0].geometry.location 
       }); 
      } else { 
       alert('Geocode was not successful for the following reason: ' + status); 
      } 
     }); 
    } 
    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 

<body> 
    <div id="pannel"> 
     <input type="address" type="textbox" value="hyderbad,Andhra Pradesh"> 
     <input type="button" value="Geocode" onclick="codeAddress();"> 
    </div> 
    <div id="googleMap" style="width:1200px;height:800px;"></div> 
</body> 
</html>

Source

2013-06-22 sri

Déclarer une fois vos variables, avec var en haut (carte var). Ensuite, il suffit de les réaffecter, sans le var (dans la fonction initialize) http://jsfiddle.net/B5ZM7/ – jamiltz

La prochaine fois, s'il vous plaît mettez du temps dans le formatage de votre code avant de le poster, il est vraiment difficile de rassembler la force lire votre code s'il n'est pas indenté correctement. –

Il y a 2 choses que vous devez faire pour rendre votre travail de code:

Assurez-vous que votre champ d'entrée a un attribut id (puisque vous utilisez document.getElementById)
Ne pas REINITIALIZE Ainsi, l'entrée d'adresse de la variable map

devrait ressembler à ceci:

<input id="address" type="text" value="hyderbad,Andhra Pradesh">

Et la carte instanciation:

map = new google.maps.Map(document.getElementById("googleMap"),mapProp);

Voici le code complet:

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
    <script> 
     var myCenter=new google.maps.LatLng(17.382094947877505,78.431396484375); 
     var geocoder,map; 

     function initialize() { 
     geocoder = new google.maps.Geocoder(); 
     var mapProp = { 
      center:myCenter, 
      zoom:5, 
      mapTypeId:google.maps.MapTypeId.ROADMAP 
     }; 

     map = new google.maps.Map(document.getElementById("googleMap"),mapProp); 
     } 

     function codeAddress() { 
     var address = document.getElementById('address').value; 
     geocoder.geocode({ 'address': address}, function(results, status) { 
      if (status === google.maps.GeocoderStatus.OK) { 
       map.setCenter(results[0].geometry.location); 
       var marker = new google.maps.Marker({ 
        map: map, 
        position: results[0].geometry.location 
       }); 
      } else { 
       alert('Geocode was not successful for the following reason: ' + status); 
      } 
     }); 
     } 

     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
</head> 
<body> 
    <div id="panel"> 
     <input id="address" type="text" value="hyderbad,Andhra Pradesh"> 
     <input type="button" value="Geocode" onclick="codeAddress();"> 
    </div> 
    <div id="googleMap" style="width:1200px;height:800px;"></div> 
</body> 
</html>

Source

2013-06-22 09:01:54 Jasper

Google Maps Geocoding API

Répondre

Questions connexes