以下のコードは、google-fusion-table を markercluster と連携させるために使用されます。(参考: http://www.cs.gsu.edu/~ashrestha2/vis/prjmap2.html 作者様に敬意を表します) しかし、上記リンクの例を実行しようとしたところ、テストに成功しましたテスト 1 では 2 列のフュージョン テーブルを使用し、テスト 2 では 3 列のフュージョン テーブルを使用しました。テスト 2 の列をもう 1 つ追加しただけなので、なぜ失敗したのかわかりません。
google.load('visualization', '1.0', {"callback":initialize});
//var tableid = '1_6G1c1l7glLHRuOU7uvH8oONbObDf_cOtZS21Rc', atlcenter = new google.maps.LatLng(33.755711,-84.388372); //test1_success
var tableid = '1IagEEylcnbuPygCES70ipnvb9q0C5OgmGPNyx9o1', atlcenter = new google.maps.LatLng(33.755711,-84.388372); //test2_fail
var mapMain, markers, dataTable = null, mc = null;
function initialize() {
mapMain = new google.maps.Map(document.getElementById('map-canvas'), {
center: atlcenter,
zoom: 5,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
mc = new MarkerClusterer(mapMain);
queryMap("select * from "+tableid);
}
function queryMap(queryText){
mc.clearMarkers(); markers=[];
var tmp = 'http://www.google.com/fusiontables/gvizdata?tq='+encodeURIComponent(queryText);
var query = new google.visualization.Query(tmp);
query.send(handleQueryResponse);
}
function handleQueryResponse(response){
dataTable = response.getDataTable();
alert(response.isError());
for(var i=0; i< dataTable.getNumberOfRows();i++){
var hrefval = dataTable.getValue(i,0).toString();
var arr = dataTable.getValue(i,1).toString().split(" ");
var latlng = new google.maps.LatLng(arr[0], arr[1]);
var marker = new google.maps.Marker({
position: latlng,
map:mapMain
});
markers.push(marker);
}
mc.addMarkers(markers);
}