如何从 Google Maps JavaScript 地理编码器返回经度和纬度？ [复制]答案

【问题标题】：How do I return a longitude and latitude from Google Maps JavaScript geocoder? [duplicate]如何从 Google Maps JavaScript 地理编码器返回经度和纬度？ [复制]
【发布时间】：2011-07-11 21:09:34
【问题描述】：

当我使用下面的代码时，它会提示一个空白值？这是为什么呢？

HTML

<body onload="initialize()">
 <div id="map_canvas" style="width: 320px; height: 480px;"></div>
  <div>
    <input id="address" type="textbox" value="Sydney, NSW">
    <input type="button" value="Encode" onclick="display()">
  </div>
</body>

JavaScript

var geocoder;
var map;


  function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }

  function codeAddress() {
    var address = document.getElementById("address").value;
    var loc=[];

    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        loc[0]=results[0].geometry.location.lat();
        loc[1]=results[0].geometry.location.lng();

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

    return loc;
  }

  function display(){
     var long_lat=codeAddress();
    alert(long_lat);
  }

【问题讨论】：

标签： javascript google-maps geocoding

【解决方案1】：

因为你的函数codeAddress被执行了，给loc分配了空数组，对google geocoder执行异步请求并返回loc，它是空的，因为它的真实值是在google响应时分配的。换句话说，alert 应该在响应处理程序中：

var geocoder;
var map;


  function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }

  function codeAddress() {
    var address = document.getElementById("address").value;
    var loc=[];

    // next line creates asynchronous request
    geocoder.geocode( { 'address': address}, function(results, status) {
      // and this is function which processes response
      if (status == google.maps.GeocoderStatus.OK) {
        loc[0]=results[0].geometry.location.lat();
        loc[1]=results[0].geometry.location.lng();

        alert( loc ); // the place where loc contains geocoded coordinates

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

    // pretty meaningless, because it always will be []
    // this line is executed right after creating AJAX request, but not after its response comes
    return loc;
  }

  function display(){
     codeAddress();
  }

这就是 AJAX 的工作原理……进程会产生回调处理程序。

如果您想将地理编码和“显示”分开，您可以在处理程序中执行显示功能：

  function codeAddress() {
    var address = document.getElementById("address").value;

    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        var loc=[]; // no need to define it in outer function now
        loc[0]=results[0].geometry.location.lat();
        loc[1]=results[0].geometry.location.lng();

        display( loc ); 

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

  }

  function display( long_lat ){
     alert(long_lat);
  }

html:

<input type="button" value="Encode" onclick="codeAddress()">

如果您不仅要对显示进行地理编码，还可以使其更加通用。然后您可以将回调定义为codeAddress 函数的参数：

function codeAddress( callback ) {
...
 geocoder.geocode( { 'address': address}, function(results, status) {
   ...
   callback( loc ); // instead of dispaly( loc );
   ...
 }
...
}

codeAddress( display ); // to execute geocoding

【讨论】：

感谢您的回答，有没有办法将这些值返回给变量？ bcos 我打算在另一个函数中使用它作为参数
这仍然不能解决我遇到的问题，我正计划获取多个邮政编码的返回值。基本上我试图创建一个通用函数，我可以将邮政编码作为参数传递并获取return 中的 long 和 lat 值。因为这些值在回调中，我猜它不能被返回。
@manraj82：唯一可以写return loc; 的地方可能是传递给geocoder.geocode 函数的匿名函数。这个匿名函数由 ajax 响应处理器在 google 脚本中的某个地方执行，因此这些信息永远不会出现在您的代码中。 AJAX 工作虽然回调执行，但不是返回值......它是你无法控制的