谷歌地图动画标记移动

所以即时尝试移动标记顺利，但ID不起作用。标记是感动，但并不顺利，同样的结果，我可以有，如果我会写谷歌地图动画标记移动

marker[n].setPosition(moveto);

我已经显示在控制台中的所有变量，它的精致，所有增加通过正确的方式，但它似乎是

marker[n].setPosition(latlng);

仅在循环的最后一次迭代中被调用。

这里是我的代码：

function animatedMove(n, current, moveto){ 
     var lat = current.lat(); 
     var lng = current.lng(); 

     var deltalat = (moveto.lat() - current.lat())/100; 
     var deltalng = (moveto.lng() - current.lng())/100; 

     for(var i=0;i<100;i++){ 
      lat += deltalat; 
      lng += deltalng; 

      latlng = new google.maps.LatLng(lat, lng); 

      setTimeout(
       function(){ 
        marker[n].setPosition(latlng); 
       },10 
      ); 
     } 
    }

来源

2017-09-20 Игорь Быстревский

检查[**这个样品**]（https://robsite.net/google-maps-animated-marker-move/） – codtex

感谢，这代码工作正常，但无论如何它有趣的是我做错了什么 –

你从现在开始设置100个超时10毫秒。所有这些都在同一时间开火，标记结束了位于最后的位置... – geocodezip

什么你的代码做的是

for(var i=0;i<100;i++){ 
// compute new position 
// run function "f" that updates position of marker after a delay of 10

什么情况是，由函数 “F”（（(function(){marker[n].setPosition(latlng);}）的延迟之后运行的时间，该周期已经完成，并且已经到达标记的最终位置。

正在关注https://stackoverflow.com/a/24293516/2314737这里有一个可能的解决方案

function animatedMove(n, current, moveto) { 
    var lat = current.lat(); 
    var lng = current.lng(); 

    var deltalat = (moveto.lat() - current.lat())/100; 
    var deltalng = (moveto.lng() - current.lng())/100; 

    for (var i = 0; i < 100; i++) { 
    (function(ind) { 
     setTimeout(
     function() { 
      var lat = marker.position.lat(); 
      var lng = marker.position.lng(); 

      lat += deltalat; 
      lng += deltalng; 
      latlng = new google.maps.LatLng(lat, lng); 
      marker.setPosition(latlng); 
     }, 10 * ind 
    ); 
    })(i) 
    } 
}

你可以看一下演示here

来源

2017-09-20 10:10:53 user2314737

有意思，谢谢！ –

谷歌地图动画标记移动

回答

相关问题