如何使用谷歌地图在交通模式(巴士,火车)两地之间的距离。我有驾驶模式代码?

问题描述:

- 这是计算行车distace--如何使用谷歌地图在交通模式(巴士,火车)两地之间的距离。我有驾驶模式代码?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html 
xmlns="http://www.w3.org/1999/xhtml"> <head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <meta name="robots" content="noindex,follow" /> 
    <title>Calculate driving distance with Google Maps API</title> 
    <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA7j_Q-rshuWkc8HyFI4V2HxQYPm-xtd00hTQOC0OXpAMO40FHAxT29dNBGfxqMPq5zwdeiDSHEPL89A" 
type="text/javascript"></script> 
    <!-- According to the Google Maps API Terms of Service you are required display a Google map when using the Google Maps API. see: 
http://code.google.com/apis/maps/terms.html --> 
    <script type="text/javascript"> 

    var geocoder, location1, location2, gDir; 

    function initialize() { 
     geocoder = new GClientGeocoder(); 
     gDir = new GDirections(); 
     GEvent.addListener(gDir, "load", function() { 
      var drivingDistanceMiles = gDir.getDistance().meters/1609.344; 
      var drivingDistanceKilometers = gDir.getDistance().meters/1000; 
      document.getElementById('results').innerHTML = '<strong>Address 1: </strong>' + location1.address + ' (' + 
location1.lat + ':' + location1.lon + ')<br /><strong>Address 2: 
</strong>' + location2.address + ' (' + location2.lat + ':' + 
location2.lon + ')<br /><strong>Driving Distance: </strong>' + 
drivingDistanceKilometers + ' kilometers'; 
     }); 
    } 

    function showLocation() { 
     geocoder.getLocations(document.forms[0].address1.value, function (response) { 
      if (!response || response.Status.code != 200) 
      { 
       alert("Sorry, we were unable to geocode the first address"); 
      } 
      else 
      { 
       location1 = {lat: response.Placemark[0].Point.coordinates[1], lon: 
response.Placemark[0].Point.coordinates[0], address: 
response.Placemark[0].address}; 
       geocoder.getLocations(document.forms[0].address2.value, function 
(response) { 
        if (!response || response.Status.code != 200) 
        { 
         alert("Sorry, we were unable to geocode the second address"); 
        } 
        else 
        { 
         location2 = {lat: response.Placemark[0].Point.coordinates[1], lon: 
response.Placemark[0].Point.coordinates[0], address: 
response.Placemark[0].address}; 
         gDir.load('from: ' + location1.address + ' to: ' + location2.address); 
        } 
       }); 
      } 
     }); 
    } 

    </script> </head> 

<body onload="initialize()"> 

    <form action="#" onsubmit="showLocation(); return false;"> 
     <p> 
      <input type="text" name="address1" value="Address 1" /> 
      <input type="text" name="address2" value="Address 2" /> 
      <input type="submit" value="Search" /> 
     </p> 
    </form> 
    <p id="results"></p> 

</body> </html> 

谷歌地图API有这个:)服务..有你更读到这里 https://developers.google.com/maps/documentation/javascript/directions

示例代码

var directionsDisplay; 
var directionsService = new google.maps.DirectionsService(); 
var map; 

function initialize() { 
    directionsDisplay = new google.maps.DirectionsRenderer(); 
    var chicago = new google.maps.LatLng(41.850033, -87.6500523); 
    var mapOptions = { 
    zoom:7, 
    center: chicago 
    } 
    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 
    directionsDisplay.setMap(map); 
} 

function calcRoute() { 
    var start = document.getElementById("start").value; 
    var end = document.getElementById("end").value; 
    var request = { 
    origin:start, 
    destination:end, 
    travelMode: google.maps.TravelMode.DRIVING 
    }; 
    directionsService.route(request, function(result, status) { 
    if (status == google.maps.DirectionsStatus.OK) { 
     directionsDisplay.setDirections(result); 
    } 
    }); 
} 

如果你只想得到远处不需要的地图。喊你尝试谷歌地图服务API JSON,在这里阅读更多

https://developers.google.com/maps/documentation/directions/

样本请求URL https://maps.googleapis.com/maps/api/directions/json?origin=Toronto&destination=Montreal&avoid=highways&mode=bicycling&key=API_KEY

+0

日Thnx先生,但我认为这个代码将被显示的地图,很感兴趣只有距离。 –

+0

删除地图元素? – HoangHieu

+0

检查我的更新答案 – HoangHieu