javascript - Google Maps API geocode function problem - Stack Overflow

admin管理员组

文章数量:1428606

Ok, I'm fooling around with Google Maps API v3 and I bumped into a problem. I don't know if its the API or just some JS error i made.

Problem: addMarkerFromAdress() function calls on geocodeFromAdress() which returns coordinates back to addMarkerFromAdress(). But returned value is "undefined".

As a debug i added two alert outputs, one in addMarkerFromAdress() and one in geocodeFromAdress(). What troubles me is that the alert() in addMarkerFromAdress() seems to fire off before any value is returned. Why?

Source:

<script type="text/javascript">
  var geocoder;
  var map;

  function initializeGoogleMaps() {

    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(0, 0);
    var myOptions = {
      zoom: 1,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  }

  function geocodeFromAdress(address) {
   geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        var latLng = results[0].geometry.location;
        alert(latLng); //Outputs coordinates, but is for some reason outputted 2nd
        return latLng;
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }

  function addMarkerFromAdress(address, title){

    var latLng = geocodeFromAdress(address); 
    alert(latLng); //Outputs "undefined", but is for some reason outputted 1st
    map.setCenter(latLng);
        var marker = new google.maps.Marker({
            map: map, 
            position: latLng
    });

  }

  window.onload = function () { 
   initializeGoogleMaps();
   addMarkerFromAdress('Berlin, Germany', 'Berlin');
  }
</script>

Ok, I'm fooling around with Google Maps API v3 and I bumped into a problem. I don't know if its the API or just some JS error i made.

Problem: addMarkerFromAdress() function calls on geocodeFromAdress() which returns coordinates back to addMarkerFromAdress(). But returned value is "undefined".

As a debug i added two alert outputs, one in addMarkerFromAdress() and one in geocodeFromAdress(). What troubles me is that the alert() in addMarkerFromAdress() seems to fire off before any value is returned. Why?

Source:

<script type="text/javascript">
  var geocoder;
  var map;

  function initializeGoogleMaps() {

    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(0, 0);
    var myOptions = {
      zoom: 1,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  }

  function geocodeFromAdress(address) {
   geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        var latLng = results[0].geometry.location;
        alert(latLng); //Outputs coordinates, but is for some reason outputted 2nd
        return latLng;
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }

  function addMarkerFromAdress(address, title){

    var latLng = geocodeFromAdress(address); 
    alert(latLng); //Outputs "undefined", but is for some reason outputted 1st
    map.setCenter(latLng);
        var marker = new google.maps.Marker({
            map: map, 
            position: latLng
    });

  }

  window.onload = function () { 
   initializeGoogleMaps();
   addMarkerFromAdress('Berlin, Germany', 'Berlin');
  }
</script>

• google-maps-api-3
• javascript

Share Improve this question Follow asked Aug 24, 2011 at 8:44 lejahmielejahmie 18.3k1616 gold badges5757 silver badges7979 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

See that function passed as the second argument to geocoder.geocode()? that is where you should be calling addMarkerFromAddress. Due to the asynchronous nature of the geocode request, the alert after var latLng = geocodeFromAdress(address); is firing before the response is returned with the lat long values.

Something like this should do it

<script type="text/javascript">
  var geocoder;
  var map;

  function initializeGoogleMaps() {

    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(0, 0);
    var myOptions = {
      zoom: 1,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }

    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  }

  function geocodeFromAdress(address, title) {
   geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        var latLng = results[0].geometry.location;
        addMarkerFromAdress(latLng, title);
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }

  function addMarkerFromAdress(latLng, title){
    map.setCenter(latLng);
    var marker = new google.maps.Marker({
        map: map, 
        position: latLng
    });   
  }

  window.onload = function () { 
   initializeGoogleMaps();
   geocodeFromAdress('Berlin, Germany', 'Berlin');
  }
</script>

本文标签： javascriptGoogle Maps API geocode function problemStack Overflow