隱藏多段線的正確方法是什麼？

我是一個在地圖上顯示多段線的函數，這部分工作正常，現在我想實現一個隱藏多段線的函數，但是我沒有發現我的錯誤，因爲提前感謝。隱藏多段線的正確方法是什麼？

function cargaMapaCYL(mapa, varControl){ 
    var limite = null; 
    limite = [ 
     new google.maps.LatLng(42.49956716,-7.019005501), 
     new google.maps.LatLng(42.49947126,-7.029286373), 
     new google.maps.LatLng(42.50904062,-7.049299123), 
     new google.maps.LatLng(42.50722622,-7.069103626), 
     new google.maps.LatLng(42.50452387,-7.000150672), 
     new google.maps.LatLng(42.49348015,-6.983058917), 
     new google.maps.LatLng(42.49843269,-6.971666546), 
     new google.maps.LatLng(42.51765791,-6.956909023), 
     new google.maps.LatLng(42.52010069,-6.927429186), 
     new google.maps.LatLng(42.50992238,-6.914231493), 
     new google.maps.LatLng(42.50096695,-6.879679821), 
     new google.maps.LatLng(42.48775868,-6.857775832), 
     new google.maps.LatLng(43.23907504,-3.293216584)], "#000000", 5); 

    var contorno= new google.maps.Polyline({ 
     path: limite, 
     strokeColor: "#000000", 
     strokeOpacity: 1.0, 
     strokeWeight: 2 
    }); 
    if(varControl==true){ 
     contorno.setMap(mapa); 
    } 
    if(varControl==false){ 
     contorno.setMap(null); 
    } 
}

來源

2012-03-22 lfergon

每次你的函數被調用，它會創建一個新的折線。然後它或者添加到地圖中。

想必您可以使用true調用該函數來添加該行，然後再用false將其刪除。目前，當你第二次調用它時，它會創建一個新行並且不會將其添加到地圖中。它不會觸及已經添加到地圖的原始線條。

一種方法是將線保留在全局變量中。然後可以參考調用之間完全相同的對象。

var contorno = null; 

function cargaMapaCYL(mapa, varControl){ 
    if (!contorno) { 
     var limite = [...], "#000000", 5); 

     contorno= new google.maps.Polyline({...}); 
    } 

    if(varControl){ 
     contorno.setMap(mapa); 
    } else { 
     contorno.setMap(null); 
    } 
}

來源

2012-03-22 14:33:17 barryhunter

您只需要創建一次折線。將其放入全局變量contorno = ...然後，您可以使用setVisible（boolean）方法創建切換函數。

if(contorno.getVisible()){ 
     contorno.setVisible(false); 
    else{ 
     contorno.setVisible(true); 
    } 
// or 
contorno.getVisible() ? contorno.setVisible(false) : contorno.setVisible(true);

Blow是一個隱藏3秒後路徑的例子。

/* Always set the map height explicitly to define the size of the div 
 
* element that contains the map. */ 
 
#map { 
 
    height: 100%; 
 
} 
 
/* Optional: Makes the sample page fill the window. */ 
 
html, body { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
}

<div id="map"></div> 
 
<script> 
 
// This example creates a 2-pixel-wide red polyline showing the path of William 
 
// Kingsford Smith's first trans-Pacific flight between Oakland, CA, and 
 
// Brisbane, Australia. 
 

 
function initMap() { 
 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
    zoom: 3, 
 
    center: {lat: 0, lng: -180}, 
 
    mapTypeId: 'terrain' 
 
    }); 
 

 
    var flightPlanCoordinates = [ 
 
    {lat: 37.772, lng: -122.214}, 
 
    {lat: 21.291, lng: -157.821}, 
 
    {lat: -18.142, lng: 178.431}, 
 
    {lat: -27.467, lng: 153.027} 
 
    ]; 
 
    var flightPath = new google.maps.Polyline({ 
 
    path: flightPlanCoordinates, 
 
    geodesic: true, 
 
    strokeColor: '#FF0000', 
 
    strokeOpacity: 1.0, 
 
    strokeWeight: 2 
 
    }); 
 

 
    flightPath.setMap(map); 
 
    
 
    setTimeout(function() { 
 
    \t alert('hide path'); 
 
    flightPath.setVisible(false); 
 
    }, 3000); 
 
} 
 
</script> 
 
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=initMap"></script>

來源

2012-03-22 14:32:36

隱藏多段線的正確方法是什麼？

回答

相關問題