如何在最新的谷歌地图API中缓慢地移动标记

Question

我正在构建一个Web应用程序，其中一个航班需要从一个地方飞到另一个地方。我现在建立机场并将飞机作为标记，如何将我的飞机标记从一个地方移动到另一个地方。

Answer 1

，你可以利用它实现如下：

var lineSymbol = { 
    path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW, 
    scale: 3, // change the size 
    strokeColor: '#393' 
    }; 

你将不得不考虑改变这个自己，如果你需要一个飞机等。

然后，您需要实现折线它遵循：

// Create the polyline and add the symbol to it via the 'icons' property. 
    var line = new google.maps.Polyline({ 
    path: [{ 
     lat: 51.4700, 
     lng: 0.4543 
    }, { 
     lat: 50.1109, 
     lng: 8.6821 
    }, { 
     lat: 55.9533, 
     lng: 3  
    }, { 
     lat: 51.4700, 
     lng: 0.4543 
    }, 
    ], 
    strokeColor: '#FF0000', 
    strokeOpacity: 1.0, 
    strokeWeight: 0, // change this value to show/hide the line 
    icons: [{ 
     icon: lineSymbol, 
     offset: '100%' 
    }], 
    map: map 
    }); 

    animateCircle(line); 
} 

最后，我们需要添加方法动画上线符号：

function animateCircle(line) { 
    var count = 0; 
    window.setInterval(function() { 
    count = (count + 1) % 200; // change this to 1000 to only show the line once 
    var icons = line.get('icons'); 
    icons[0].offset = (count/2) + '%'; 
    line.set('icons', icons); 
    }, 50); // change this value to change the speed 
} 

的jsfiddle：https://jsfiddle.net/tu4s6302/3/