從谷歌地圖中刪除多義線

Question

我使用DirectionsRenderer顯示路徑，但在完成之後，我想要移除折線並繼續進行操作。我似乎無法控制由此函數創建的標記和多段線。

有誰知道如何刪除這樣的折線，如果不可能，還有其他建議嗎？

我現在可以使用suppress屬性，但由於我在第一階段使用多段線，所以這並不能真正解決任何問題。

嚴重沮喪.. 乾杯！

Answer 1

這是如何從谷歌地圖v3中刪除折線。希望它可以幫助你。

var line = []; 
var flightPath = new google.maps.Polyline({ 
     path: flightPlanCoordinates, //create an array of LatLng objects 
     strokeColor: "#FF0000", 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
    }); 
line.push(flightPath); 

現在您將所有的折線對象推入數組行。你可以把它無形的或循環像這樣從地圖中刪除：

for (i=0; i<line.length; i++) 
{       
    line[i].setMap(null); //or line[i].setVisible(false); 
} 

Answer 2

使用

[self.polyline的setMap：無]。

Answer 3

這是你的問題的解決方案：要麼使用suppressPolylines選項或從地圖

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

 
var pointA = new google.maps.LatLng(48.86, 2.35); 
 
var pointB = new google.maps.LatLng(33.7167, 73.0667); 
 

 
function initialize() { 
 

 
    var rendererOptions = { 
 
     map: map, 
 
     draggable: true 
 
    } 
 
    // Instantiate a directions service. 
 
    directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions); 
 

 
    // Create a map and center it on islamabad. 
 
    var islamabad = new google.maps.LatLng(33.7167, 73.0667); 
 
    var mapOptions = { 
 
    zoom: 13, 
 
    center: islamabad 
 
    } 
 
    map = new google.maps.Map(document.getElementById('map'), mapOptions); 
 
    directionsDisplay.setMap(map); 
 
    calcRoute(); 
 
} 
 

 
function calcRoute() { 
 
    var start = pointA; 
 
    var end = pointB; 
 
    var request = { 
 
    origin: start, 
 
    destination: end, 
 
    travelMode: google.maps.TravelMode.DRIVING 
 
    }; 
 
    directionsService.route(request, function(response, status) { 
 
    if (status == google.maps.DirectionsStatus.OK) { 
 
     directionsDisplay.setDirections(response); 
 
    } 
 
    }); 
 
}; 
 

 
function removeRoute() { 
 
    directionsDisplay.setOptions({ 
 
    suppressPolylines: true 
 
    }); 
 
    // this "refreshes" the renderer 
 
    directionsDisplay.setMap(map); 
 
}; 
 

 
function removeRouteNull() { 
 
    directionsDisplay.setMap(null); 
 
}; 
 
google.maps.event.addDomListener(window, 'load', initialize);

#map { 
 
    height: 280px; 
 
}

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
 
<button onclick="removeRoute()">Remove route (suppressPolylines)</button> 
 
<button onclick="removeRouteNull()">Remove route (setMap(null))</button> 
 
<button onclick="initialize()">Undo all</button> 
 
<section id="map"></section>

刪除渲染器