設定
これは、次のように v3 Google マップに取り込まFusionTablesLayer
れます。
// The Google Map object
map = new google.maps.Map( mapCanvas, mapOptions );
// The FusionTables layer
layer['provinces'] = new google.maps.FusionTablesLayer({
query: {
select: '*',
from: '16L-UK_1OZxGw6DlKR8V8yP4XZrtmNdOMugRRNrQ'
},
clickable: true,
suppressInfoWindows: true // Hide the default FusionTables InfoWindow
});
その直後に、click
イベント リスナーをにアタッチしFusionTablesLayer
、次のようにカスタム InfoBox オブジェクトを作成します。
google.maps.event.addListener(layer['provinces'], 'click', function(e){
/*
Here I build the infoBox HTML using e.row[]
eg: html = '<div>' + e.row['Province'].value + '</div>';
*/
// Attach the infoBox to the click
infoBox.setContent(html);
infoBox.setPosition(e.latLng);
infoBox.open(map);
});
その後、マップ上にレイヤーをレンダリングします。
// Render the layer on the map
layer['provinces'].setMap(map);
これはすべて機能します。問題ない。
問題
クリック イベントは、FusionTable のそれぞれの行のすべての列を返し、それをe
上記の変数にアタッチします。
現在、 FusionTable の各行には、114kb から 2.5MB までの非常に長いe.infoWindowHtml
KML 文字列が含まれており、これは および で返されe.row['Polygon'].value
ます。
e: (Object)
infoWindowHtml: "_Very_ long string in here."
latLng: Q
pixelOffset: T
row: (Object)
Number: (Object)
Polygon: (Object)
Province: (Object)
Google 側のキャッシュが多いため、リクエストにそれほど時間はかかりませんが、都道府県をクリックしてから infoBox がポップアップするまでに約 5 秒かかります。
tl;dr
infoBox.open(map)
FusionTables ポリゴンをクリックした後のメソッドは非常に低速です。どうすれば高速化できますか?
アップデート
データは最初のクリック後にキャッシュされます。最初のクリックの前にデータをキャッシュする方法はありますか?
あるいは、に添付された返される変数を制限する方法はありe
ますか?つまり、クリック要求から「ポリゴン」データを削除しますか?