Advanced Markers

Класс AdvancedMarkerElement

google.maps.marker.AdvancedMarkerElement класс

Показывает местоположение на карте. Обратите внимание, что для показа AdvancedMarkerElement необходимо задать position.

Специальный элемент:
<gmp-advanced-marker anchor-left="string" anchor-top="string" gmp-clickable position="lat,lng" title="string"></gmp-advanced-marker>

Этот класс расширяет HTMLElement.

Этот класс реализует AdvancedMarkerElementOptions.

Чтобы получить доступ, позвоните по номеру const {AdvancedMarkerElement} = await google.maps.importLibrary("marker").
Подробнее о библиотеках Maps JavaScript API…
AdvancedMarkerElement
AdvancedMarkerElement([options])
Параметры: 
Создает объект AdvancedMarkerElement с указанными параметрами. Если карта указана, то при создании AdvancedMarkerElement добавляется на карту.
anchorLeft
Тип:  string optional
Значение по умолчанию: -50 %.
Значение CSS length-percentage, которое используется для смещения опорной точки маркера относительно его левого верхнего угла. Это полезно, если у визуального элемента есть точка привязки, которая отличается от стандартной точки внизу по центру маркера по умолчанию.
HTML-атрибут:
  • <gmp-advanced-marker anchor-left="string"></gmp-advanced-marker>
anchorTop
Тип:  string optional
Значение по умолчанию: -100 %.
Значение CSS length-percentage, которое используется для смещения опорной точки маркера относительно его левого верхнего угла. Это полезно, если у визуального элемента есть точка привязки, которая отличается от стандартной точки внизу по центру маркера по умолчанию.
HTML-атрибут:
  • <gmp-advanced-marker anchor-top="string"></gmp-advanced-marker>
collisionBehavior
Тип:  CollisionBehavior optional
Посмотрите AdvancedMarkerElementOptions.collisionBehavior.
gmpClickable
Тип:  boolean optional
Посмотрите AdvancedMarkerElementOptions.gmpClickable.
HTML-атрибут:
  • <gmp-advanced-marker gmp-clickable></gmp-advanced-marker>
gmpDraggable
Тип:  boolean optional
Посмотрите AdvancedMarkerElementOptions.gmpDraggable.
map
Тип:  Map optional
Посмотрите AdvancedMarkerElementOptions.map.
position
Посмотрите AdvancedMarkerElementOptions.position.
HTML-атрибут:
  • <gmp-advanced-marker position="lat,lng"></gmp-advanced-marker>
  • <gmp-advanced-marker position="lat,lng,altitude"></gmp-advanced-marker>
title
Тип:  string
Посмотрите AdvancedMarkerElementOptions.title.
HTML-атрибут:
  • <gmp-advanced-marker title="string"></gmp-advanced-marker>
zIndex
Тип:  number optional
Посмотрите AdvancedMarkerElementOptions.zIndex.
element
Тип:  HTMLElement
Это поле доступно только для чтения. Элемент DOM, поддерживающий представление.
content
Тип:  Node optional
Посмотрите AdvancedMarkerElementOptions.content.
addEventListener
addEventListener(type, listener[, options])
Параметры: 
  • type:  string Строка с учетом регистра, представляющая тип события, которое нужно отслеживать.
  • listener:  EventListener|EventListenerObject Объект, который получает уведомление. Это должна быть функция или объект с методом handleEvent.
  • options:  boolean|AddEventListenerOptions optional Посмотрите варианты. Специальные события поддерживают только capture и passive.
Возвращаемое значение:  void
Настраивает функцию, которая будет вызываться каждый раз, когда указанное событие доставляется целевому объекту. См. addEventListener.
addListener
addListener(eventName, handler)
Параметры: 
  • eventName – string зарегистрированное событие.
  • handler:  Function функция для обработки событий.
Возвращаемое значение:  MapsEventListener результирующий прослушиватель событий.
Добавляет заданную функцию прослушивателя к заданному названию события в системе событий Maps.
removeEventListener
removeEventListener(type, listener[, options])
Параметры: 
  • type:  string Строка, указывающая тип события, для которого нужно удалить прослушиватель событий.
  • listener:  EventListener|EventListenerObject Прослушиватель событий обработчика событий, который нужно удалить из целевого объекта события.
  • options:  boolean|EventListenerOptions optional Посмотрите варианты.
Возвращаемое значение:  void
Удаляет из целевого объекта прослушиватель событий, ранее зарегистрированный с помощью addEventListener. Подробнее removeEventListener…
click
function(event)
Аргументы: 
Это событие активируется при нажатии на элемент AdvancedMarkerElement.

Недоступно с addEventListener() (используйте gmp-click).
drag
function(event)
Аргументы: 
Это событие активируется многократно во время перетаскивания AdvancedMarkerElement.

Недоступно в addEventListener().
dragend
function(event)
Аргументы: 
Это событие активируется, когда пользователь заканчивает перетаскивать AdvancedMarkerElement.

Недоступно в addEventListener().
dragstart
function(event)
Аргументы: 
Это событие активируется, когда пользователь начинает перетаскивать AdvancedMarkerElement.

Недоступно в addEventListener().
gmp-click
function(event)
Аргументы: 
Это событие активируется при нажатии на элемент AdvancedMarkerElement. Рекомендуется использовать с addEventListener() (вместо addListener()).

Интерфейс AdvancedMarkerElementOptions

google.maps.marker.AdvancedMarkerElementOptions интерфейс

Параметры для создания AdvancedMarkerElement.
anchorLeft optional
Тип:  string optional
Значение по умолчанию: -50 %.
Значение CSS length-percentage, которое используется для смещения опорной точки маркера относительно его левого верхнего угла. Это полезно, если у визуального элемента есть точка привязки, которая отличается от стандартной точки внизу по центру маркера по умолчанию.
anchorTop optional
Тип:  string optional
Значение по умолчанию: -100 %.
Значение CSS length-percentage, которое используется для смещения опорной точки маркера относительно его левого верхнего угла. Это полезно, если у визуального элемента есть точка привязки, которая отличается от стандартной точки внизу по центру маркера по умолчанию.
collisionBehavior optional
Тип:  CollisionBehavior optional
Перечисление, определяющее, как должен вести себя объект AdvancedMarkerElement, когда он пересекается с другим объектом AdvancedMarkerElement или с ярлыками базовой карты на векторной карте.

Примечание. Пересечение AdvancedMarkerElement с AdvancedMarkerElement работает как на растровых, так и на векторных картах, а пересечение AdvancedMarkerElement с ярлыком базовой карты – только на векторных.
content optional
Тип:  Node optional
По умолчанию: PinElement.
Элемент DOM, поддерживающий визуальное представление AdvancedMarkerElement.

Примечание. Метод AdvancedMarkerElement не клонирует переданный элемент DOM. Если элемент DOM передается в AdvancedMarkerElement, то при передаче того же элемента DOM в другой AdvancedMarkerElement элемент DOM будет перемещен, а предыдущий AdvancedMarkerElement будет выглядеть пустым.
gmpClickable optional
Тип:  boolean optional
По умолчанию: false.
Если задано значение true, то на AdvancedMarkerElement можно будет нажать, чтобы активировать событие gmp-click. Кроме того, будет доступно интерактивное взаимодействие в рамках специальных возможностей (например, навигация с помощью клавиш со стрелками).
gmpDraggable optional
Тип:  boolean optional
По умолчанию: false.
Если true, то AdvancedMarkerElement можно перетащить.

Примечание. AdvancedMarkerElement с высотой нельзя перетаскивать.
map optional
Тип:  Map optional
Карта, на которой будет показан AdvancedMarkerElement. Карта необходима для отображения AdvancedMarkerElement. Ее можно указать, задав AdvancedMarkerElement.map, если она не была указана при создании.
position optional
Задает положение AdvancedMarkerElement. Объект AdvancedMarkerElement можно создать без указания позиции, но он не будет показываться, пока позиция не будет задана, например в результате действий или выбора пользователя. Положение объекта AdvancedMarkerElement можно задать с помощью свойства AdvancedMarkerElement.position, если оно не было указано при создании.

Примечание. AdvancedMarkerElement с высотой поддерживается только на векторных картах.
title optional
Тип:  string optional
текст, выводимый при наведении курсора на элемент. Если указан текст специальных возможностей (например, для программ чтения с экрана), он будет добавлен в AdvancedMarkerElement с указанным значением.
zIndex optional
Тип:  number optional
Все объекты AdvancedMarkerElement отображаются на карте в порядке, определяемом значением zIndex. Объекты с более высокими значениями отображаются поверх объектов AdvancedMarkerElement с низкими значениями. По умолчанию AdvancedMarkerElement отображаются в соответствии с их положением по вертикали на экране: AdvancedMarkerElement, расположенные ниже, показываются поверх AdvancedMarkerElement, расположенных выше. Обратите внимание, что zIndex также используется для определения относительного приоритета между расширенными маркерами CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY. (чем больше значение zIndex, тем выше приоритет).

Класс AdvancedMarkerClickEvent

google.maps.marker.AdvancedMarkerClickEvent класс

Это событие создается при нажатии на расширенный маркер. Получите доступ к положению маркера с помощью event.target.position.

Этот класс расширяет Event.

Чтобы получить доступ, позвоните по номеру const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker").
Подробнее о библиотеках Maps JavaScript API…

Класс PinElement

google.maps.marker.PinElement класс

PinElement представляет собой элемент DOM, состоящий из фигуры и глифа. Фигура имеет тот же стиль выноски, что и в стандартном AdvancedMarkerElement или Marker3DElement. Глиф – это необязательный элемент DOM, который показывается в форме выноски. Соотношение сторон PinElement может отличаться в зависимости от PinElement.scale.

Этот класс расширяет HTMLElement.

Этот класс реализует PinElementOptions.

Чтобы получить доступ, позвоните по номеру const {PinElement} = await google.maps.importLibrary("marker").
Подробнее о библиотеках Maps JavaScript API…
PinElement
PinElement([options])
Параметры: 
background
Тип:  string optional
Посмотрите PinElementOptions.background.
borderColor
Тип:  string optional
Посмотрите PinElementOptions.borderColor.
glyphColor
Тип:  string optional
Посмотрите PinElementOptions.glyphColor.
glyphSrc
Тип:  URL|string optional
Посмотрите PinElementOptions.glyphSrc.
glyphText
Тип:  string optional
Посмотрите PinElementOptions.glyphText.
scale
Тип:  number optional
Посмотрите PinElementOptions.scale.
element
Тип:  HTMLElement
Это поле доступно только для чтения. Элемент DOM, поддерживающий представление.
glyph
Тип:  string|Element|URL optional
Посмотрите PinElementOptions.glyph.
addEventListener
addEventListener(type, listener[, options])
Параметры: 
  • type:  string Строка с учетом регистра, представляющая тип события, которое нужно отслеживать.
  • listener:  EventListener|EventListenerObject Объект, который получает уведомление. Это должна быть функция или объект с методом handleEvent.
  • options:  boolean|AddEventListenerOptions optional Посмотрите варианты. Специальные события поддерживают только capture и passive.
Возвращаемое значение:  void
Настраивает функцию, которая будет вызываться каждый раз, когда указанное событие доставляется целевому объекту. Подробнее addEventListener…
removeEventListener
removeEventListener(type, listener[, options])
Параметры: 
  • type:  string Строка, указывающая тип события, для которого нужно удалить прослушиватель событий.
  • listener:  EventListener|EventListenerObject Прослушиватель событий обработчика событий, который нужно удалить из целевого объекта события.
  • options:  boolean|EventListenerOptions optional Посмотрите варианты.
Возвращаемое значение:  void
Удаляет из целевого объекта прослушиватель событий, ранее зарегистрированный с помощью addEventListener. Подробнее removeEventListener…

Интерфейс PinElementOptions

google.maps.marker.PinElementOptions интерфейс

Параметры для создания PinElement.
background optional
Тип:  string optional
Цвет фона маркера. Поддерживается любое значение цвета CSS.
borderColor optional
Тип:  string optional
Цвет границы маркера. Поддерживается любое значение цвета CSS.
glyph optional
Тип:  string|Element|URL optional
Элемент DOM, который показывается в маркере.
glyphColor optional
Тип:  string optional
Цвет глифа. Поддерживается любое значение цвета CSS.
glyphSrc optional
Тип:  URL|string optional
Источник изображения глифа, которое будет показываться в маркере.
glyphText optional
Тип:  string optional
Текст, который показывается в маркере.
scale optional
Тип:  number optional
По умолчанию: 1.
Масштаб маркера.