Hiển thị nhiều tuyến đường trên bản đồ google

Question

Tôi đang cố gắng hiển thị nhiều tuyến đường trên cùng một bản đồ nhưng không thể làm như vậy.

Bất kể tôi làm gì để chỉ có một tuyến đường.

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

Mọi con trỏ sẽ hữu ích.

Answer 1

Bạn đã thử như sau?
Ở đây tôi đã chụp một đường dẫn và hiển thị nó. Bạn có thể làm tương tự bằng cách viết pointsArray = result.routes[1].overview_path; bên cạnh nó và hiển thị nó trong một vòng lặp mới.

directionsService.route (request, function (result, status) 
     { 
      if (status == google.maps.DirectionsStatus.OK) 
      { 
       directionsDisplay.setDirections (result); 
       pointsArray = result.routes[0].overview_path; 

       var i = 0; 
       var j = 0; 

       for (j = 0; j < pointsArray.length; j++) 
       { 
        var point1 = new google.maps.Marker ({ 
                position:pointsArray [j], 
                draggable:false, 
                map:map, 
                flat:true 
                }); 
       } 
      } 
     }); 

Answer 2

Tôi đã gặp vấn đề tương tự. This thread trên nhóm Google cho các bản đồ của Google hiển thị cách thực hiện.

Tác giả (một nhân viên của Google), đã viết này:

Bạn sẽ có thể tạo ra hai đối tượng DirectionsRenderer, mỗi rằng sử dụng cùng một bản đồ và DirectionsResults khác nhau.

var map = new google.maps.Map(document.getElementById("map_canvas")); 
function renderDirections(result) { 
    var directionsRenderer = new google.maps.DirectionsRenderer; 
    directionsRenderer.setMap(map); 
    directionsRenderer.setDirections(result); 
} 

var directionsService = new google.maps.DirectionsService; 
function requestDirections(start, end) { 
    directionsService.route({ 
    origin: start, 
    destination: end, 
    travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }, function(result) { 
    renderDirections(result); 
    }); 
} 
requestDirections('Huntsville, AL', 'Boston, MA'); 
requestDirections('Bakersfield, CA', 'Vancouver, BC'); 

Tôi đã thử nó và nó hoạt động.