Question

我正在尝试获取复选框，将多边形设置为地图上的可见/不可见。根据下面的代码，它不起作用。我认为因为我传递的变量类型不正确/需要被强制转换。但我不确定......

如何编写此代码，以便与复选框（同名）关联的区域/多边形的可见性切换？

说实话，我是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>

Answer 1

areaName是一个字符串，而不是一个对象。

使用下标 - 表示法：

window[areaName].setVisible(checked);

将单个多边形设置为可见/不可见

1 个答案: