Tracer plusieurs points sur google map en utilisant l'API

Question

J'essaie de montrer différents points sur n'importe quel itinéraire sur google map en utilisant l'API. Je veux passer dans le démarrage, l'arrêt et la finition des lieux. Est-ce possible en utilisant l'API javascript ou devrais-je examiner d'autres options telles que la géolocalisation?

J'utilise le code suivant pour y parvenir:

function initialize() { 
var mapOptions = { 
    zoom: 10, 
    center: new google.maps.(-64.397, 150.644), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
} 
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions); 
} 

function loadScript() { 
var script = document.createElement("script"); 
script.type = "text/javascript"; 
script.src = "http://maps.googleapis.com/maps/api/js?key=52554&sensor=false&callback=initialize"; 
document.body.appendChild(script); 
} 

Answer 1

Voici mon code.

`<script type="text/javascript"> 
    var geocoder = null; 
    var arr = new Array(); 
    var arr1 = new Array(); 
    var arr2 = new Array(); 
    var map = null; 
    var chr; 
    var baseIcon = null; 

    function initialize() { 
     if (GBrowserIsCompatible()) { 
      map = new GMap2(document.getElementById("map_canvas")); 
      map.setCenter(new GLatLng('<%=Request["Lat"]%>', '<%=Request["Long"]%>'), 13); 
      map.addControl(new GSmallMapControl()); 
      map.addControl(new GMapTypeControl()); 

      // Create a base icon for all of our markers that specifies the 
      // shadow, icon dimensions, etc. 
      baseIcon = new GIcon(); 
      //  baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png"; 
      baseIcon.iconSize = new GSize(25, 30); 
      baseIcon.shadowSize = new GSize(37, 34); 
      baseIcon.iconAnchor = new GPoint(9, 34); 
      baseIcon.infoWindowAnchor = new GPoint(9, 2); 
      baseIcon.infoShadowAnchor = new GPoint(18, 25); 


      // Creates a marker whose info window displays the letter corresponding to the given index. 



      function createMarker(point, index) { 
       // Create a lettered icon for this point using our icon class 
       var letter = String.fromCharCode("A".charCodeAt(0) + index); 
       var letteredIcon = new GIcon(baseIcon); 
       letteredIcon.image = "markers/marker" + index + ".png"; 

       // Set up our GMarkerOptions object 
       markerOptions = { icon: letteredIcon }; 
       var marker = new GMarker(point, markerOptions); 

       GEvent.addListener(marker, "click", function() { 
        marker.openInfoWindowHtml("<table><tr><td><img src=markers/marker" + index + ".png length=25 width=25 /></td>" + "<td>" + arr2[index] + "</td></tr></table>"); 
       }); 
       return marker; 
      } 


      for (var i = 0; i < arr.length; i++) { 
       var latlng = new GLatLng(arr[i], arr1[i]); 
       map.addOverlay(createMarker(latlng, i));      
      } 
     } 

    } 

`