2013-01-18 63 views
0

我想通過使用複選框來點擊和關閉圖層,但由於某種原因,我錯過了一些東西,無法讓它再次點擊和關閉。我也想爲每個圖層添加自定義標記,但還沒有成功完成此操作。與onClick和自定義圖標融合表問題

這是我正在使用的代碼。我將不勝感激任何幫助,我對這個代碼的工作是如此的新穎。

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> 

回答

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); } 
    } 

Working example

+0

非常感謝。偶然的情況下,你會知道如何獲取每張地圖的自定義圖標。當然我很困惑。我有圖標只是不知道如何讓每個地圖使用它們。 –