通过 javascript 函数访问变量
variable access through javascript function
我在使用 Google 地图 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' 属性的解决方法,但在文档完全加载之前不会设置它们。 (尝试了 3000 毫秒的 setTimeout,看起来甚至没有考虑在内)
如何通过地理编码访问标记及其属性and/or如何从属性字段中获取经纬度?
编辑:
我尝试了几种方法,目前正在尝试这样的方法:
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());
问题是地理编码是异步的。您在该函数之外执行的代码试图在返回之前访问该信息。它需要等待 google 返回结果,这就是它接受回调函数作为参数的原因。此代码在地理编码响应后执行。
您可以将该代码添加到地址解析回调中。
编辑:
你也可以传入你自己的函数来调用,如上面的评论所述。下面是一些伪代码,应该可以让您有所了解:
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 就会被执行。
使用全局变量解决了问题:
var markers_list = new Array();
还有一个在地理编码内部调用的函数:
function createMarkersArray(marker){
markers_list.push(marker);
console.log(marker);
}
可以通过简单的 markers_list[i].getPosition()
访问纬度和经度
bounds.extend(new google.maps.LatLng(markers_list[i].getPosition().lat(), markers_list[i].getPosition().lng()));
map.fitBounds(bounds);
感谢您的回复。
我在使用 Google 地图 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' 属性的解决方法,但在文档完全加载之前不会设置它们。 (尝试了 3000 毫秒的 setTimeout,看起来甚至没有考虑在内)
如何通过地理编码访问标记及其属性and/or如何从属性字段中获取经纬度?
编辑:
我尝试了几种方法,目前正在尝试这样的方法:
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());
问题是地理编码是异步的。您在该函数之外执行的代码试图在返回之前访问该信息。它需要等待 google 返回结果,这就是它接受回调函数作为参数的原因。此代码在地理编码响应后执行。
您可以将该代码添加到地址解析回调中。
编辑:
你也可以传入你自己的函数来调用,如上面的评论所述。下面是一些伪代码,应该可以让您有所了解:
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 就会被执行。
使用全局变量解决了问题:
var markers_list = new Array();
还有一个在地理编码内部调用的函数:
function createMarkersArray(marker){
markers_list.push(marker);
console.log(marker);
}
可以通过简单的 markers_list[i].getPosition()
bounds.extend(new google.maps.LatLng(markers_list[i].getPosition().lat(), markers_list[i].getPosition().lng()));
map.fitBounds(bounds);
感谢您的回复。