1

我正在尝试通过一一显示标记来在谷歌地图中实现一些“强制动画”。

为此,我使用了以下代码。

function Marker(i) {
    if(i > locations.length) return;                
    var populationOptions = {
         strokeColor: '#FF0000',
         strokeOpacity: 0.8,
         strokeWeight: 2,
         fillColor: '#FF0000',
         fillOpacity: 0.35,
         map: map,
         center: citymap[locations[i][1]].center,
         radius: citymap[locations[i][1]].population
    };
    cityCircle = new google.maps.Circle(populationOptions);

    var t = setTimeout("Marker("+(i+1)+")",2000);
}
Marker(0);

我从以下示例中获取了这个示例:Here,但 Firebug 说函数 Marker 未在 setTimeout() 行上定义;

有任何想法吗?

更新代码:

function Marker(city) {
    alert(city);
    var populationOptions = {
        strokeColor: '#FF0000',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: '#FF0000',
        fillOpacity: 0.35,
        map: map,
        center: citymap[city].center,
        radius: citymap[city].population
    };
    cityCircle = new google.maps.Circle(populationOptions);
}

for (city in citymap) {
    var t = setTimeout(function(){Marker(city);},2000);
}

我假设每次调用 Marker 都会有 2 秒的延迟,但事实并非如此。它等待 2 秒,然后一次性运行。此外,“城市”不会更新,添加相同的标记 x 乘以城市地图中的城市数量。

for循环不等待超时完成?

4

2 回答 2

2

如果您希望每 2 秒添加一个新城市,并且即使在处理完 citymap 中的所有项目后也不重复调用您的标记功能,您可以执行以下操作(也摆脱全局计数器变量)

function Marker(count) {
    city = Object.keys(citymap)[count];
    console.log(city);
    var populationOptions = {
        strokeColor: '#FF0000',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: '#FF0000',
        fillOpacity: 0.35,
        map: map,
        center: citymap[city].center,
        radius: citymap[city].population
    };
    cityCircle = new google.maps.Circle(populationOptions);
    count++;
    if(count<citymap.length){
        setTimeout(function(){Marker(count);},2000);
    }
}
Marker(0);
于 2013-05-08T09:31:10.807 回答
1

Use something like this

var count = 0;
function Marker() {
    city = Object.keys(citymap)[count];
    alert(city);
    var populationOptions = {
        strokeColor: '#FF0000',
        strokeOpacity: 0.8,
        strokeWeight: 2,
        fillColor: '#FF0000',
        fillOpacity: 0.35,
        map: map,
        center: citymap[city].center,
        radius: citymap[city].population
    };
    cityCircle = new google.maps.Circle(populationOptions);
    count++;
}
var i =1;
for (var city in citymap) {
    var t = setTimeout(function(){Marker();},i*2000);
    i++;
}

And you have declared citymap as var citymap = {}.. Modify it as var citymap = []; in line 38

于 2013-05-08T10:00:39.933 回答