Управление шириной информационного окна Google Maps

Question

Кто-нибудь знает, как установить ширину InfoWindow в Google Maps? Информационное окно - это шарообразный пузырь, который появляется, когда вы нажимаете на точку в Картах Google. Я могу контролировать высоту с помощью CSS, но не могу понять, как изменить ширину (я хочу быть тоньше, чем стандартное информационное окно).

Я нашел ссылку на maxWidth в API, но не могу понять, где это разместить. Есть идеи?

Answer 1

Для v3 API, свойство InfoWindowOptions.maxWidth делает то, что вы просите.Конструктор InfoWindow принимает необязательный аргумент объекта InfoWindowOptions.

var iw = new google.maps.InfoWindow({ content: some_text, maxWidth: 200 });

В документации отмечается, что значение "рассматривается только в том случае, если оно установлено довызов, чтобы открыть. Чтобы изменить максимальную ширину при изменении содержимого, вызовите close, setOptions, а затем откройте. "

Answer 2

Вы можете переопределить стиль Google Maps.

/* Just use .gm-style-iw */ 
.gm-style-iw {
  width: 300px; 
  min-height: 150px;
}

Источник: https://katz.co/resizing-infowindow/

Answer 3

вы можете сначала добавить div следующим образом:

<div style='width:300px;margin:0 0 20px 20px;height:90px;'>