-1

Fusion Table を使用して Google マップを作成しようとしています。チェックボックスでマップをフィルタリングしたい。しかし、それは正しく機能していません。これは私のコードです

<form>
<input type="checkbox" checked="checked" name="store" value="male" onclick="filterData()">Male
<input type="checkbox" checked="checked" name="store" value="female" onclick="filterData()">Female

</form>

<div id="map_canvas"></div>

 <script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var map;
var layer_0;
function initialize() {
  map = new google.maps.Map(document.getElementById('map_canvas'), {
    center: new google.maps.LatLng(9.35300524537724, -82.31857926757817),
    zoom: 7,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  layer_0 = new google.maps.FusionTablesLayer({
    query: {
      select: 'sex',
      from: "1Cr2ObveEaSINhSVx1D9rZQN06o5aRxxcf8lFE6Y"

    },
    map: map

  });
}


function filterData() {
 var filter = [];
 var stores = document.getElementsByName('store');

for (var i = 0, store; store = stores[i]; i++) {
if (store.checked) {
  filter.push('\'' + store.value + '\''); 
}
}

if (filter.length) {
if (!layer.getMap()) {
  layer.setMap(map);

}
layer.setOptions({
  query: {
    select: 'sex',
    from: "1Cr2ObveEaSINhSVx1D9rZQN06o5aRxxcf8lFE6Y",
     where: '\'sex\' IN (' + filter.join(',') + ')'
  }
});

} else { 
layer.setMap(null);
 }
}
</script> 

マップは表示されていますが、チェックボックスが機能していません。問題はどこだ?解決策を教えてください。

4

1 に答える 1