while循环中的地图编码无法正确评估

时间:2013-08-08 03:48:09

标签: javascript jquery google-maps geocoding

我正在尝试在while循环中使用Geocode API并且没有运气。似乎我的while循环中的if语句直到while循环结束才进行评估。我想知道是否因为Geocode API需要时间来响应,但我似乎无法正确评估它。这是我的代码:

 while (posts != j)
        {
            var image = server + '/location_marker.png';
            //var myLatLng = new google.maps.LatLng(locationLat[j],locationLong[j]);


            var address = addressGlobal[j];

            myLatLng = geocoder.geocode({ 'address': address }, function (results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                var lat = results[0].geometry.location.lat();
                var lng = results[0].geometry.location.lng();
                var myLatLng = new google.maps.LatLng(lat,lng);
                alert(lat + lng);
                return myLatLng;
            }

         else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
        });
            alert(myLatLng);                    
            place[j] = new google.maps.Marker({
                position: myLatLng,
                map: map,
                icon: image,
                url: postURL[j],
                title: postTitle[j]
            });   

            google.maps.event.addListener(place[j], 'click', function() {
                map.panTo(this.getPosition());
                map.setZoom(7);
                $("#fountainG").fadeIn(250);
                history.pushState(null, this.title, this.url);    

                //offsetCenter(myLatLng,-400,0,map);

                $(".dynamic").load(this.url + " .dynamic", function(response, status, xhr) {
                    $('.dynamic').fadeIn(500);
                    $('.dim').fadeIn(500);
                    $("#fountainG").fadeOut(250);
                });    
            });

            j++;
        }

1 个答案:

答案 0 :(得分:0)

我想我找到了答案,似乎与closures有关。我不完全确定如何修复它,但我将地理编码功能移动到嵌套函数中,然后在while循环中调用它。由于它一直执行到最后,一旦它完成,我需要再次遍历数组并将它们添加到地图中。代码运行成功,但不幸的是,我真的不明白为什么。

我很乐意,如果有人可以说明为什么这样可行,也许是一种更好的方式来设置它,但与此同时,这是固定的:

function initialize() {
function geocode() {
    var address = addressGlobal[j];
    var k = 0;        
    myLatLng = geocoder.geocode({ 'address': address }, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK) 
    {
        while (k != posts) 
        {
            var lat = results[0].geometry.location.lat();
            var lng = results[0].geometry.location.lng();
            var myLatLng = new google.maps.LatLng(lat,lng);
            alert(lat + lng);

             place[k] = new google.maps.Marker({
            position: myLatLng,
            map: map,
            icon: image,
            url: postURL[k],
            title: postTitle[k]     
        });   

        google.maps.event.addListener(place[k], 'click', function() 
        {
            map.panTo(this.getPosition());
            map.setZoom(7);
            $("#fountainG").fadeIn(250);
            history.pushState(null, this.title, this.url);    

            //offsetCenter(myLatLng,-400,0,map);

            $(".dynamic").load(this.url + " .dynamic", function(response, status, xhr) 
            {
                $('.dynamic').fadeIn(500);
                $('.dim').fadeIn(500);
                $("#fountainG").fadeOut(250);
            });    
        });
        k++;
        }

    }  
else {
    alert('Geocode was not successful for the following reason: ' + status);
}
});
}

var geocoder = new google.maps.Geocoder();    
google.maps.visualRefresh = true;
    var mapOptions = {
        zoom: 5,
        center: new google.maps.LatLng(37.09024,-95.712891),
        disableDefaultUI: true,
    };

    var posts = locationLat.length;
    var j = 0;
    map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);

    var place = [];

        while (posts != j)
        {
            var image = server + '/location_marker.png';
            //var myLatLng = new google.maps.LatLng(locationLat[j],locationLong[j]);

            geocode();

            alert(myLatLng);                    


            j++;
        }

    //Determine if the user came in via the front page or a post so we can set the viewport correctly
    if ( entryPage == "post" )
    {
        map.setZoom(7);
        var postView = new google.maps.LatLng(postLocationLat, postLocationLong);
        map.panTo(postView);
    }
}