沿轨迹带方向的动态marker
如何使用
参考如下代码，即可实现动态marker绘制，并动态绘制已行走轨迹。
var carIcon = L.icon({
iconSize: [37, 26],
iconAnchor: [19, 13],
iconUrl: '../img/car.png'
})
// 动态marker
var animatedMarker = L.animatedMarker(routeLine.getLatLngs(), {
icon: carIcon,
playCall: updateRealLine
}).addTo(map)
var newLatlngs = [routeLine.getLatLngs()[0]]
// 绘制已行走轨迹线（橙色那条）
function updateRealLine(latlng) {
newLatlngs.push(latlng)
realRouteLine.setLatLngs(newLatlngs)
}
播放状态控制
// 开始
function startClick() {
animatedMarker.start();
}
// 暂停
function pauseClick() {
animatedMarker.pause();
}
// 停止
function stopClick() {
newLatlngs = []
animatedMarker.stop();
}
let speetX = 1 // 默认速度倍数
// 加速
function speetUp() {
speetX = speetX * 2
animatedMarker.setSpeetX(speetX);
}
// 减速
function speetDown() {
speetX = speetX / 2
animatedMarker.setSpeetX(speetX);
}