Xóa các tuyến đường được hiển thị trên Google Map

Question

Tôi đang cố gắng thực hiện điều gì đó mà tôi thu thập đã được thực hiện một vài lần trước đây, mặc dù tôi gặp khó khăn khi hoàn thành nó.

Tôi có trang web hiển thị ba Google Maps.

Đối với mỗi bản đồ google này, tôi có một hộp văn bản chấp nhận mã bưu điện/mã zip và nút "nhận chỉ đường".

Nhấp vào mỗi nút trong số này sử dụng đối tượng google.maps.DirectionsService để hiển thị MỘT bộ chỉ đường trong ONE bảng ở giữa trang.

Sự cố của tôi phát sinh khi tôi cố gắng tìm tuyến đường mới bằng cách tìm kiếm lại. Như bạn có thể thấy trong hình bên dưới, cả hai tuyến đều được hiển thị.

tôi có một điểm đánh dấu ở phần cuối mà là trong một bộ sưu tập các dấu hiệu.

Tôi đã đọc một vài lần về cách bạn có thể lặp qua mảng này và sử dụng marker.setMap (null) để xóa điểm đánh dấu này.

Tuy nhiên, dường như tôi không thể xóa các tuyến đường thực tế sau mỗi tìm kiếm cụ thể.

Có ai có bất kỳ vấn đề nào với việc xóa đánh dấu khỏi nhiều bản đồ không?

Bạn có phải đặt lại hoàn toàn bản đồ theo một cách nào đó không?

Nếu bạn phải xóa điểm đánh dấu, tại thời điểm nào trong vòng đời của quá trình bạn nên thực hiện để hành trình mới của bạn xuất hiện sau khi tìm kiếm, nhưng hành trình cũ bị xóa?

Answer 1

Tôi sử dụng cùng một đối tượng google.maps.DirectionsService cho tất cả ba bản đồ của Google và tất cả đều gọi cùng một phương pháp để tính chỉ đường nhưng chuyển trong đối tượng bản đồ của riêng chúng làm tham số.

function calcRoute(startPoint, location_arr) { 
    // Create a renderer for directions and bind it to the map. 
    var map = location_arr[LOCATION_ARR_MAP_OBJECT]; 
    var rendererOptions = { 
    map: map 
} 

if(directionsDisplay != null) { 
    directionsDisplay.setMap(null); 
    directionsDisplay = null; 
} 

directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions); 

directionsDisplay.setMap(map); 

directionsDisplay.setPanel(document.getElementById("directionsPanel")); 

Chính vì vậy, nếu chỉ đườngDisplay! = Null, chúng tôi không chỉ chuyển giá trị null vào setMap, chúng tôi còn vô hiệu hóa toàn bộ đối tượng afterweards và tôi đã tìm thấy điều này.

Answer 2

Tôi không biết câu trả lời .... hầu như tất cả các u cần làm là tùy theo hoàn cảnh:

// put the codes after direction service is declared or run directionsService // 

directionsDisplay.setMap(null); // clear direction from the map 
directionsDisplay.setPanel(null); // clear directionpanel from the map   
directionsDisplay = new google.maps.DirectionsRenderer(); // this is to render again, otherwise your route wont show for the second time searching 
directionsDisplay.setMap(map); //this is to set up again 

Answer 3

Đây là phần duy nhất bạn cần:

// Clear past routes 
    if (directionsDisplay != null) { 
     directionsDisplay.setMap(null); 
     directionsDisplay = null; 
    }