0

我试图通过使用复选框来单击和关闭图层，但由于某种原因，我遗漏了一些东西，无法让它再次单击和关闭。我还想为每一层添加自定义标记，但根本没有成功。

这是我正在使用的代码。我很感激这方面的任何帮助，我对使用这段代码很陌生。

var map;
    var layerl0;
    var layerl1;
    function initialize() {
      map = new google.maps.Map(document.getElementById('map-canvas'), {
        center: new google.maps.LatLng(62.683556,-152.314453),
        zoom: 4,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      });
      layerl0 = new google.maps.FusionTablesLayer({
        query: {
          select: "'col0'",
          from: '1suBUHqahw5W9f6A6kEVhh-NWmqSbukYqdtnJLWs'
        },
        map: map,
        styleId: 2,
        templateId: 3
      });
      layerl1 = new google.maps.FusionTablesLayer({
        query: {
              select: "'col0'",
          from: '1ra3TP6cbWmdAOayLgzCugLrhdmDAO6UJIFuty9E'
        },
        map: map,
         styleId: 2,
         templateId: 3
      });
    }
    function changeMapl0() {
       var searchString = document.getElementById('search-string-l0').value.replace(/'/g, "\\'");
       layerl0.setOptions({
          query: {
           select: "'col0'",
           from: '1suBUHqahw5W9f6A6kEVhh-NWmqSbukYqdtnJLWs',
           where: "'category' = '" + searchString + "'"
        }
      });
    }
    function changeMapl1() {
       var searchString = document.getElementById('search-string-l1').value.replace(/'/g, "\\'");
       layerl1.setOptions({
         query: {
          select: "'col0'",
           from: '1ra3TP6cbWmdAOayLgzCugLrhdmDAO6UJIFuty9E',
           where: "'category' = '" + searchString + "'"
        }
      });
   }
    google.maps.event.addDomListener(window, 'load', initialize);
  </script>
  </head>
  <body>
    <div id="map-canvas"></div>
    <div style="margin-top: 10px;">
      <form>
     <input type="checkbox" value="CRCD" checked="checked" id="search-string-l0" onClick="changeMapl0(this.value);">CRCD Learning Centers
       <input type="checkbox" value="Research" checked="checked" id="search-string-l1" onClick="changeMapl1(this.value);">Off-site Research
       </form>
    </div>
4

1 回答 1

1

您的问题是您的 changeMap 函数实际上并没有根据复选框的值做任何事情：

function changeMapl0() {
   var searchString = document.getElementById('search-string-l0').value.replace(/'/g, "\\'");
   layerl0.setOptions({
      query: {
       select: "'col0'",
       from: '1suBUHqahw5W9f6A6kEVhh-NWmqSbukYqdtnJLWs',
       where: "'category' = '" + searchString + "'"
    }
  });
}

试试这个：

    function changeMapl0() {
       if (document.getElementById('search-string-l0').checked )
       { layerl0.setMap(map); }
       else
       { layerl0.setMap(null); }
    }

工作示例

于 2013-01-18T18:25:46.553 回答