私はGoogleスプレッドシートとFusionTablesを使って地図を作成してきましたが、もう少しコーディングが必要なことをしたいと思っています。私のアプローチを改善するのに役立つことを願っています。
基本的に、スプレッドシートを使用して英国NHSローカルサイトからGPおよびChemistデータを取得し、Fusion Tablesを使用してジオコーディングしました（https://www.google.com/fusiontables/DataSource?docid=1xmT0D6H6JjRlXVyetubasugqQMswJqKNH7nrKh4）。
私が今やろうとしているのは、Google MapsAPIを使用してFusionTableデータを公開し、ユーザーが不要なビットを除外できるようにコントロールを追加することです。カスタムボタンを作成する方法を知っていますが、ボタンがクリックされた場合にクエリを作成する方法がわかりません。
それは非常に役立つものなので、あなたが助けることができればそれは素晴らしいことです。
これまでの私の努力は以下のとおりです。
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>