從谷歌地圖中刪除現有多義線

Question

我有以下代碼在世界地圖中標記幾個點，並且當點擊每個點時隨機選擇兩個點並從該選定點創建多義線爲隨機兩個點。

http://jsfiddle.net/sux7eo3d/

var markerBounds = new google.maps.LatLngBounds(); 
var locations = [ 
    ['Rio De Janeiro (GIG)', -22.808903,-43.243647, 5], 
    ['Sydney (SYD)', -33.946111,151.177222, 4], 
    ['Delhi (DEL)', 28.5665,77.103088, 5], 
    ['Tokyo (TYO)', 35.689444,139.691667, 3], 
    ['New York (JFK)', 40.639751,-73.778925, 2], 
    ['Frankfurt (FRA)', 50.026421,8.543125, 1] 
]; 
var flightPlanCoordinates1 = []; 
var flightPlanCoordinates2 = []; 

var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 1, 
    minZoom:1, 
    center: new google.maps.LatLng(0, 0), 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
}); 

var infowindow = new google.maps.InfoWindow(); 

var marker, i; 

for (i = 0; i < locations.length; i++) { 

    marker = new google.maps.Marker({ 
    position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
    map: map 
    }); 

    google.maps.event.addListener(marker, 'click', (function(marker, i) { 

    return function() { 
     var p1 = Math.floor(Math.random() * 6); 
     var p2 = Math.floor(Math.random() * 6); 

     Point1 = new google.maps.LatLng(this.position.lat(),this.position.lng()); 
     Point2 = new google.maps.LatLng(locations[p1][1], locations[p1][2]); 
     Point3 = new google.maps.LatLng(locations[p2][1], locations[p2][2]); 
     flightPlanCoordinates1.push(Point1); 
     flightPlanCoordinates1.push(Point2); 
     flightPlanCoordinates2.push(Point1); 
     flightPlanCoordinates2.push(Point3); 

     var flightPath1 = new google.maps.Polyline({ 
     path: flightPlanCoordinates1, 
     geodesic: true, 
     strokeColor: '#FF0000', 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
     }); 

     var flightPath2 = new google.maps.Polyline({ 
     path: flightPlanCoordinates2, 
     geodesic: true, 
     strokeColor: '#FF0000', 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
     }); 

     flightPath1.setMap(map); 
     flightPath2.setMap(map); 

    } 
    })(marker, i)); 

} 

我需要刪除以前的折線，一旦我點擊新點。

任何幫助將不勝感激。

Answer 1

使兩個局部變量的多義線和flightPath1全球flightPath2，然後在標記單擊處理程序的開始重置其map財產。

google.maps.event.addListener(marker, 'click', (function(marker, i) {  
    return function() { 
    if (flightPath1!== null) { 
     flightPath1.setMap(null); 
    } 
    if (flightPath2!== null) { 
     flightPath2.setMap(null); 
    } 
    ... 

在一個側面節點，你聲明的座標陣列flightPlanCoordinates1和flightPlanCoordinates2全球，但你不能在標記單擊處理程序重置其內容。相反，您在每次點擊標記時向陣列添加越來越多的座標。爲了避免這種情況，你應該把數組變成局部變量。

google.maps.event.addListener(marker, 'click', (function(marker, i) { 
    return function() { 
    ... 
    var flightPlanCoordinates1 = [Point1, Point2]; 
    var flightPlanCoordinates2 = [Point1, Point3]; 
    ... 

工作例如：JSFiddle

Answer 2

以下是Google Maps API v3中的精確example。

你需要在你的函數使用此代碼：

flightPath1.setMap(null); 
flightPath2.setMap(null);