Question

我正在尝试使用地理编码器将邮政编码转换为lat和lng。我查看了Google Maps Api示例并遵循了几个教程，但出于某些原因，lat和lng返回“”。这是我的代码。

(function(window, google, address) {
  var geocoder = new google.maps.Geocoder();
  var lat = "";
  var lng = "";
  geocoder.geocode({
    'address': address
  }, function(results, status) {
    var test = results[0];
    lat = results[0].geometry.location.lat(); // lat is still equal to ""
    lng = results[0].geometry.location.lng(); // lng is still equal to ""
  });

  var options = {
      center: {
        lat: lat,
        lng: lng
      },
      zoom: 5
    },
    element = document.getElementById('map-canvas')
  var map = new google.maps.Map(element, options)
}(window, window.google, 98107));

html,
body,
#map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map-canvas"></div>

Answer 1

地理编码器是异步的。当/存在时，您需要使用回调函数中返回的数据。

(function(window, google, address) {
  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    'address': address
  }, function(results, status) {
    var options = {
        center: results[0].geometry.location,
        zoom: 5
      },
      element = document.getElementById('map-canvas')
    var map = new google.maps.Map(element, options)
  });
}(window, window.google, "98107"));

发布代码的另一个问题是传递给地理编码器的address 必须是一个字符串（所以＆＃34; 98107＆＃34;而不是98107），如果它不是＆＃ 39; API生成错误：InvalidValueError: in property address: not a string

＆＃13;

(function(window, google, address) {
  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    'address': address
  }, function(results, status) {
    var options = {
        center: results[0].geometry.location,
        zoom: 5
      },
      element = document.getElementById('map-canvas')
    var map = new google.maps.Map(element, options)
  });

}(window, window.google, "98107"));

＆＃13;

html,
body,
#map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

＆＃13;

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map-canvas"></div>

＆＃13;

Answer 2

geocode（）是异步函数，您需要等待其回调才能获得实际结果。

在代码中，您甚至在返回纬度和经度值之前在回调之外创建中心对象。

尝试以下方法：

 geocoder.geocode({
     'address': address
 }, function(results, status) {
     var test = results[0];

     var options = {
         center: {
             lat: results[0].geometry.location.lat(),
             lng: results[0].geometry.location.lng()
         },
         zoom: 5
     }
 });

谷歌地图api地理编码器无法正常工作

2 个答案: