3D Maps

Класс Map3DElement

google.maps.maps3d.Map3DElement класс

Map3DElement – это HTML-интерфейс для 3D-карты. Обратите внимание, что для начала отрисовки 3D-карты необходимо задать mode.

Специальный элемент:
<gmp-map-3d center="lat,lng,altitude" default-ui-hidden description="string" gesture-handling="auto" heading="number" internal-usage-attribution-ids="id1 id2" map-id="string" max-altitude="number" max-heading="number" max-tilt="number" min-altitude="number" min-heading="number" min-tilt="number" mode="hybrid" range="number" roll="number" tilt="number" default-ui-disabled></gmp-map-3d>

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

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

Чтобы получить доступ, позвоните по номеру const {Map3DElement} = await google.maps.importLibrary("maps3d").
Подробнее о библиотеках Maps JavaScript API…
Map3DElement
Map3DElement([options])
Параметры: 
bounds
Если задано, ограничивает положение камеры указанными границами широты и долготы. Обратите внимание, что объекты за пределами границ все равно отрисовываются. Границы могут ограничивать как широту, так и долготу, или только широту, или только долготу. Для границ только по широте используйте западную и восточную долготу -180 и 180 соответственно. Для границ только по долготе используйте северную и южную широту 90 и -90 соответственно.
center
Центр карты, заданный как LatLngAltitude, где высота указана в метрах над уровнем земли. Обратите внимание, что это не обязательно местоположение камеры, поскольку поле range влияет на расстояние от камеры до центра карты. Если не задано, по умолчанию используется {lat: 0, lng: 0, altitude: 63170000}. 63 170 000 м – максимально допустимая высота (радиус Земли, умноженный на 10).
HTML-атрибут:
  • <gmp-map-3d center="lat,lng,altitude"></gmp-map-3d>
defaultUIHidden
Тип:  boolean optional
По умолчанию: false.
Если задано значение true, все кнопки интерфейса по умолчанию скрыты.
HTML-атрибут:
  • <gmp-map-3d default-ui-hidden></gmp-map-3d>
description
Тип:  string optional
Если вы добавите описание специальных возможностей (например, для программ чтения с экрана), оно будет добавлено на карту с указанным значением.
HTML-атрибут:
  • <gmp-map-3d description="string"></gmp-map-3d>
gestureHandling
Тип:  GestureHandling optional
По умолчанию: GestureHandling.GREEDY.
Управляет жестами в совместном режиме. Если задано значение COOPERATIVE, для прокрутки карты нужно использовать клавиши-модификаторы или жесты двумя пальцами. Если задано значение GREEDY, то прокрутка страницы не будет выполняться при действиях пользователя с элементом карты. Если задано значение AUTO, обработка жестов определяется возможностью прокрутки страницы.
HTML-атрибут:
  • <gmp-map-3d gesture-handling="auto"></gmp-map-3d>
  • <gmp-map-3d gesture-handling="cooperative"></gmp-map-3d>
  • <gmp-map-3d gesture-handling="greedy"></gmp-map-3d>
heading
Тип:  number optional
Направление карты по компасу в градусах, где север – это ноль. Если наклона нет, то любой крен будет интерпретироваться как курс.
HTML-атрибут:
  • <gmp-map-3d heading="number"></gmp-map-3d>
internalUsageAttributionIds
Тип:  Iterable<string> optional
Добавляет идентификатор атрибуции использования в инициализатор, что помогает Google понять, какие библиотеки и примеры полезны для разработчиков, например использование библиотеки кластеризации маркеров. Чтобы отказаться от отправки идентификатора атрибуции использования, можно удалить это свойство. Будут отправлены только уникальные значения. Изменения этого значения после создания экземпляра могут игнорироваться.
HTML-атрибут:
  • <gmp-map-3d internal-usage-attribution-ids="id1 id2"></gmp-map-3d>
language
Тип:  string optional
Язык, на котором будет отображаться базовая карта. По умолчанию используется язык, запрошенный разработчиком при загрузке Maps JS API.
mapId
Тип:  string optional
Указывает идентификатор карты, который будет использоваться для получения облачного стиля карты. Не следует задавать это свойство после инициализации карты. Поэтому мы следим за тем, чтобы идентификатор mapId задавался только во время инициализации, и не публикуем этот атрибут в общедоступных каналах.
HTML-атрибут:
  • <gmp-map-3d map-id="string"></gmp-map-3d>
maxAltitude
Тип:  number optional
Максимальная высота над землей, которая будет отображаться на карте. Допустимое значение – от 0 до 63170000 метров (радиус Земли, умноженный на 10).
HTML-атрибут:
  • <gmp-map-3d max-altitude="number"></gmp-map-3d>
maxHeading
Тип:  number optional
Максимальный угол поворота карты. Допустимое значение – от 0 до 360 градусов. minHeading и maxHeading представляют собой интервал <= 360 градусов, в котором будут разрешены жесты головой. minHeading = 180 и maxHeading = 90 позволят двигаться в направлении [0, 90] и [180, 360]. minHeading = 90 и maxHeading = 180 позволят двигаться в направлении [90, 180].
HTML-атрибут:
  • <gmp-map-3d max-heading="number"></gmp-map-3d>
maxTilt
Тип:  number optional
Максимальный угол падения карты. Допустимое значение – от 0 до 90 градусов.
HTML-атрибут:
  • <gmp-map-3d max-tilt="number"></gmp-map-3d>
minAltitude
Тип:  number optional
Минимальная высота над землей, которая будет отображаться на карте. Допустимое значение – от 0 до 63170000 метров (радиус Земли, умноженный на 10).
HTML-атрибут:
  • <gmp-map-3d min-altitude="number"></gmp-map-3d>
minHeading
Тип:  number optional
Минимальный угол направления (поворота) карты. Допустимое значение – от 0 до 360 градусов. minHeading и maxHeading представляют собой интервал <= 360 градусов, в котором будут разрешены жесты головой. minHeading = 180 и maxHeading = 90 позволят двигаться в направлении [0, 90] и [180, 360]. minHeading = 90 и maxHeading = 180 позволят двигаться в направлении [90, 180].
HTML-атрибут:
  • <gmp-map-3d min-heading="number"></gmp-map-3d>
minTilt
Тип:  number optional
Минимальный угол падения карты. Допустимое значение – от 0 до 90 градусов.
HTML-атрибут:
  • <gmp-map-3d min-tilt="number"></gmp-map-3d>
mode
Тип:  MapMode optional
Указывает режим, в котором должна отображаться карта. Если не задать этот параметр, карта не будет отрисована.
HTML-атрибут:
  • <gmp-map-3d mode="hybrid"></gmp-map-3d>
  • <gmp-map-3d mode="satellite"></gmp-map-3d>
range
Тип:  number optional
Расстояние от камеры до центра карты в метрах.
HTML-атрибут:
  • <gmp-map-3d range="number"></gmp-map-3d>
region
Тип:  string optional
Регион, для которого нужно отрисовать объекты инфраструктуры на базовой карте. По умолчанию используется регион, указанный разработчиком при загрузке Maps JS API.
roll
Тип:  number optional
Крен камеры вокруг вектора обзора в градусах. Чтобы избежать неоднозначности, при отсутствии наклона любой крен будет интерпретироваться как курс.
HTML-атрибут:
  • <gmp-map-3d roll="number"></gmp-map-3d>
tilt
Тип:  number optional
Наклон вектора обзора камеры в градусах. Если вектор направлен прямо вниз, наклон равен нулю. Вектор, направленный от Земли, имеет наклон 180 градусов.
HTML-атрибут:
  • <gmp-map-3d tilt="number"></gmp-map-3d>
defaultUIDisabled
Тип:  boolean optional
По умолчанию: false.
Если задано значение true, все кнопки пользовательского интерфейса по умолчанию отключены. Не отключает клавиатуру и управление жестами.
HTML-атрибут:
  • <gmp-map-3d default-ui-disabled></gmp-map-3d>
addEventListener
addEventListener(type, listener[, options])
Параметры: 
  • type:  string Строка с учетом регистра, представляющая тип события, которое нужно отслеживать.
  • listener:  EventListener|EventListenerObject Объект, который получает уведомление. Это должна быть функция или объект с методом handleEvent.
  • options:  boolean|AddEventListenerOptions optional Посмотрите варианты. Специальные события поддерживают только capture и passive.
Возвращаемое значение:  void
Настраивает функцию, которая будет вызываться каждый раз, когда указанное событие доставляется целевому объекту. Подробнее addEventListener…
flyCameraAround
flyCameraAround(options)
Параметры: 
Возвращаемое значение: нет.
Этот метод вращает камеру вокруг заданного местоположения в течение заданного времени. Анимацию можно повторить заданное количество раз (FlyAroundAnimationOptions.repeatCount).

Камера будет двигаться по часовой стрелке.

Метод является асинхронным, поскольку анимация может начаться только после того, как карта загрузится до определенного уровня. Метод возвращает значение после запуска анимации.

Если указать FlyAroundAnimationOptions.repeatCount, вращения не будет, а анимация завершится сразу после начала.
flyCameraTo
flyCameraTo(options)
Параметры: 
Возвращаемое значение: нет.
Этот метод перемещает камеру по параболе из текущего местоположения в заданное конечное местоположение за заданное время.

Метод является асинхронным, поскольку анимация может начаться только после того, как карта загрузится до определенного уровня. Метод возвращает значение после запуска анимации.
removeEventListener
removeEventListener(type, listener[, options])
Параметры: 
  • type:  string Строка, указывающая тип события, для которого нужно удалить прослушиватель событий.
  • listener:  EventListener|EventListenerObject Прослушиватель событий обработчика событий, который нужно удалить из целевого объекта события.
  • options:  boolean|EventListenerOptions optional Посмотрите варианты.
Возвращаемое значение:  void
Удаляет из целевого объекта прослушиватель событий, ранее зарегистрированный с помощью addEventListener. Подробнее removeEventListener…
stopCameraAnimation
stopCameraAnimation()
Параметры: нет.
Возвращаемое значение: нет.
Этот метод останавливает любую анимацию полета, которая может выполняться. Камера остается там, где она находится в середине анимации, и не телепортируется в конечную точку.

Метод является асинхронным, поскольку анимация может запускаться или останавливаться только после того, как карта загрузится до определенного уровня. Метод возвращает значение после остановки анимации.
gmp-animationend
function(animationEndEvent)
Аргументы: 
  • animationEndEvent:  Event
Это событие активируется, когда заканчивается анимация полета. Это событие всплывает по дереву DOM.
gmp-centerchange
function(centerChangeEvent)
Аргументы: 
  • centerChangeEvent:  Event
Это событие активируется при изменении свойства center элемента Map3DElement.
gmp-click
function(clickEvent)
Аргументы: 
Это событие активируется при нажатии на элемент Map3DElement.
gmp-error
function(mapInitializationErrorEvent)
Аргументы: 
  • mapInitializationErrorEvent:  Event
Это событие активируется, когда не удается инициализировать карту.
gmp-headingchange
function(headingChangeEvent)
Аргументы: 
  • headingChangeEvent:  Event
Это событие запускается при изменении свойства heading элемента Map3DElement.
gmp-map-id-error
function(mapIdErrorEvent)
Аргументы: 
  • mapIdErrorEvent:  Event
Это событие активируется, если свойство mapId элемента Map3DElement недействительно.
gmp-rangechange
function(rangeChangeEvent)
Аргументы: 
  • rangeChangeEvent:  Event
Это событие активируется, когда меняется свойство range элемента Map3DElement.
gmp-rollchange
function(rollChangeEvent)
Аргументы: 
  • rollChangeEvent:  Event
Это событие активируется при изменении свойства roll элемента Map3DElement.
gmp-steadychange
function(steadyChangeEvent)
Аргументы: 
Это событие активируется, когда меняется устойчивое состояние Map3DElement.
gmp-tiltchange
function(tiltChangeEvent)
Аргументы: 
  • tiltChangeEvent:  Event
Это событие активируется при изменении свойства tilt элемента Map3DElement.

Интерфейс Map3DElementOptions

google.maps.maps3d.Map3DElementOptions интерфейс

Объект Map3DElementOptions, используемый для определения свойств, которые можно задать для Map3DElement.
bounds optional
Посмотрите Map3DElement.bounds.
center optional
Посмотрите Map3DElement.center.
defaultUIDisabled optional
Тип:  boolean optional
Посмотрите Map3DElement.defaultUIDisabled.
defaultUIHidden optional
Тип:  boolean optional
Посмотрите Map3DElement.defaultUIHidden.
description optional
Тип:  string optional
Посмотрите Map3DElement.description.
gestureHandling optional
Тип:  GestureHandling optional
Посмотрите Map3DElement.gestureHandling.
heading optional
Тип:  number optional
Посмотрите Map3DElement.heading.
internalUsageAttributionIds optional
Тип:  Iterable<string> optional
Посмотрите Map3DElement.internalUsageAttributionIds.
language optional
Тип:  string optional
Посмотрите Map3DElement.language.
mapId optional
Тип:  string optional
Посмотрите Map3DElement.mapId.
maxAltitude optional
Тип:  number optional
Посмотрите Map3DElement.maxAltitude.
maxHeading optional
Тип:  number optional
Посмотрите Map3DElement.maxHeading.
maxTilt optional
Тип:  number optional
Посмотрите Map3DElement.maxTilt.
minAltitude optional
Тип:  number optional
Посмотрите Map3DElement.minAltitude.
minHeading optional
Тип:  number optional
Посмотрите Map3DElement.minHeading.
minTilt optional
Тип:  number optional
Посмотрите Map3DElement.minTilt.
mode optional
Тип:  MapMode optional
Посмотрите Map3DElement.mode.
range optional
Тип:  number optional
Посмотрите Map3DElement.range.
region optional
Тип:  string optional
Посмотрите Map3DElement.region.
roll optional
Тип:  number optional
Посмотрите Map3DElement.roll.
tilt optional
Тип:  number optional
Посмотрите Map3DElement.tilt.

Константы MapMode

google.maps.maps3d.MapMode константы

Указывает режим, в котором должна отображаться карта.

Чтобы получить доступ, позвоните по номеру const {MapMode} = await google.maps.importLibrary("maps3d").
Подробнее о библиотеках Maps JavaScript API…
HYBRID В этом режиме на спутниковые или фотореалистичные снимки накладывается прозрачный слой с основными улицами.
SATELLITE В этом режиме карты показываются спутниковые или фотореалистичные снимки, если они доступны.

Константы GestureHandling

google.maps.maps3d.GestureHandling константы

Указывает, как должны обрабатываться события жестов на элементе карты.

Чтобы получить доступ, позвоните по номеру const {GestureHandling} = await google.maps.importLibrary("maps3d").
Подробнее о библиотеках Maps JavaScript API…
AUTO В этом случае карта сама выбирает, как обрабатывать жесты – в режиме cooperative или greedy. Это режим работы по умолчанию.

Если карта занимает большую часть родительского элемента прокрутки (обычно это страница, на которой она размещена), так что пользователь не может прокрутить страницу дальше карты, чтобы увидеть другой контент, то карта переходит в режим совместной работы.
COOPERATIVE В этом режиме для прокрутки карты нужно использовать клавиши-модификаторы или жесты двумя пальцами.
GREEDY В этом случае принудительно включается режим greedy, в котором пользователь не может прокручивать страницу, взаимодействуя с элементом карты.

Интерфейс FlyAroundAnimationOptions

google.maps.maps3d.FlyAroundAnimationOptions интерфейс

Параметры настройки для анимации FlyCameraAround.
camera
Тип:  CameraOptions
Центральная точка, на которую должна быть направлена камера во время анимации вращения. Обратите внимание, что ориентация карты будет меняться по мере того, как камера вращается вокруг центральной точки.
durationMillis optional
Тип:  number optional
Продолжительность одного цикла анимации в миллисекундах.
repeatCount optional
Тип:  number optional
Указывает, сколько раз должна повторяться анимация. Если указать ноль, анимация завершится сразу после начала.
rounds optional
Тип:  number optional
Количество оборотов вокруг центра за указанное время. Этот параметр определяет общую скорость вращения. Если передать отрицательное число, камера будет вращаться против часовой стрелки, а не по часовой стрелке, как по умолчанию.

Интерфейс FlyToAnimationOptions

google.maps.maps3d.FlyToAnimationOptions интерфейс

Параметры настройки для анимации FlyCameraTo.
endCamera
Тип:  CameraOptions
Место, на которое должна быть направлена камера в конце анимации.
durationMillis optional
Тип:  number optional
Длительность анимации в миллисекундах. Если задать значение 0, камера сразу переместится в конечную точку.

Интерфейс CameraOptions

google.maps.maps3d.CameraOptions интерфейс

Объект CameraOptions, используемый для определения свойств, которые можно задать для объекта камеры. Объектом камеры может быть любой объект, у которого есть положение камеры, например текущее состояние карты или будущее запрошенное состояние анимации.
center optional
Посмотрите Map3DElement.center.
heading optional
Тип:  number optional
Посмотрите Map3DElement.heading.
range optional
Тип:  number optional
Посмотрите Map3DElement.range.
roll optional
Тип:  number optional
Посмотрите Map3DElement.roll.
tilt optional
Тип:  number optional
Посмотрите Map3DElement.tilt.

Класс SteadyChangeEvent

google.maps.maps3d.SteadyChangeEvent класс

Это событие создано на основе мониторинга стабильного состояния Map3DElement. Это событие всплывает по дереву DOM.

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

Чтобы получить доступ, позвоните по номеру const {SteadyChangeEvent} = await google.maps.importLibrary("maps3d").
Подробнее о библиотеках Maps JavaScript API…
isSteady
Тип:  boolean
Указывает, является ли Map3DElement стабильным (т.е. завершен ли рендеринг текущей сцены).

Класс LocationClickEvent

google.maps.maps3d.LocationClickEvent класс

Это событие создается при нажатии на Map3DElement.

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

Чтобы получить доступ, позвоните по номеру const {LocationClickEvent} = await google.maps.importLibrary("maps3d").
Подробнее о библиотеках Maps JavaScript API…
position
Тип:  LatLngAltitude optional
Широта, долгота и высота, на которых находился курсор в момент события. Обратите внимание, что на более грубых уровнях будут возвращаться менее точные данные. Кроме того, если нажать на водную поверхность с более высокой позиции камеры, в качестве значения высоты может быть возвращена высота морского дна. Это событие всплывает по дереву DOM.

Класс PlaceClickEvent

google.maps.maps3d.PlaceClickEvent класс

Это событие создается при нажатии на значок места на Map3DElement. Чтобы всплывающее окно по умолчанию не показывалось, вызовите метод preventDefault() для этого события. Тогда оно не будет обрабатываться Map3DElement.

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

Чтобы получить доступ, позвоните по номеру const {PlaceClickEvent} = await google.maps.importLibrary("maps3d").
Подробнее о библиотеках Maps JavaScript API…
placeId
Тип:  string
Идентификатор места для объекта на карте.
Унаследованные: position
fetchPlace
fetchPlace()
Параметры: нет.
Возвращаемое значение:  Promise<Place>
Получает Place для этого идентификатора места. В полученном объекте Place будет заполнено свойство id. Дополнительные поля можно запросить позже через Place.fetchFields(). При этом действуют стандартные условия включения и оплаты Places API. Если при получении Place произошла ошибка, объект Promise отклоняется.