Google地图实现路线规划（JavaScript）

作者: BaiKeyang

时间: 2017-05-19

关于谷歌地图实现地图路线规划的功能，具体实现代码如下：

Html代码：

<body onload="initMap()">   
<div id="map_canvas" style="height:90%;top:30px"></div>   
</body>

JS代码：

<script language="javascript" type="text/javascript">   
function initMap() {  
  var initAddr = {lat: 31.230416, lng: 121.473701};  
  var destAddr = {lat: 32.230416, lng: 120.47370};  
  
  var map = new google.maps.Map(document.getElementById('map_canvas'), {  
    center: initAddr,  
    scrollwheel: false,  
    zoom: 7  
  });  
  
  var directionsDisplay = new google.maps.DirectionsRenderer({  
    map: map  
  });  
  // Set destination, origin and travel mode.  
  var request = {  
    origin: initAddr,  
    destination: destAddr,  
    travelMode: google.maps.TravelMode.DRIVING  
  };  
  
  // Pass the directions request to the directions service.  
  var directionsService = new google.maps.DirectionsService();  
  directionsService.route(request, function(response, status) {  
    if (status == google.maps.DirectionsStatus.OK) {  
      // Display the route on the map.  
      directionsDisplay.setDirections(response);  
    }  
  });  
}  
</script>

根据自己项目的需要，根据上面代码的具体实现，封装上面代码。

Google地图实现路线规划（JavaScript）

添加新评论

标签