Google geocode is late (still one step behind)

问题

I put there my whole code. Trying to determine location address. My script should create still one marker with geocoded address (in console - variable kktina).

But, unfortunately, there isn't everything OK. Because by script still resolves previous location (or it takes previous coordinates, dunno). Maybe there is an error in code, but I'm not able to do this anymore..

So asking for help, thank you!

<!DOCTYPE html>
<html>
<head>
  <title>Google Maps JavaScript API v3 Example: Map Simple</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  <meta charset="utf-8">
  <style>
  html, body, #map_canvas {
    margin: 0;
    padding: 0;
    height: 100%;
  }
  </style>
  <link rel="stylesheet" type="text/css" href="style.css">
  <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places,geometry"></script>
  <script src="http://code.jquery.com/jquery-1.7.min.js" type="text/javascript"></script>
  <script>
  var map,marker;
  var geocoder = new google.maps.Geocoder();
  var markers = [];
  var img,icon,type;
  var prenos,pos,address = "5",point;


      function clearMarkersFromArray() {
    if (markers.length>0){
      markers[0].setMap(null);
      markers.shift(markers[0]);
    }
  }

  function geocodePosition(pos) {
    geocoder.geocode({
      latLng: pos
    }, function(responses) {
      if (responses && responses.length > 0) {
        address = responses[0].formatted_address;
      } else {
        address = 'Cannot determine address at this location.';
      }
    });
    return address;
  }

  function initialize() {

    var mapOptions = {
      zoom: 7,
      center: new google.maps.LatLng(49,19),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions),

    google.maps.event.addListener(map, 'click', function(response) {
      clearMarkersFromArray();
      point = new google.maps.LatLng(response.latLng.$a,response.latLng.ab); 
      var kktina = geocodePosition(point);
      console.log(kktina);
      var marker = new google.maps.Marker({
        position: point,
        draggable: true
      });
      markers.push(marker)
      marker.setMap(map);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
  <div id="map_canvas" style="height:400px;width:700px;"></div>
</body>
</html>

回答1:

You can't do this:

  function geocodePosition(pos) {
    geocoder.geocode({
      latLng: pos
    }, function(responses) {
      if (responses && responses.length > 0) {
        address = responses[0].formatted_address;
      } else {
        address = 'Cannot determine address at this location.';
      }
    });
    return address;
  }

the Geocoder is asynchronous, the value of address is undefined when it is returned.

Use the returned data inside the callback function instead, something like this (not tested):

var kktina = null;
function geocodePosition(pos) {
  geocoder.geocode({
    latLng: pos
  }, function(responses) {
    if (responses && responses.length > 0) {
      kktina = responses[0].formatted_address;
    } else {
      kktina = 'Cannot determine address at this location.';
    }
   console.log(kktina);
    var marker = new google.maps.Marker({
      position: point,
      draggable: true
    });
    markers.push(marker)
    marker.setMap(map);
  });
}

来源：https://stackoverflow.com/questions/13745591/google-geocode-is-late-still-one-step-behind

标签

google-maps

google-maps-api-3

google-maps-markers

google-geocoder