javascript 动画谷歌地图折线
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16800865/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Animate google maps polyline
提问by emathias
I'd like to draw an animated (geodesic) polyline in google maps, a bit like this: http://planefinder.net/route/SFO/
我想在谷歌地图中绘制一条动画（测地线）折线，有点像这样：http: //planefinder.net/route/SFO/
I found many tutorials on how to animate a symbol along a polyline, but nothing about animating the polyline itself from the source to the destination.
我找到了很多关于如何沿折线动画符号的教程，但没有关于从源到目标动画折线本身的教程。
Any hints ? Where should I start ?
任何提示？我应该从哪里开始？
Any help is really appreciated.
任何帮助都非常感谢。
回答by Pedro Cattori
I've had some success with the following:
我在以下方面取得了一些成功：
var departure = new google.maps.LatLng(dept_lat, dept_lng); //Set to whatever lat/lng you need for your departure location
var arrival = new google.maps.LatLng(arr_lat, arr_lng); //Set to whatever lat/lng you need for your arrival location
var line = new google.maps.Polyline({
path: [departure, departure],
strokeColor: "#FF0000",
strokeOpacity: 1,
strokeWeight: 1,
geodesic: true, //set to false if you want straight line instead of arc
map: map,
});
var step = 0;
var numSteps = 250; //Change this to set animation resolution
var timePerStep = 5; //Change this to alter animation speed
var interval = setInterval(function() {
step += 1;
if (step > numSteps) {
clearInterval(interval);
} else {
var are_we_there_yet = google.maps.geometry.spherical.interpolate(departure,arrival,step/numSteps);
line.setPath([departure, are_we_there_yet]);
}
}, timePerStep);
This is basically using an interval to redraw the path. At each step, the visible, animated path makes up a larger percentage of the total path from departure to arrival until finally the arrival location is reached.
这基本上是使用间隔来重绘路径。在每一步，可见的动画路径占从出发到到达直到最终到达到达位置的总路径的更大百分比。
