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 に答える