为什么Google Maps Geocoder不会调用初始化?

时间:2013-09-22 02:19:26

标签: javascript google-maps google-maps-api-3

我正在尝试让Google Maps Geocoder从地址返回LatLng,然后使用该中心的LatLng初始化地图。

我已经看到了关于这个主题的几个问题,并建议首先应该使用任意中心初始化地图然后重新定位,但这似乎很浪费。

以下代码正常工作,直到我将全局lat和lon更改为零。然后使用地址调用地理编码器并返回LatLng。我得到的只是一个空白窗口,初始化函数中的警报永远不会被触发。

在我开始在0,0初始化然后居中之前,有人可以解释为什么这不起作用吗?

由于

var lat = 37.425593;
var lon = -122.075915;
var address = '1600 Amphitheatre Pky, Mountain View, CA';
var LatLon = new google.maps.LatLng(0, 0);

function initialize() {

    alert("2. "+LatLon);

    var mapOptions = {
        center: LatLon,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var marker = new google.maps.Marker({
        position: LatLon,
        map: map
    });

}

if (lat == 0 && lon == 0) {
    alert('address = '+address);
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            if (results[0]) {
                LatLon = results[0].geometry.location;
                alert("1. "+LatLon);
                google.maps.event.addDomListener(window, 'load', initialize);
            } else {
                alert("No results found");
            }
        } else {
            alert("Geocoder failed: " + status);
        }
    });
} else {
    alert('lat/lon = '+lat+' '+lon);
    LatLon = new google.maps.LatLng(lat, lon);
    alert("1. "+LatLon);
    google.maps.event.addDomListener(window, 'load', initialize);
}

1 个答案:

答案 0 :(得分:0)

地理编码器是异步的。您还没有将代码放在上下文中,但返回坐标所需的时间必须意味着当坐标从服务器返回时窗口加载事件已经触发,因此初始化函数永远不会运行。如果您使用onload事件来启动地理编码操作,或者直接调用initialize并将代码放在页面底部,那么它将起作用,因此在页面完全呈现之前它不会执行(并且地图具有大小)。

<script type="text/javascript">
var address = '1600 Amphitheatre Pky, Mountain View, CA';
var LatLon = new google.maps.LatLng(0, 0);

function initialize(LatLon) {
    var mapOptions = {
        center: LatLon,
        zoom: 14,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    var marker = new google.maps.Marker({
        position: LatLon,
        map: map
    });

}

    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            if (results[0]) {
               var LatLon = results[0].geometry.location;
               initialize(LatLon);
            } else {
                alert("No results found");
            }
        } else {
            alert("Geocoder failed: " + status);
        }
    });
</script> 
</body>

working example