为google-maps-api-3制作热图动画
为google-maps-api-3制作热图动画
提问于 2012-11-30 11:02:50
这让我快要抓狂了。
我正在使用谷歌地图应用程序接口v3，以及热图。我已经成功地绘制了数据点，没有问题。但是，我希望有一个无限循环的动画。目前，我有以下代码。(将显示地图，但没有任何数据点。)
var _data = [];
pointArray = new google.maps.MVCArray(_data);
var heatmap = new google.maps.visualization.HeatmapLayer({
data: pointArray,
});
heatmap.setData(_data);
heatmap.setMap( map );
play = function(){
for( var j = 0; j < data_arr.length; j++ ){
pointArray.clear();
for( var i = 0; i < data_arr[j].length; i++ ){
pointArray.push( new google.maps.LatLng(data_arr[j][i]['lat'], data_arr[j][i]['lon']) );
}
setInterval(function(){
play();
}, 3000);
}
}
google.maps.event.addListenerOnce(map, "idle", function(){
play();
});任何帮助，都是非常欢迎的！
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-12-01 01:35:20
问题是，在当前执行的脚本暂停之前，热图数据不会更新。到那时，所有的数据更改都已完成，因此没有需要进行动画处理。
不幸的是，这意味着简单的方法是行不通的。您将不得不将数据划分为动画步骤，只更改几个数据点，然后使用setTimeout调用链中的下一步，而不是在直接循环中更改数据。这将暂停，这样库就有机会实际进行您指定的更改。
此外，您对setInterval的使用是不正确的(我相信您在本例中指的是setTimeout )。您正在循环中调用setInterval，但从未将其清除。循环的每一次迭代都会导致新的定时执行，因此您不会花费很长时间就会有数百个调用play函数的时间间隔。setTimeout只会再执行一次。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13638411
复制相关文章
相似问题
腾讯云开发者
