Comment déplacer lentement marqueur dans la dernière carte google api

Question

Je construis une application web, un vol doivent être voler d'un endroit à l'autre. J'ai construit des aéroports et placé des avions comme marqueur maintenant, comment déplacer mon marqueur d'avion d'un endroit à l'autre.

Answer 1

vous pouvez y arriver en utilisant les éléments suivants:

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

Vous devrez regarder en vous-même changer si vous avez besoin d'un avion etc ..

Vous devez ensuite mettre en œuvre la polyligne pour elle à suivre:

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

Enfin, nous devons ajouter la méthode pour animer le symbole sur la ligne:

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/