Google マップ API - 情報ウィンドウの高さとパン

StackOverflow https://stackoverflow.com/questions/2584877

  •  24-09-2019
  •  | 
  •  

質問

Google マップ API (v2) を使用して、世界地図上に国のオーバーレイを表示しています。データは KML ファイルから取得されます。このファイルには、ポリゴンの座標と各国の HTML 記述が含まれています。この説明は、その国をクリックすると「情報ウィンドウ」の吹き出しに表示されます。

情報ウィンドウが含まれる HTML コンテンツのサイズに合わせて拡大されず、長いウィンドウが端からはみ出してしまうため、最初はいくつか問題がありました (これは一般的な問題のようです)。次のように情報ウィンドウを特定の高さにリセットすることで、この問題を回避できました。

GEvent.addListener(map, "infowindowopen", function(iw) { iw = map.getInfoWindow(); iw.reset(iw.getPoint(), iw.getTabs(), new GSize(300, 295), null, null); });

理想的ではありませんが、機能します。ただし、現在では、情報ウィンドウを開いたときに、すべてのコンテンツが表示できる位置にマップがパンしないため、情報ウィンドウの上部がマップの端によって隠れることがあります。

そこで私の質問:

  1. 設定されたピクセル高さに固定する必要を避けるために、情報ウィンドウがコンテンツに適した高さを自動的に使用するようにする方法はありますか?

  2. 高さを固定することが唯一の選択肢である場合、情報ウィンドウが開いたときにマップをより適切な位置にパンする方法はありますか?マップ クラスに panTo() メソッドがあることはわかっていますが、正しい座標を計算する方法がわかりません。

私の完全な初期化コードは次のとおりです。

google.load("maps", "2.x");

// Call this function when the page has been loaded
function initialize() {
  var map = new google.maps.Map2(document.getElementById("map"), {backgroundColor:'#99b3cc'});

  map.addControl(new GSmallZoomControl());

  map.setCenter(new google.maps.LatLng(29.01377076013671, -2.7866649627685547), 2);

  gae_countries = new GGeoXml("http://example.com/countries.kmz");
  map.addOverlay(gae_countries);

  GEvent.addListener(map, "infowindowopen", function(iw) { iw = map.getInfoWindow(); iw.reset(iw.getPoint(), iw.getTabs(), new GSize(300, 295), null, null); });
}
google.setOnLoadCallback(initialize);
役に立ちましたか？

解決

私は最終的に私のサイズ変更リスナーを削除して、CSSを使用して隠されたバルーンの先頭にテキストを追加することでこれを解決しました。いくつかの試行錯誤は、高さの権利を取得する必要がありました。ない理想的なソリューションが、それはAPIの将来のバージョンまではうまくいくが、もう少しコントロールを提供します。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top