Wie man Marker langsam in der neuesten Google Map bewegen api

Question

Ich baue eine Web-Anwendung, wo ein Flug von einem Ort zum anderen fliegen muss. Ich habe Flughäfen gebaut und Flugzeuge als Marker platziert, wie ich meinen Flugzeugmarker von einem Ort zum anderen bewegen kann.

Answer 1

Sie können es erreichen, indem sie unter Verwendung der folgenden Schritte aus:

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

Sie werden in dieser sich verändernden suchen, wenn Sie ein Flugzeug usw. benötigen ..

Sie dann für den Linienzug implementieren müssen folgen:

// 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); 
} 

Schließlich müssen wir die Methode hinzuzufügen, um das Symbol auf der Linie zu animieren:

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/