將單個多邊形設置爲可見/不可見

我試圖讓複選框將多邊形設置爲在地圖上可見/不可見。根據下面的代碼，它不起作用。我認爲，因爲我傳遞的變量類型不正確/需要投射。但我不確定...將單個多邊形設置爲可見/不可見

如何編寫此代碼，以便與複選框（同名）關聯的區域/多邊形的可見性切換？

說實話我是新來的Javascript，我敢肯定我錯過了一些簡單的東西，但任何幫助將不勝感激！

<script> 
var cheyChumneahCoords = [ 
new google.maps.LatLng(11.567148,104.931901), 
new google.maps.LatLng(11.564994,104.925757), 
new google.maps.LatLng(11.559585,104.927309), 
new google.maps.LatLng(11.562065,104.933274), 
new google.maps.LatLng(11.562276,104.935892), 
new google.maps.LatLng(11.562234,104.935935), 
new google.maps.LatLng(11.562108,104.935977) 
]; 

// Chey Chumneah area 
var cheyChumneahArea=new google.maps.Polygon({ 
    path:cheyChumneahCoords, 
    strokeColor:"#0000FF", 
    strokeOpacity:0.8, 
    strokeWeight:0, 
    fillColor:"#0000FF", 
    fillOpacity:0.4 
    }); 

function areaChange(areaName, checked) 
{ 
alert("Area " + areaName + " changed and is checked: " + checked); //Debug 
cheyChumneahArea.setVisible(checked); //Works 
areaName.setVisible(checked); //Does not work 
} 

function initialize() 
{ 
var mapProp = { 
    center:new google.maps.LatLng(11.562276,104.919434), 
    zoom:14, 
    mapTypeId:google.maps.MapTypeId.ROADMAP 
    }; 
var map=new google.maps.Map(document.getElementById("googleMap") 
    ,mapProp); 

cheyChumneahArea.setMap(map); 
} 

google.maps.event.addDomListener(window, 'load', initialize); 
</script> 
</head> 

<body> 
<div id="googleMap"></div> 

<div id="areaSelection"> 
<input type="checkbox" name="areas" value=cheyChumneahArea onchange="areaChange(this.value, this.checked)">Chey Chumneah<br> 
<input type="checkbox" name="areas" value="BKK1Area" onchange="areaChange(this.value, this.checked)">BKK1 
</div> 

</body> 
</html>

來源

2013-11-27 Tom

areaName是一個字符串，而不是一個對象。

使用下標表示法：

window[areaName].setVisible(checked);

來源

2013-11-27 10:20:11

完美 - 非常感謝！ – Tom

將單個多邊形設置爲可見/不可見

回答

相關問題