JS Geocoder 无法为 Google 地图变量分配全局变量

JS Geocoder cannot assign Global Variable for Google Maps Variable

我有二维变量数组:

var locations = new Array(3);
for (var i = 0; i < 3; i++) {
    locations[i] = ['1', '2', '3'];
}

我有一个名为 Place inside 的数组

data = ["Terogong, Indonesia", "Blok M, Indonesia", "Cipinang, Indonesia"]

当我使用 Geocoder 搜索 LatLang 时,它会在 Locations[] 中填充名称、纬度和语言:

for (var i = 0; i < data.length-1; i++) { 
    var c = data[i];
    geocoder.geocode( { 'address': data[i] + ", indonesia"}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {

            //alert("location : " + results[0].geometry.location.lat() + " " +results[0].geometry.location.lng()); 
            locations[i] = [c , results[0].geometry.location.lat(), results[0].geometry.location.lng()];
            alert(locations[i]);
        } else {
            alert("Something got wrong " + status);
        }
    });
}

然后,当我 alert(locations[0]) 它出现时 1.

为什么会这样??

地理编码器是异步的。一种选择是使用函数闭包将请求中的变量与回调函数相关联:

for (var i = 0; i < data.length; i++) {
    geocoder.geocode({
        'address': data[i] + ", indonesia"
    }, (function(data, i) { return function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {

            locations[i] = [data, results[0].geometry.location.lat(), results[0].geometry.location.lng()];
            var mark = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map,
                title: data
            });
            // alert(locations[i]);
        } else {
            alert("Something got wrong " + status);
        }
    }}(data[i], i))); // has function closure on data[i] as data, i (as i)
}

working fiddle

代码片段:

var geocoder = new google.maps.Geocoder();
var map;
var data = ["Terogong, Indonesia", "Blok M, Indonesia", "Cipinang, Indonesia"];

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var bounds = new google.maps.LatLngBounds();
  var locations = new Array(3);
  for (var i = 0; i < 3; i++) {
    locations[i] = ['1', '2', '3'];
  }
  for (var i = 0; i < data.length; i++) {
    geocoder.geocode({
      'address': data[i] + ", indonesia"
    }, (function(data, i) {
      return function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          bounds.extend(results[0].geometry.location);
          map.fitBounds(bounds);
          locations[i] = [data, results[0].geometry.location.lat(), results[0].geometry.location.lng()];
          var mark = new google.maps.Marker({
            position: results[0].geometry.location,
            map: map,
            title: data
          });
        } else {
          alert("Something got wrong " + status);
        }
      }
    }(data[i], i)));
  }

}
google.maps.event.addDomListener(window, "load", initialize);
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>