Балун — это всплывающее окно, в котором можно отобразить произвольный HTML-код. Балун связан с определенным местом на карте.
Для открытия балуна можно использовать метод карты openPopup, в таком случае одновременно может быть открыт лишь один балун, либо метод addLayer для отображения любого количества балунов.
Включить отображения балуна по клику на маркер довольно просто:
marker.bindPopup(popupContent).openPopup();
У дополнительных слоев, таких как ломаные, также есть метод bindPopup. Вот более сложный пример отображения балуна:
var popup = DG.popup()
.setLatLng(latlng)
.setContent('<p>Привет!<br />Я балун.</p>')
.openOn(map);
| Конструктор | Использование | Описание |
|---|---|---|
DG.Popup(
|
DG.popup(…)
|
Создает объект Popup с переданными опциями, описывающими внешний вид и расположение балуна, и объектом, указывающим привязку балуна к определенному объекту типа ILayer. |
| Опция | Тип | По умолчанию | Описание |
|---|---|---|---|
maxWidth |
Number |
300 |
Максимальная ширина балуна. |
minWidth |
Number |
50 |
Минимальная ширина балуна. |
maxHeight |
Number |
null |
Если значение установлено и содержимое балуна превышает заданную высоту, создается контейнер указанной высоты со скроллом. |
autoPan |
Boolean |
true |
Установите значение в false, если не хотите чтобы карта автоматически сдвигалась для полного отображения балуна. |
keepInView |
Boolean |
false |
Установите в true, если необходимо предотвратить вероятность перемещения балуна за пределы видимой области карты пока он открыт. |
closeButton |
Boolean |
true |
Отвечает за отображение кнопки закрытия балуна. |
offset |
Point |
|
Устанавливает отступ позиции балуна. Удобно для управления ножкой балуна. |
autoPanPaddingTopLeft |
Point |
|
Задает расстояние от края балуна до левого верхнего угла карты при автоматическом сдвиге. |
autoPanPaddingBottomRight |
Point |
|
Задает расстояние от края балуна до правого нижнего угла карты при автоматическом сдвиге. |
autoPanPadding |
Point |
|
Задает расстояние от края балуна до границы карты при автоматическом сдвиге, устанавливает одинаковые значения для autoPanPaddingBottomRight и autoPanPaddingTopLeft. |
zoomAnimation |
Boolean |
true |
Анимировать ли балун при масштабировании. Отключите, если есть проблемы с отображением Flash содержимого внутри балуна. |
closeOnClick |
Boolean |
false |
Установите в false, если необходимо переопределить поведение закрытия балуна при клике по карте (глобальное поведение для всех балунов задается опцией карты closePopupOnClick). |
sprawling |
Boolean |
false |
По умолчанию, ширина балуна подстраивается под ширину его контента и под ширину карты. Выставьте значение true, если хотите, чтобы выбиралась максимальная ширина, ограниченная только шириной карты. |
| Метод | Возвращает | Описание |
|---|---|---|
addTo(
|
this |
Добавляет балун на карту. |
openOn(
|
this |
Добавляет балун на карту, предварительно закрыв другие балуны. Аналогично map.openPopup(popup). |
setLatLng(
|
this |
Устанавливает географические координаты точки открытия балуна. |
getLatLng(
|
this |
Возвращает географические координаты точки открытия балуна. |
setHeaderContent(
|
this |
Задает содержимое секции header балуна. Может принимать HTML строку или DOM-элемент. |
setContent(
|
this |
Задает содержимое секции body балуна. Может принимать HTML строку или DOM-элемент. |
setFooterContent(
|
this |
Задает содержимое секции footer балуна. Может принимать HTML строку или DOM-элемент. |
getHeaderContent() |
<String | HTMLElement> |
Возвращает содержимое секции header балуна. |
getContent() |
<String | HTMLElement> |
Возвращает содержимое секции body балуна. |
getFooterContent() |
<String | HTMLElement> |
Возвращает содержимое секции footer балуна. |
on(
|
this |
Подписывает обработчик (fn) на определенный тип события. Опционально вы можете указать контекст обработчика (объект, на который будет указывать this) |
off(
|
this |
Отписывает ранее подписанный обработчик. Если обработчик не указан, тогда от определенного типа событий будут отписаны все обработчики. |
DGPopup генерирует события scroll и click, на которые можно подписаться передав ссылку на обработчик, например:
popup.on('click' , this.onClick, context)
| События | Данные | Описание |
|---|---|---|
click |
MouseEvent |
Вызывается при клике на балуне. |
scroll |
|
Вызывается при скролле на балуне. |