0

我需要在标记的每个图之间添加 1 秒的延迟。我想出了以下代码,但无法使其工作。任何想法 ?

var latlng = new google.maps.LatLng(43,2.34);
var myOptions = {
  zoom: 7,
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

for ( var i=0, len=json.length; i<len; i++ ){
  obj = json[i];

  // Get lat / long and put them on the map
  var lat = obj.latitude;
  var long = obj.longitude;

  display_marker(map, lat, long);
}

display_marker = function(map, lat, long){
  setTimeout(function(){}, 1000);
  var marker = new google.maps.Marker({
    map: map,
    position: new google.maps.LatLng(lat,long),
    title: "Latitude: " +  lat + "\nLongitude: " + long,
  });
}
4

2 回答 2

1

这里有两件事出了问题。

第一个是,您将 setTimeout 与空函数一起使用。您的代码需要在该函数内:

display_marker = function(map, lat, long){
  setTimeout(function() {
    var marker = new google.maps.Marker({
      map: map,
      position: new google.maps.LatLng(lat,long),
      title: "Latitude: " +  lat + "\nLongitude: " + long,
    });
  }, 1000);
}

第二个是,你的循环一个接一个地触发 display_marker,所以如果你解决了问题 1,那么你所有的标记将在 ~1000ms 后生成

解决此问题的一种简单方法是,如果您的 increment-var 将当前值传递给您的显示标记,并将其乘以您的 setTimeout:

var obj, lat, long;
for ( var i=0, len=json.length; i<len; i++ ){
  obj = json[i];

  // Get lat / long and put them on the map
  lat = obj.latitude;
  long = obj.longitude;

  display_marker(map, lat, long, i);
}

display_marker = function(map, lat, long, increment){
  setTimeout(function() {
    var marker = new google.maps.Marker({
      map: map,
      position: new google.maps.LatLng(lat,long),
      title: "Latitude: " +  lat + "\nLongitude: " + long,
    });
  }, increment * 1000);
}

提示:看看我对变量声明做了什么。您正在重新声明循环中的变量

提示2:我的代码未经测试,但它应该给你正确的想法如何解决你的问题

于 2013-01-07T16:50:39.650 回答
1

看起来您可能希望setTimeout在继续运行display_marker. setTimeout通过将进程添加到应该在指定时间附近执行的执行堆栈来工作,尽管它不是非常精确。

看起来您想要做的是在迭代值时将引用传递给display_markera 。setTimeout

setTimeout(function() {
  display_marker(map, lat, long);
}, 1000);

John Resig 写了一篇很棒的关于 JavaScript 计时器的博客文章,我发现它非常有用:http ://ejohn.org/blog/how-javascript-timers-work/ 。有关通过参数传递的信息setTimeout,请参阅此 SO 答案:https ://stackoverflow.com/a/1190656/609206 。

于 2013-01-07T16:54:30.820 回答