Google Map .InfoWindow Установить высоту и ширину

Question

Как установить размер и ширину карты Google InfoWindow?Я посмотрел на странице API и нашел только maxWidth метод.

Редактировать: Я пробовал несколько вещей.Пока что ни одна из этих работ:

    var markerInfoWindow = new google.maps.InfoWindow({
        content: markerHTMLString,
        maxHeight: 400,  //Doesn't work
        maxWidth: 400,   //Doesn't work
        width: 300,      //Doesn't work
        height: 300      //Doesn't work
    });

Также скажем, что markerHTMLString равно этому:

<div class = "MarkerPopUp"><div class = "MarkerContext">Text</div></div>

Я также пробовал эти три варианта (ни один из них не работал)

1. .MarkerPopUp {
       height: 300px;
       width: 300px;
   }
   

2. .MarkerPopUp {
       height: 300px;
       width: 300px;
   }
   
   .MarkerContext {
       height: 300px;
       width: 300px;
   }
   

3. .MarkerContext {
       height: 300px;
       width: 300px;
   }
   

Это также не будет работать:

document.getElementById('MarkerPopUp')parentNode.style.overflow = '';

или это

document.getElementById('MarkerPopUp').parentNode.parentNode.style.overflow = '';

Я в значительной степени просматриваю все темы, которые могу найти, и пробую все.Просто чтобы ограничить некоторые вещи (хотя может быть и другая проблема)

Answer 1

Может случиться так, что, когда HTML-код передается в API-интерфейс карты и анализируется, он не имеет доступа к вашим изменениям таблицы стилей.Попробуйте добавить свою ширину как встроенный стиль в MarkerPopUp.

<div class = "MarkerPopUp" style="width: 300px;"><div class = "MarkerContext">Text</div></div>

Я знаю, я тоже ненавижу встроенные стили, но это может решить вашу проблему в этом случае.

Answer 2

Вы можете использовать оболочку <div> и добавить стиль, подобный этому <div style='height: 40px; text-align: center'>, и добавить код CSS .gm-style-iw { max-width: 400px!important;} в свой файл CSS;

Answer 3

Используйте! Важные в CSS

.MarkerPopUp {
    height: 300px !important;
    width: 300px !important;
}

Answer 4

Попробуйте следующий код:

 infowindow = new google.maps.InfoWindow({
        content: "",
        maxWidth: 200 ,
        maxHeight: 400
    });

Answer 5

.gm-style-iw{
    max-height: 10px;
}

Настройка стиля для gm-style-iw делает работу!