0

オフセットを変更するか、setPosition と latlng の配列だけで、ポリラインに沿ってマーカーをアニメーション化できます。ただし、setInterval または setTimeout 関数を使用する必要があります。また、その性質 (CPU 負荷、キュー内の他のプロセスなど) に基づいて正確なタイミングを保証することはできません。その時間の不正確さを補正し、マーカーのリアルタイム位置を表示するにはどうすればよいですか?

上記の質問にいくつかのコードを追加します。

関数 animateMarker(パス、ラント) {

var pcur = 1,
    acur = 1,
    totaltime = runts[runts.length-1] - runts[0],
    newPos = [];

for (var t1=1; t1 < path.length; t1++) {
    var timegap = Math.round((runts[t1] - runts[t1-1])/totaltime*100),
        latint = path[t1].lat() - path[t1-1].lat(),
        lngint = path[t1].lng() - path[t1-1].lng();
    for (var t2=1; t2 <= timegap; t2++) {
        newPos[pcur] = new google.maps.LatLng( path[t1-1].lat()+t2/timegap*latint, path[t1-1].lng()+t2/timegap*lngint );
        pcur++;
    }
}
var animateId = setInterval(function() {
    myMarker.setPosition(newPos[acur]);
    acur++;
    if (acur == pcur) clearInterval(animateId);
}, 20);

}

setInterval の 20 ミリ秒は、アニメーション全体を 2 秒 (20*100) 持続させる必要がありますが、実際にはすべて CPU 負荷に依存し、20 ミリ秒を 5 ミリ秒に減らしても変化はありません... time() 関数を使用してトラッカーをアニメーション化するにはどうすればよいですかrunts 配列からの実際の ts に基づいていますか?

4

0 に答える 0