【问题标题】:javascript object returns length 0 even when object is not empty [duplicate]即使对象不为空,javascript对象也返回长度0 [重复]
【发布时间】:2018-04-23 11:18:34
【问题描述】:

我正在尝试向谷歌地图添加多个标记。

我的代码:

function createMarkers(myArray) {
       var myOptions = {
        zoom:6,
        center: new google.maps.LatLng(28.704059, 77.102490)
      };

      var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
      //shows the object in console with length of 3
      console.log(myArray);

      //but here length return is 0 so no Entry on FOR Loop
      console.log(myArray.length);


    for(var x=0;x<myArray.length;x++){

      var marker = new google.maps.Marker({
          position: myArray[i],
          map: map,
          title: 'Hello World!'
        });
    }

}

function initialize(){
    var geocoder = new google.maps.Geocoder();
    var cityArray   =   ['Agra','Delhi','Varanasi'];

      var myLatLng =    [];

     for(var i=0;i<cityArray.length;i++){

      geocoder.geocode({
        'address': cityArray[i]+', India'
      }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          var Lat = results[0].geometry.location.lat();
          var Lng = results[0].geometry.location.lng();
          myLatLng.push({'lat': Lat, 'lng': Lng});


        } else {
          alert("Something got wrong " + status);
        }
    });
    }

  //console.log(myLatLng);
  createMarkers(myLatLng);
}

google.maps.event.addDomListener(window, "load", initialize);

<style>
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
</style>

<div id="map_canvas"></div>

我在对象数组中得到了 latitute 和 logitude。现在我想在 createMarkers(myLatLng) 函数中对其进行迭代。但在这个函数中,我可以将此对象记录到控制台并显示长度为 3 。但是当想要获得它的循环长度时,它总是返回 0;

【问题讨论】:

  • 当你执行 createMarkers(myLatLng); ,数组未填充。这是一个异步操作,在执行geocode()方法的callbacks时填充数组。
  • 谢谢我解决了..

标签: javascript jquery google-maps


【解决方案1】:

如 cmets 中所述,您的问题在于异步回调。

当 JS 执行“异步”操作(如 jQuery ajaxgeocoder.geocode)时,该操作需要一些时间,但此请求下方的代码无需等待即可执行。

这就是为什么geocoder.geocode 里面有一个检查它是否成功的函数,这个:

   function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      var Lat = results[0].geometry.location.lat();
      var Lng = results[0].geometry.location.lng();
      myLatLng.push({'lat': Lat, 'lng': Lng});

      createMarkers(myLatLng); // THIS IS A NEW LINE

    } else {
      alert("Something got wrong " + status);
    }

仅在您的调用完成后执行。 只需在callback function 中传递createMarkers(myLatLng);,它应该按计划工作。

【讨论】:

  • 感谢神秘的反对者!有什么特别的原因吗?我的回答不正确吗?我没有链接到资源吗?它没有帮助和解释吗?教我,让我以后在你眼里做得更好
猜你喜欢
  • 2011-11-25
  • 2011-09-15
  • 2013-06-05
  • 2020-08-17
  • 2017-06-28
  • 2017-03-29
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多