Googleマップの情報ウィンドウの高さの問題
-
05-07-2019 - |
質問
解決策をネットで探しています。
私の問題は、情報ウィンドウの高さが正しく計算されないことです。そこには画像がないため、後で画像を読み込む際の問題ではなく、バブルが作成されたときのサイズは不明です。
また、約15行以上のテキストで埋めると、サイズは問題なくなり始めます。
これは、私がinfoWindowHtmlにフィードするものです:
<div><h2><a href="">Some title</a></h2><dl><dt>Location:</dt><dd>london</dd><dt>Description</dt><dd><p>Example text </p></dd></dl><p><a href="">Read more...</a></p></div>
解決
この問題を解決するには、メインdivの幅と高さを設定します。 幅のみを設定すると、機能します。 width、height、overflow:autoを設定すると、コンテンツが長すぎる場合にスクロールバーも表示されます。
ただし、Google Maps V3ではこの問題は解決されています。
他のヒント
同じ問題が発生しましたが、CSSの.contInfoBubbleにパディングを設定し、optionパラメーターにdon&#180; tを設定しているため、この問題があることを発見しました。 したがって、 iはCSSからパディングを削除し、html(まだ.jsではなくmap.html)にバブルを作成するときにパラメーターに設定します、このように:
[...]
var ib = new InfoBubble({
//minHeight: 125,
minWidth: 220,
padding: 7,
borderColor: "#dedede",
borderRadius: 3,
pixelOffset: new google.maps.Size(-140, -110),
});
[...]
そして問題を解決しました。たぶんあなたにも。
min-height
をinfoWindowクラス要素に追加します。
これにより、情報ウィンドウがすべて同じサイズの場合に問題が解決します。
そうでない場合は、jQueryの次の行をinfoWindowのクリック関数に追加します。
//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');
所属していません StackOverflow