JS Geocoder无法为Google地图变量分配全局变量 [英] JS Geocoder cannot assign Global Variable for Google Maps Variable

问题描述

我有变量数组2维：

  var locations = new Array（3）; （var i = 0; i <3; i ++）{
 locations [i] = ['1'，'2'，'3']的
; 
} 
  

和我的数组名称放在里面

  data = [印度尼西亚Terogong，印度尼西亚Blok M，印度尼西亚Cipinang] 
  

当我使用Geocoder搜索 Lat 和 Lang



  ; 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（））; 
位置[i] = [c，results [0] .geometry.location.lat（），results [0] .geometry.location.lng（）]; 
 alert（locations [i]）; 
} else {
 alert（出错了+状态）; 
} 
}）; 
} 
  

然后当我 alert（locations [0 ]）它的apear 1。





为什么会发生这种情况？

解决方案

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

  for（var i = 0; i（data.length; i ++）{
 geocoder.geocode（{
'address'：data [i] +，indonesia
}，（function（data，i）{返回函数（结果，状态）{
 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：
 title：data 
}）; 
 // alert（locations [i]）; 
} else {
 alert（Something出错了+状态）; 
} 
}}（data [i]，i）））; //将数据[i]的函数关闭为数据，i（如i）
} 
  

工作小提琴

代码片段：

var geocoder = new google.maps.Geocoder（）; var map; var data = [印度尼西亚Terogong，Blok M，印度尼西亚，印度尼西亚Cipinang];函数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']; （函数（数据，i）{返回函数（结果）（函数（数据，我））{返回函数（结果）（var i = 0; i< data.length; i ++）{geocoder.geocode（{'address'：data [i] +，indonesia ，状态）{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％;宽度：100％; margin：0px; < script src =https：//   

i have variable array 2 dimentional:

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

and i have array with name Place inside

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

when i use Geocoder to search Lat and Lang, then its fill Locations[] with name place, Lat and Lang:

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);
        }
    });
}

and then, when i alert(locations[0]) its apear 1.

why this is happen??

解决方案

The geocoder is asynchronous. One option is to use function closure to associate the variables in the request with the callback function:

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

code snippet:

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>

这篇关于JS Geocoder无法为Google地图变量分配全局变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！