我目前正在使用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')));
});
}
总而言之,此代码与至少一个警报完美配合... 如果删除了两个Alert,则此代码不起作用。
感谢您的帮助, 此致
答案 0 :(得分: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