使用Google Fusion Tables中的查询API

我一直在使用Google Spreadsheets和Fusion Tables来创建地图，但我想要做一些涉及更多代码的事情，并希望您能帮助完善我的方法。使用Google Fusion Tables中的查询API

从本质上讲，我用电子表格刮GP和来自英国的NHS本地网站化验数据，并用数据融合表进行地理编码它（https://www.google.com/fusiontables/DataSource?docid=1xmT0D6H6JjRlXVyetubasugqQMswJqKNH7nrKh4）。

我现在要做的就是使用Google Maps API发布Fusion Table数据，但是随后添加控件以便用户可以过滤掉他们不想要的位。我知道如何创建自定义按钮，但我无法解决的是如何在单击按钮时创建查询。

这是一个非常有用的东西，所以如果你能提供帮助，那将会很棒。

我的努力到目前为止都低于：

http://davidelks.com/MashupTests/gmapsTest.html

<script type="text/javascript"> 
    var map, infoWindow; 
    var toggle_doctors = 'false'; 
    var toggle_chemists = 'false'; 

    $(document).ready(function(){ 
     infoWindow = new google.maps.InfoWindow({}); 
     map = new GMaps({ 
      div: '#map', 
      lat: 53.023098, 
      lng: -2.197793, 
      zoom: 11 
     }); 

     var doctors = map.addControl({ 
      position: 'left_bottom', 
      text: 'GPs', 
      style: { 
      margin: '1px', 
      padding: '1px 6px', 
      border: 'solid 1px #717B87', 
      width: '85px', 
      background: '#99ff99' 
      }, 
      events: { 
       click: function(){ 

        if (toggle_doctors == 'true'){ 
         toggle_doctors = 'false'; 
         doctors.style.backgroundColor = '#ffffff'; 

        } 
        else { 
         toggle_doctors = 'true'; 
         doctors.style.backgroundColor ='#99ff99'; 

        } 

       } 
      } 
     }); 

     var chemists = map.addControl({ 
      position: 'left_bottom', 
      text: 'Late chemists', 
      style: { 
      margin: '1px', 
      width: '85px', 
      padding: '1px 6px', 
      border: 'solid 1px #717B87', 
      background: '#9999ff' 
      }, 
      events: { 
       // toggle button between white and colour 
       click: function(){ 

        if (toggle_chemists == 'true'){ 
         toggle_chemists = 'false'; 
         chemists.style.backgroundColor = '#ffffff'; 


        } 
        else { 
         toggle_chemists = 'true'; 
         chemists.style.backgroundColor ='#9999ff'; 

        } 

       } 
      } 
     }); 

     map.loadFromFusionTables({ 
      query: { 

      select: '*', 
      from: '1xmT0D6H6JjRlXVyetubasugqQMswJqKNH7nrKh4', 
      where: 'TYPE == \'GP\'' 
      }, 

      events: { 
       click: function(point){ 

       infoWindow.setPosition(point.latLng); 
       infoWindow.open(map.map); 
       } 
      } 
     }); 



    });//end of code block 


</script> 
<div id="map" style="height: 500px; width: 300px; border: 1px;"></div>

来源

2012-07-06 elksie5000