Khoảng cách chỉ đường trong Google Maps API v3

Tôi đang cố gắng tìm cách sử dụng Google Maps Directions Demo để nhận khoảng cách từ các chỉ đường thành công.Khoảng cách chỉ đường trong Google Maps API v3

Đây là mã tôi có cho đến nay:

var googleMaps = { 
    // HTML Nodes 
    fromInput: google_maps_from, 
    toInput: google_maps_to, 

    // API Objects 
    dirService: new google.maps.DirectionsService(), 
    dirRenderer: new google.maps.DirectionsRenderer(), 
    map: null, 

    showDirections: function(dirResult, dirStatus) { 
    if (dirStatus != google.maps.DirectionsStatus.OK) 
    { 
    //Here we'll handle the errors a bit better :P 
     alert('Directions failed: ' + dirStatus); 
     return; 
    } 
    else 
    { 
    //Get the distance here 
    //onGDirectionsLoad(); 
    } 

    // Show directions 
    googleMaps.dirRenderer.setMap(googleMaps.map); 
    googleMaps.dirRenderer.setPanel(document.getElementById("directions")); 
    googleMaps.dirRenderer.setDirections(dirResult); 
    }, 

    getSelectedTravelMode: function() { 
    return google.maps.DirectionsTravelMode.DRIVING; 
    }, 

    getSelectedUnitSystem: function() { 
    return google.maps.DirectionsUnitSystem.METRIC; 
    }, 

    getDirections: function() { 
    var fromStr = googleMaps.fromInput; 
    var toStr = googleMaps.toInput; 
    var dirRequest = { 
     origin: fromStr, 
     destination: toStr, 
     travelMode: googleMaps.getSelectedTravelMode(), 
     unitSystem: googleMaps.getSelectedUnitSystem(), 
     provideTripAlternatives: true 
    }; 
    googleMaps.dirService.route(dirRequest, googleMaps.showDirections); 
    }, 

    init: function() { 
    googleMaps.map = new google.maps.Map(document.getElementById("map_canvas"), { 
     zoom: 13, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 
    // Show directions onload 
    googleMaps.getDirections(); 
    } 
}; 

// Onload handler to fire off the app. 
google.maps.event.addDomListener(window, 'load', googleMaps.init);

tôi có thể làm điều này chỉ tốt trong v2, chỉ gặp khó khăn trong việc ra các v3 tương đương.

Nguồn

2010-03-18 Yawn

Chào mừng bạn đến Stack Overflow ... Đây là một câu hỏi thú vị vì dường như không được ghi lại ở bất kỳ đâu trong Tham chiếu API v3. –

Ngoài ra, bạn có thể xem câu trả lời sau trên stackoverflow http://stackoverflow.com/questions/3251609/how-to-get-total-driving-distance-with-google-maps-api-v3 – user672365

Trong khi nó dường như không được lập hồ sơ chính thức, có vẻ như bạn có thể đi qua các phản hồi từ DirectionsService.route() phương pháp: response.trips[0].routes[0].distance.value, như trong ví dụ sau:

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps JavaScript API v3 Example: Directions Complex</title> 
    <script type="text/javascript" 
      src="http://maps.google.com/maps/api/js?sensor=false"></script> 
</head> 
<body style="font-family: Arial; font-size: 13px; color: red;"> 
    <div id="map" style="width: 400px; height: 300px;"></div> 
    <div id="duration">Duration: </div> 
    <div id="distance">Distance: </div> 

    <script type="text/javascript"> 

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

    var myOptions = { 
    zoom:7, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 

    var map = new google.maps.Map(document.getElementById("map"), myOptions); 
    directionsDisplay.setMap(map); 

    var request = { 
     origin: 'Chicago', 
     destination: 'New York', 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 

    directionsService.route(request, function(response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 

     // Display the distance: 
     document.getElementById('distance').innerHTML += 
      response.routes[0].legs[0].distance.value + " meters"; 

     // Display the duration: 
     document.getElementById('duration').innerHTML += 
      response.routes[0].legs[0].duration.value + " seconds"; 

     directionsDisplay.setDirections(response); 
     } 
    }); 
    </script> 
</body> 
</html>

Ảnh chụp màn hình hiển thị khoảng cách và thời gian: Google Maps API v3 Directions Demo

Nguồn

2010-03-18 19:14:05

Nó không phải là làm việc cho tôi. Tôi gặp lỗi "response.trips not defined". Cập nhật. câu trả lời - response.trips [i] .routes [0] .duration.value phải là response.routes [i] .legs [0] .duration.value. – Malx

@Malx: Cảm ơn bạn đã sửa. Tôi đã cập nhật câu trả lời. Điều này là lạ, bởi vì tôi chắc chắn rằng tôi đã kiểm tra ví dụ đó khi tôi đăng nó. Trong thực tế, đó là cách tôi nhận được ảnh chụp màn hình :) –

Nó không phải là lạ - API đã được thay đổi. Tôi tìm thấy câu trả lời trên các nhóm google. – Malx

Câu trả lời được chọn hoạt động bình thường nếu tuyến đường chỉ có một điểm tham chiếu. Dưới đây là cách để có được chiều dài đầy đủ nếu bạn có nhiều điểm tham chiếu:

var distance= 0; 
for(i = 0; i < response.routes[0].legs.length; i++){ 
    distance += parseFloat(response.routes[0].legs[i].distance.value); 
     //for each 'leg'(route between two waypoints) we get the distance and add it to the total 
} 
console.log(distance);

Nguồn

2015-04-27 17:21:50

Khoảng cách chỉ đường trong Google Maps API v3

Trả lời

Các vấn đề liên quan