Google отображает проблему высоты информационного окна

Question

Я искал в сети решение.

Моя проблема в том, что высота информационного окна не рассчитана должным образом. Там нет изображений там, так что это не проблема с загрузкой изображений позже, и размер не известен, когда пузырь создается.

Кроме того, если я заполню его примерно на 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>

Answer 1

Чтобы решить эту проблему, вы можете установить ширину и высоту основного div. Если вы установите только ширину, это будет работать. Если вы установите ширину, высоту и переполнение: авто, вы также получите полосу прокрутки в случае слишком длинного содержимого.

Однако в Google Maps V3 эта проблема решена.

Answer 2

У меня была та же проблема, но я обнаружил, что у меня была эта проблема, потому что я установил padding для.contInfoBubble в CSS, а не в параметре option. Итак, я удаляю отступы из 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),
});
[...]

И я решил проблему. Может и тебе тоже.

Answer 3

Добавить min-height к вашему элементу класса infoWindow.

Это решит проблему, если ваши информационные окна имеют одинаковый размер.

Если нет, добавьте эту строку jQuery в функцию щелчка для окна информации:

//remove overflow scrollbars
$('#myDiv').parent().css('overflow','');