在多个标记之间绘制折线

时间:2013-10-10 11:33:36

标签: javascript php google-maps google-maps-api-3

我已经解决了在谷歌地图中放置多个标记的问题 现在我面临着在这些标记之间绘制折线的问题。实际上我是google map api的新手 my code:

$lat1的值为
[["a, Ahmedabad, Gujarat 380001, India","23.0263517","72.5819013"],
["b, Ahmedabad, Gujarat, India","23.0690035","72.6801576"], ["c, Ahmedabad, Gujarat 380015, India","23.0171240","72.5330533"]]

<script type="text/javascript">
  var markerarray=new Array();
 var locations = <?php echo json_encode($lat1);?>;
 var directionsService = new google.maps.DirectionsService();
 var map = new google.maps.Map(document.getElementById('map'), {
 zoom: 10,
 center: new google.maps.LatLng(23.0171240, 72.5330533),
 mapTypeId: google.maps.MapTypeId.ROADMAP
});

var infowindow = new google.maps.InfoWindow();

var marker, i;
for (i = 0; i < locations.length; i++) 
{ 
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),

    map: map
   });

 markerarray[i] = (Array(locations[i][1], locations[i][2]));

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
} 

var flightPath = new google.maps.Polyline({
  path: markerarray,
  geodesic: true,
  strokeColor: '#FF0000',
  strokeOpacity: 1.0,
  strokeWeight: 2
});

flightPath.setMap(map);
</script> 

我使用静态值绘制折线。但是动态值没有成功 我使用这个例子绘制折线。但我不知道如何使用多个标记。

Simple Polylines

提前致谢。

1 个答案:

答案 0 :(得分:2)

使用array个职位填充marker,并使用此array作为path - google.maps.Polyline

选项