2

我目前正在使用 Google Maps API v3、jQuery 和 MarkerClusterer。

我注意到“长度”结果存在一个奇怪的问题。因此,我将向您展示我的注释代码:

文件 data.json 包含大约 1800 个对象。

function initialize() {

 $('#map_canvas').gmap({'zoom': 6, 'center': (new google.maps.LatLng(46.679594, 2.109375)), 'mapTypeId': google.maps.MapTypeId.ROADMAP, 'disableDefaultUI':true}).bind('init', function(evt, map) { 


    var mstime = new Date().getTime(); // to avoid caching

    var markerslist = new Array(); // This array will gets points informations

    $.getJSON('data.json?'+mstime, function(data) {

        for (var i = 0; i < data.markers.length; i++) {
            var val = data.markers[i];

            var t =  new Object();
            t.lat =  val.lat; 
            t.lng =  val.lng;
            t.name = val.label;
            markerslist.push(t); // pushing point info in markerslist
        }

    });

    alert(markerslist.length); // This first alert returns "0" !
    alert(markerslist.length); // This new return the right count (about 1800). Weird!


    for( var i = 0; i < markerslist.length; i++ ) { // To create markers on map
        $('#map_canvas').gmap('addMarker', { 
            'position': new google.maps.LatLng(markerslist[i].lat, markerslist[i].lng) 
        }).click(function() {
            $('#map_canvas').gmap('openInfoWindow', { content : 'Hello world!' }, this);
        });
    }



    $('#map_canvas').gmap('set', 'MarkerClusterer', new MarkerClusterer(map, $(this).gmap('get', 'markers')));

 });


}

总而言之,这段代码至少可以与一个警报完美配合...如果删除两个警报,则此代码不起作用。

谢谢你的帮助,问候

4

1 回答 1

4

getJSON调用是异步的。其结果是在调用回调之前调用之后的执行流程。您需要添加任何依赖于回调函数调用结果的代码,而不是将其放在调用getJSON.

注意:对于代码示例,我只是复制了您的代码并移动了它。既然您知道所有代码都需要在回调中,我相信您将能够对其进行优化以消除对临时数组的需求。

$.getJSON('data.json?'+mstime, function(data) {

    for (var i = 0; i < data.markers.length; i++) {
        var val = data.markers[i];

        var t =  new Object();
        t.lat =  val.lat; 
        t.lng =  val.lng;
        t.name = val.label;
        markerslist.push(t); // pushing point info in markerslist
    }

    alert(markerslist.length); // it will be correct here

    // now do the rest

    for( var i = 0; i < markerslist.length; i++ ) { // To create markers on map
        $('#map_canvas').gmap('addMarker', { 
           'position': new google.maps.LatLng(markerslist[i].lat, markerslist[i].lng) 
        }).click(function() {
           $('#map_canvas').gmap('openInfoWindow', { content : 'Hello world!' }, this);
        });
    }

    $('#map_canvas').gmap('set', 'MarkerClusterer', new MarkerClusterer(map, $(this).gmap('get', 'markers')));
}); // and finally close the callback
于 2012-05-06T14:45:05.420 回答