Question

我遇到了Google maps api v3的问题。我正在尝试扩展我的Google地图以适应其标记，但似乎我无法访问地理编码功能中的某些变量。

function codeAddress(geocoding, address, shop) {
if (address.length > 0) {
geocoding.geocode({'address': address}, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location,
            icon: createImage("/assets/picto_flag_deepidoo.png"),
            title: address
        });

        //Setting the lng & lat in an attribute field for a further use
        shop.setAttribute('lng', marker.getPosition().lng());
        shop.setAttribute('lat', marker.getPosition().lat());
    }
    else {
        alert("Geolocalisation error : " + status);
    }
});
}
else {
    alert("Error : no address");
}
}

console.log(document.querySelector('#shop0').getAttribute('lng')) //null
setTimeout(function(){console.log(document.querySelector('#shop0').getAttribute('lng'))},3000) //null & setTimeout does not work

这里的问题是标记仅在geocode（）中设置。我尝试使用外部函数访问“lng”和“lat”属性，但是在文档完全加载之前不会设置它们。（尝试使用3000ms setTimeout，看起来甚至没有考虑到它）

如何从地理编码中访问标记及其属性和/或如何从属性字段中获取lat和lng？

编辑：

我尝试了几种方法，目前正在尝试这样的方式：

function mapBorders(){
    var bounds = new google.maps.LatLngBounds();
    var countMarkers = "#{@shops.count}";
    if (countMarkers > 0) {
      for (var i = 0; i < countMarkers; i++) {
        var latlng = document.querySelector('#shop' + i).getAttribute('lat')+","+document.querySelector('#shop' + i).getAttribute('lng');
        bounds.extend(new google.maps.LatLng (latlng));
      }
    }
    return bounds;
  }

  map.fitBounds(mapBorders());

Answer 1

问题是地理编码是异步的。您在该函数之外执行的代码在返回之前尝试访问该信息。它需要等待从谷歌返回结果，这就是它接受回调函数作为参数的原因。此代码在地理编码响应之后执行。

您可以将该代码添加到地理编码回调中。

编辑：

您也可以传递自己的函数进行调用，如上面的评论中所述。这里有一些伪代码可以给你一些想法：

function codeAddress (geocoding, address, shop, myFunc){
    ...
    geocoding.geocode({'address': address}, function (results, status) {
        ...
        //execute my function once the geocoded results are ready, passing it marker.
        myFunc(marker);
    });
}

然后代码调用codeAddress：

codeAddress(geocoding, address, shop, function(marker){
    //do some stuff with marker
});

一旦地理编码结果准备就绪，myFunc就会被执行。

Answer 2

使用全局变量解决问题：

var markers_list = new Array();

一个在地理编码内部调用的函数：

function createMarkersArray(marker){ markers_list.push(marker); console.log(marker); }

可以通过简单的markers_list[i].getPosition()

访问lat和lng

bounds.extend(new google.maps.LatLng(markers_list[i].getPosition().lat(), markers_list[i].getPosition().lng()));

map.fitBounds(bounds);

感谢您的回复。

通过javascript函数进行变量访问

2 个答案: