Animer google maps polyligne

Je voudrais attirer un animé (géodésique) polyligne dans google maps, un peu comme ceci: http://planefinder.net/route/SFO/

J'ai trouvé de nombreux tutoriels sur la façon d'animer un symbole le long d'une polyligne, mais rien sur l'animation de la polyligne lui-même à partir de la source vers la destination.

Un indice ? Où dois-je commencer ?

Toute aide est très apprécié.

source d'informationauteur emathias

  1. 18

    J'ai eu un certain succès avec les éléments suivants:

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

    C'est essentiellement l'aide d'un intervalle à l'origine du tracé. À chaque étape, le visible, le tracé animé fait un plus grand pourcentage du total chemin du départ à l'arrivée jusqu'à ce que finalement le lieu d'arrivée est atteint.