Класс MarkerElement
google.maps.maps3d.MarkerElement
class
extends HTMLElement
implements MarkerElementOptions
library "maps3d"
Показывает местоположение на 3D-карте. Обратите внимание, что для показа MarkerElement необходимо задать position.
<gmp-marker altitude-mode="value-name" anchor-left="string" anchor-top="string" autofits-camera collision-behavior="value-name" collision-priority="number" position="lat,lng" title="string"> </gmp-marker>
const {MarkerElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
MarkerElement |
MarkerElement([options])Параметры:
Создает объект MarkerElement с указанными параметрами. |
Свойства | |
|---|---|
altitudeMode
attr: altitude-mode |
По умолчанию:
AltitudeMode.CLAMP_TO_GROUND.Определяет, как интерпретируется высота.
HTML-атрибут: altitude-mode="value-name" |
anchorLeft
attr: anchor-left |
Тип входных данных:
string optionalТип выходных данных: stringПо умолчанию: -50 %.
Значение length-percentage в CSS, которое используется для смещения опорной точки относительно левого верхнего угла маркера. Это полезно, если вы используете визуальный элемент, у которого точка привязки отличается от стандартной точки внизу по центру маркера по умолчанию.
HTML-атрибут: anchor-left="string" |
anchorTop
attr: anchor-top |
Тип входных данных:
string optionalТип выходных данных: stringЗначение по умолчанию: -100 %.
Значение length-percentage в CSS, которое используется для смещения опорной точки относительно левого верхнего угла маркера. Это полезно, если вы используете визуальный элемент, у которого точка привязки отличается от стандартной точки внизу по центру маркера по умолчанию.
HTML-атрибут: anchor-top="string" |
attr: autofits-camera |
Тип:
boolean optionalПо умолчанию:
false.Если он указан, то будет виден в области просмотра карты вместе с другими элементами, для которых включен показ.
HTML-атрибут: autofits-camera |
collisionBehavior
attr: collision-behavior |
По умолчанию:
CollisionBehavior.REQUIRED.Перечисление, определяющее, как должен вести себя MarkerElement при наложении на другой
MarkerElement, Marker3DElement или ярлыки базовой карты.HTML-атрибут: collision-behavior="value-name" |
collisionPriority
attr: collision-priority |
Тип входных данных:
number optionalТип выходных данных: number optionalЧисло, которое используется для определения относительного приоритета маркеров
CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY (включая Marker3DElement). Чем больше значение collisionPriority, тем выше приоритет.HTML-атрибут: collision-priority="number" |
position
attr: position |
Тип входных данных:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalТип выходных данных: LatLngAltitude optionalМестоположение кончика маркера. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно.
HTML-атрибут:
|
title
attr: title |
Тип:
stringтекст, выводимый при наведении курсора на элемент. Если указан текст специальных возможностей (например, для программ чтения с экрана), он будет добавлен в
MarkerElement с указанным значением.HTML-атрибут: title="string" |
игровые автоматы; | |
|---|---|
default |
Любые пользовательские элементы, добавленные непосредственно в MarkerElement, будут размещены в слотах. |
Свойства CSS | |
|---|---|
z-index |
Z-индекс маркера. Подробная информация приведена в документации по z-index. Маркеры с более высоким Z-индексом перекрывают маркеры с меньшим. По умолчанию маркеры отображаются в соответствии с их положением в DOM: маркеры, добавленные в DOM позже, отображаются перед маркерами, добавленными в DOM раньше. |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс MarkerElementOptions
google.maps.maps3d.MarkerElementOptions
интерфейс
Объект MarkerElementOptions, используемый для определения свойств, которые можно задать для MarkerElement.
Свойства | |
|---|---|
altitudeMode
необязательно |
Тип:
AltitudeMode optionalПосмотрите MarkerElement.altitudeMode. |
anchorLeft
необязательно |
Тип:
string optionalПосмотрите MarkerElement.anchorLeft. |
anchorTop
необязательно |
Тип:
string optionalПосмотрите MarkerElement.anchorTop. |
необязательно |
Тип:
boolean optionalПосмотрите . |
collisionBehavior
необязательно |
Тип:
CollisionBehavior optionalПосмотрите MarkerElement.collisionBehavior. |
collisionPriority
необязательно |
Тип:
number optionalПосмотрите MarkerElement.collisionPriority. |
position
необязательно |
Тип:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalПосмотрите MarkerElement.position. |
title
необязательно |
Тип:
string optionalПосмотрите MarkerElement.title. |
Класс MarkerInteractiveElement
google.maps.maps3d.MarkerInteractiveElement
class
extends MarkerElement
implements MarkerInteractiveElementOptions
library "maps3d"
Показывает местоположение на 3D-карте. Обратите внимание, что для показа MarkerInteractiveElement необходимо задать position. В отличие от MarkerElement, MarkerInteractiveElement получает событие gmp-click.
<gmp-marker-interactive gmp-popover-target-element="popover-id"> </gmp-marker-interactive>
const {MarkerInteractiveElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
MarkerInteractiveElement |
MarkerInteractiveElement([options])Параметры:
Создает MarkerInteractiveElement с указанными параметрами. |
Свойства | |
|---|---|
gmpPopoverTargetElement
attr: gmp-popover-target-element |
Если задать этот параметр, всплывающий элемент будет открываться при нажатии на маркер.
HTML-атрибут: gmp-popover-target-element="popover-id" |
Унаследованные:
altitudeMode (атрибут: altitude-mode),
anchorLeft (атрибут: anchor-left),
anchorTop (атрибут: anchor-top),
(атрибут: autofits-camera),
collisionBehavior (атрибут: collision-behavior),
collisionPriority (атрибут: collision-priority),
position (атрибут: position),
title (атрибут: title)
| |
игровые автоматы; | |
|---|---|
Унаследованные:
default
|
Свойства CSS | |
|---|---|
Унаследованные:
z-index
|
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
События | |
|---|---|
gmp-click |
function(clickEvent)Аргументы:
Это событие активируется при нажатии на элемент MarkerInteractiveElement. |
Интерфейс MarkerInteractiveElementOptions
google.maps.maps3d.MarkerInteractiveElementOptions
interface
extends MarkerElementOptions
Объект MarkerInteractiveElementOptions, используемый для определения свойств, которые можно задать для MarkerInteractiveElement.
Свойства | |
|---|---|
gmpPopoverTargetElement
необязательно |
Тип:
PopoverElement optionalПосмотрите MarkerInteractiveElement.gmpPopoverTargetElement. |
Унаследованные:
altitudeMode,
anchorLeft,
anchorTop,
,
collisionBehavior,
collisionPriority,
position,
title.
| |
Класс Marker3DElement
google.maps.maps3d.Marker3DElement
class
extends HTMLElement
implements Marker3DElementOptions
library "maps3d"
Показывает местоположение на 3D-карте. Обратите внимание, что для показа Marker3DElement необходимо задать position.
<gmp-marker-3d altitude-mode="value-name" autofits-camera collision-behavior="value-name" collision-priority="number" draws-when-occluded extruded label="string" position="lat,lng" size-preserved z-index="number"> </gmp-marker-3d>
const {Marker3DElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Marker3DElement |
Marker3DElement([options])Параметры:
Создает объект Marker3DElement с указанными параметрами. |
Свойства | |
|---|---|
altitudeMode
attr: altitude-mode |
По умолчанию:
AltitudeMode.CLAMP_TO_GROUND.Определяет, как интерпретируется высота.
HTML-атрибут: altitude-mode="value-name" |
attr: autofits-camera |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Если он указан, то будет виден в области просмотра карты вместе с другими элементами, для которых включен показ.
HTML-атрибут: autofits-camera |
collisionBehavior
attr: collision-behavior |
По умолчанию:
CollisionBehavior.REQUIRED.Перечисление, указывающее, как должен вести себя элемент Marker3DElement, когда он сталкивается с другим элементом Marker3DElement или с метками базовой карты.
HTML-атрибут: collision-behavior="value-name" |
collisionPriority
attr: collision-priority |
Тип входных данных:
number optionalТип выходных данных: number optionalПриоритет, используемый для обнаружения конфликтов.
HTML-атрибут: collision-priority="number" |
drawsWhenOccluded
attr: draws-when-occluded |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, нужно ли рисовать маркер, если он перекрыт. Маркер может быть скрыт геометрическими объектами карты (например, зданиями).
HTML-атрибут: draws-when-occluded |
extruded
attr: extruded |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, нужно ли соединить маркер с землей. Чтобы вытянуть маркер, для
altitudeMode нужно задать значение RELATIVE_TO_GROUND или ABSOLUTE.HTML-атрибут: extruded |
label
attr: label |
Тип входных данных:
string optionalТип выходных данных: string optionalТекст, который будет показываться рядом с маркером.
HTML-атрибут: label="string" |
position
attr: position |
Тип входных данных:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalТип выходных данных: LatLngAltitude optionalМестоположение кончика маркера. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно.
HTML-атрибут:
|
sizePreserved
attr: size-preserved |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, должен ли маркер сохранять свой размер независимо от расстояния до камеры. По умолчанию размер маркера зависит от расстояния до камеры и угла наклона.
HTML-атрибут: size-preserved |
zIndex
attr: z-index |
Тип входных данных:
number optionalТип выходных данных: number optionalzIndex по сравнению с другими маркерами.
HTML-атрибут: z-index="number" |
игровые автоматы; | |
|---|---|
default |
Любые пользовательские элементы, добавленные непосредственно в Marker3DElement, будут размещены, однако для рисования маркеров будут использоваться только элементы типов HTMLImageElement, SVGElement и PinElement, другие элементы будут игнорироваться. HTMLImageElement и SVGElement должны быть заключены в элемент <template>, прежде чем их можно будет назначить в слот по умолчанию для Marker3DElement. Изображения и SVG-файлы перед отрисовкой в 3D-сцене растрируются, поэтому пользовательский HTML-код, встроенный в SVG, или классы CSS, добавленные к изображениям, не будут применяться и могут не отражаться при показе маркеров на экране. |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс Marker3DElementOptions
google.maps.maps3d.Marker3DElementOptions
интерфейс
Объект Marker3DElementOptions, используемый для определения свойств, которые можно задать для Marker3DElement.
Свойства | |
|---|---|
altitudeMode
необязательно |
Тип:
AltitudeMode optionalПосмотрите Marker3DElement.altitudeMode. |
необязательно |
Тип:
boolean optionalПосмотрите . |
collisionBehavior
необязательно |
Тип:
CollisionBehavior optionalПосмотрите Marker3DElement.collisionBehavior. |
collisionPriority
необязательно |
Тип:
number optionalПосмотрите Marker3DElement.collisionPriority. |
drawsWhenOccluded
необязательно |
Тип:
boolean optionalПосмотрите Marker3DElement.drawsWhenOccluded. |
extruded
необязательно |
Тип:
boolean optionalПосмотрите Marker3DElement.extruded. |
label
необязательно |
Тип:
string optionalПосмотрите Marker3DElement.label. |
position
необязательно |
Тип:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalПосмотрите Marker3DElement.position. |
sizePreserved
необязательно |
Тип:
boolean optionalПосмотрите Marker3DElement.sizePreserved. |
zIndex
необязательно |
Тип:
number optionalПосмотрите Marker3DElement.zIndex. |
Класс Marker3DInteractiveElement
google.maps.maps3d.Marker3DInteractiveElement
class
extends Marker3DElement
implements Marker3DInteractiveElementOptions
library "maps3d"
Показывает местоположение на 3D-карте. Обратите внимание, что для показа Marker3DInteractiveElement необходимо задать position. В отличие от Marker3DElement, Marker3DInteractiveElement получает событие gmp-click.
<gmp-marker-3d-interactive gmp-popover-target-element="popover-id" title="string"> </gmp-marker-3d-interactive>
const {Marker3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Marker3DInteractiveElement |
Marker3DInteractiveElement([options])Параметры:
Создает объект Marker3DInteractiveElement с указанными параметрами. |
Свойства | |
|---|---|
gmpPopoverTargetElement
attr: gmp-popover-target-element |
Если задать этот параметр, всплывающий элемент будет открываться при нажатии на маркер.
HTML-атрибут: gmp-popover-target-element="popover-id" |
title
attr: title |
Тип:
stringтекст, выводимый при наведении курсора на элемент. Если указан текст специальных возможностей (например, для программ чтения с экрана), он будет добавлен в
Marker3DInteractiveElement с указанным значением.HTML-атрибут: title="string" |
Унаследованные:
altitudeMode (атрибут: altitude-mode),
(атрибут: autofits-camera),
collisionBehavior (атрибут: collision-behavior),
collisionPriority (атрибут: collision-priority),
drawsWhenOccluded (атрибут: draws-when-occluded),
extruded (атрибут: extruded),
label (атрибут: label),
position (атрибут: position),
sizePreserved (атрибут: size-preserved),
zIndex (атрибут: z-index)
| |
игровые автоматы; | |
|---|---|
default |
Любые пользовательские элементы, добавленные непосредственно в Marker3DInteractiveElement, будут размещены, однако для рисования маркеров будут использоваться только элементы типа PinElement, другие элементы будут игнорироваться. |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
События | |
|---|---|
gmp-click |
function(clickEvent)Аргументы:
Это событие активируется при нажатии на элемент Marker3DInteractiveElement. |
Интерфейс Marker3DInteractiveElementOptions
google.maps.maps3d.Marker3DInteractiveElementOptions
interface
extends Marker3DElementOptions
Объект Marker3DInteractiveElementOptions, используемый для определения свойств, которые можно задать для Marker3DInteractiveElement.
Свойства | |
|---|---|
gmpPopoverTargetElement
необязательно |
Тип:
PopoverElement optional |
title
необязательно |
Тип:
string optionalПосмотрите Marker3DInteractiveElement.title. |
Наследуется:
altitudeMode,
,
collisionBehavior,
collisionPriority,
drawsWhenOccluded,
extruded,
label,
position,
sizePreserved,
zIndex.
| |
Класс Model3DElement
google.maps.maps3d.Model3DElement
class
extends HTMLElement
implements Model3DElementOptions
library "maps3d"
3D-модель, которая позволяет отрисовывать модели gLTF. Обратите внимание, что для показа Model3DElement необходимо задать position и src.
Должны поддерживаться основные свойства gLTF PBR. Расширения и их свойства в настоящее время не поддерживаются.
<gmp-model-3d altitude-mode="value-name" orientation="heading,tilt,roll" position="lat,lng" scale="number" src="url"> </gmp-model-3d>
const {Model3DElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Model3DElement |
Model3DElement([options])Параметры:
Создает объект Model3DElement с указанными параметрами. |
Свойства | |
|---|---|
altitudeMode
attr: altitude-mode |
По умолчанию:
AltitudeMode.CLAMP_TO_GROUND.Определяет, как интерпретируется высота в позиции.
HTML-атрибут: altitude-mode="value-name" |
orientation
attr: orientation |
Тип входных данных:
Orientation3D|Orientation3DLiteral optionalТип выходных данных: Orientation3D optionalОписывает поворот системы координат 3D-модели для ее размещения на 3D-карте.
Повороты применяются к модели в следующем порядке: крен, наклон, а затем курс. HTML-атрибут: orientation="heading,tilt,roll" |
position
attr: position |
Тип входных данных:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalТип выходных данных: LatLngAltitude optionalЗадает положение
Model3DElement. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно.HTML-атрибут:
|
scale
attr: scale |
По умолчанию:
1.Масштабирует модель по осям X, Y и Z в системе координат модели.
HTML-атрибут:
|
src
attr: src |
URL 3D-модели. В настоящее время поддерживаются только модели формата
.glb. Относительные URL с протоколом HTTP будут преобразованы в абсолютные. Обратите внимание, что если вы размещаете файлы модели .glb на сайте или сервере, отличном от основного приложения, вам необходимо настроить правильные HTTP-заголовки CORS. Это позволит вашему приложению безопасно получать доступ к файлам модели из другого домена.HTML-атрибут: src="url" |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс Model3DElementOptions
google.maps.maps3d.Model3DElementOptions
интерфейс
Объект Model3DElementOptions, используемый для определения свойств, которые можно задать для Model3DElement.
Свойства | |
|---|---|
altitudeMode
необязательно |
Тип:
AltitudeMode optionalПосмотрите Model3DElement.altitudeMode. |
orientation
необязательно |
Тип:
Orientation3D|Orientation3DLiteral optionalПосмотрите Model3DElement.orientation. |
position
необязательно |
Тип:
LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalПосмотрите Model3DElement.position. |
scale
необязательно |
Тип:
number|Vector3D|Vector3DLiteral optionalПосмотрите Model3DElement.scale. |
src
необязательно |
Тип:
string|URL optionalПосмотрите Model3DElement.src. |
Класс Model3DInteractiveElement
google.maps.maps3d.Model3DInteractiveElement
class
extends Model3DElement
implements Model3DInteractiveElementOptions
library "maps3d"
3D-модель, которая позволяет отрисовывать модели gLTF. Обратите внимание, что для показа Model3DElement необходимо задать position и src.
Должны поддерживаться основные свойства gLTF PBR. Расширения и их свойства в настоящее время не поддерживаются.
В отличие от Model3DElement, Model3DInteractiveElement получает событие gmp-click.
<gmp-model-3d-interactive></gmp-model-3d-interactive>
const {Model3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Model3DInteractiveElement |
Model3DInteractiveElement([options])Параметры:
Создает Model3DInteractiveElement с указанными параметрами. |
Свойства | |
|---|---|
Унаследованные:
altitudeMode (атрибут: altitude-mode),
orientation (атрибут: orientation),
position (атрибут: position),
scale (атрибут: scale),
src (атрибут: src)
|
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
События | |
|---|---|
gmp-click |
function(clickEvent)Аргументы:
Это событие активируется при нажатии на элемент Model3DInteractiveElement. |
Интерфейс Model3DInteractiveElementOptions
google.maps.maps3d.Model3DInteractiveElementOptions
interface
extends Model3DElementOptions
Объект Model3DInteractiveElementOptions, используемый для определения свойств, которые можно задать для Model3DInteractiveElement.
Свойства | |
|---|---|
Унаследованные:
altitudeMode,
orientation,
position,
scale,
src.
|
Класс Polyline3DElement
google.maps.maps3d.Polyline3DElement
class
extends HTMLElement
implements Polyline3DElementOptions
library "maps3d"
Трехмерная ломаная линия – это линейное наложение соединенных отрезков прямой на 3D-карту.
<gmp-polyline-3d altitude-mode="value-name" autofits-camera draws-occluded-segments extruded geodesic outer-color="string" outer-width="number" path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." stroke-color="string" stroke-width="number" z-index="number"> </gmp-polyline-3d>
const {Polyline3DElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Polyline3DElement |
Polyline3DElement([options])Параметры:
Создает объект Polyline3DElement с указанными параметрами. |
Свойства | |
|---|---|
altitudeMode
attr: altitude-mode |
По умолчанию:
AltitudeMode.CLAMP_TO_GROUND.Определяет, как интерпретируются компоненты высоты в координатах.
HTML-атрибут: altitude-mode="value-name" |
attr: autofits-camera |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Если указать ломаную линию, она будет видна в области просмотра карты вместе с другими элементами, для которых включен показ.
HTML-атрибут: autofits-camera |
drawsOccludedSegments
attr: draws-occluded-segments |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, рисуются ли части ломаной линии, которые могут быть скрыты. Ломаные линии могут быть скрыты геометрическими объектами на карте (например, зданиями).
HTML-атрибут: draws-occluded-segments |
extruded
attr: extruded |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, нужно ли соединять ломаную линию с землей. Чтобы вытянуть ломаную линию, для свойства
altitudeMode нужно задать значение RELATIVE_TO_GROUND или ABSOLUTE.HTML-атрибут: extruded |
geodesic
attr: geodesic |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Если задано значение
true, края ломаной линии интерпретируются как геодезические и следуют кривизне Земли. Если задано значение false, края ломаной линии отображаются на экране как прямые линии.HTML-атрибут: geodesic |
outerColor
attr: outer-color |
Тип входных данных:
string optionalТип выходных данных: string optionalВнешний цвет. Поддерживаются все цвета CSS3.
HTML-атрибут: outer-color="string" |
outerWidth
attr: outer-width |
Тип входных данных:
number optionalТип выходных данных: number optionalВнешняя ширина должна быть в диапазоне от
0.0 до 1.0. Это процент от strokeWidth.HTML-атрибут: outer-width="number" |
path
attr: path |
Тип входных данных:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalТип выходных данных: Array<LatLngAltitude> optionalЗаданная последовательность координат полилинии. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно.
HTML-атрибут: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." |
strokeColor
attr: stroke-color |
Тип входных данных:
string optionalТип выходных данных: string optionalЦвет штриха. Поддерживаются все цвета CSS3.
HTML-атрибут: stroke-color="string" |
strokeWidth
attr: stroke-width |
Тип входных данных:
number optionalТип выходных данных: number optionalширина штриха в пикселях.
HTML-атрибут: stroke-width="number" |
zIndex
attr: z-index |
Тип входных данных:
number optionalТип выходных данных: number optionalzIndex по сравнению с другими полилиниями.
HTML-атрибут: z-index="number" |
|
Тип:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalЗаданная последовательность координат полилинии. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно. |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс Polyline3DElementOptions
google.maps.maps3d.Polyline3DElementOptions
интерфейс
Объект Polyline3DElementOptions, используемый для определения свойств, которые можно задать для Polyline3DElement.
Класс Polyline3DInteractiveElement
google.maps.maps3d.Polyline3DInteractiveElement
class
extends Polyline3DElement
implements Polyline3DInteractiveElementOptions
library "maps3d"
Трехмерная ломаная линия – это линейное наложение соединенных отрезков прямой на 3D-карту. В отличие от Polyline3DElement, Polyline3DInteractiveElement получает событие gmp-click.
<gmp-polyline-3d-interactive></gmp-polyline-3d-interactive>
const {Polyline3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Polyline3DInteractiveElement |
Polyline3DInteractiveElement([options])Параметры:
Создает Polyline3DInteractiveElement с указанными параметрами. |
Свойства | |
|---|---|
Унаследованные:
altitudeMode (атрибут: altitude-mode),
(атрибут: autofits-camera),
drawsOccludedSegments (атрибут: draws-occluded-segments),
extruded (атрибут: extruded),
geodesic (атрибут: geodesic),
outerColor (атрибут: outer-color),
outerWidth (атрибут: outer-width),
path (атрибут: path),
strokeColor (атрибут: stroke-color),
strokeWidth (атрибут: stroke-width),
zIndex (атрибут: z-index),
|
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
События | |
|---|---|
gmp-click |
function(clickEvent)Аргументы:
Это событие активируется при нажатии на элемент Polyline3DInteractiveElement. |
Интерфейс Polyline3DInteractiveElementOptions
google.maps.maps3d.Polyline3DInteractiveElementOptions
interface
extends Polyline3DElementOptions
Объект Polyline3DInteractiveElementOptions, используемый для определения свойств, которые можно задать для Polyline3DInteractiveElement.
Свойства | |
|---|---|
Унаследованные:
altitudeMode,
,
coordinates,
drawsOccludedSegments,
extruded,
geodesic,
outerColor,
outerWidth,
path,
strokeColor,
strokeWidth,
zIndex.
|
Класс Polygon3DElement
google.maps.maps3d.Polygon3DElement
class
extends HTMLElement
implements Polygon3DElementOptions
library "maps3d"
Трехмерный многоугольник (как и трехмерная ломаная линия) определяет упорядоченную последовательность соединенных координат. Кроме того, многоугольники образуют замкнутый контур и определяют заполненную область.
<gmp-polygon-3d autofits-camera draws-occluded-segments extruded fill-color="string" geodesic path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." stroke-color="string" stroke-width="number" z-index="number"> </gmp-polygon-3d>
const {Polygon3DElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Polygon3DElement |
Polygon3DElement([options])Параметры:
Создает объект Polygon3DElement с указанными параметрами. |
Свойства | |
|---|---|
altitudeMode |
По умолчанию:
AltitudeMode.CLAMP_TO_GROUND.Определяет, как интерпретируются компоненты высоты в координатах. |
attr: autofits-camera |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Если он указан, то будет показан в области просмотра карты вместе с другими элементами, для которых включено отображение.
HTML-атрибут: autofits-camera |
drawsOccludedSegments
attr: draws-occluded-segments |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, отрисовываются ли части многоугольника, которые могут быть скрыты. Многоугольники могут быть скрыты геометрическими объектами карты (например, зданиями).
HTML-атрибут: draws-occluded-segments |
extruded
attr: extruded |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, нужно ли соединить многоугольник с землей. Чтобы вытянуть многоугольник, для свойства
altitudeMode нужно задать значение RELATIVE_TO_GROUND или ABSOLUTE.HTML-атрибут: extruded |
fillColor
attr: fill-color |
Тип входных данных:
string optionalТип выходных данных: string optionalЦвет заливки. Поддерживаются все цвета CSS3.
HTML-атрибут: fill-color="string" |
geodesic
attr: geodesic |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Если задано значение
true, края многоугольника интерпретируются как геодезические и следуют кривизне Земли. Если задано значение false, края многоугольника отображаются на экране в виде прямых линий.HTML-атрибут: geodesic |
innerPaths |
Тип входных данных:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalТип выходных данных: Array<Array<LatLngAltitude>> optionalУпорядоченная последовательность координат, обозначающих замкнутый контур. В отличие от ломаных линий, многоугольник может состоять из одного или нескольких контуров, которые создают несколько вырезов внутри многоугольника. |
path
attr: path |
Тип входных данных:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalТип выходных данных: Array<LatLngAltitude> optionalУпорядоченная последовательность координат, обозначающих замкнутый контур. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно.
HTML-атрибут: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." |
strokeColor
attr: stroke-color |
Тип входных данных:
string optionalТип выходных данных: string optionalЦвет штриха. Поддерживаются все цвета CSS3.
HTML-атрибут: stroke-color="string" |
strokeWidth
attr: stroke-width |
Тип входных данных:
number optionalТип выходных данных: number optionalширина штриха в пикселях.
HTML-атрибут: stroke-width="number" |
zIndex
attr: z-index |
Тип входных данных:
number optionalТип выходных данных: number optionalzIndex по сравнению с другими полилиниями.
HTML-атрибут: z-index="number" |
|
Тип:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalУпорядоченная последовательность координат, обозначающих замкнутый контур. В некоторых режимах высота игнорируется, поэтому указывать ее необязательно. |
|
Тип:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalУпорядоченная последовательность координат, обозначающих замкнутый контур. В отличие от ломаных линий, многоугольник может состоять из одного или нескольких контуров, которые создают несколько вырезов внутри многоугольника. |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс Polygon3DElementOptions
google.maps.maps3d.Polygon3DElementOptions
интерфейс
Объект Polygon3DElementOptions используется для определения свойств, которые можно задать для Polygon3DElement.
Класс Polygon3DInteractiveElement
google.maps.maps3d.Polygon3DInteractiveElement
class
extends Polygon3DElement
implements Polygon3DInteractiveElementOptions
library "maps3d"
Трехмерный многоугольник (как и трехмерная ломаная линия) определяет упорядоченную последовательность соединенных координат. Кроме того, многоугольники образуют замкнутый контур и определяют заполненную область. В отличие от Polygon3DElement, Polygon3DInteractiveElement получает событие gmp-click.
<gmp-polygon-3d-interactive></gmp-polygon-3d-interactive>
const {Polygon3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
Polygon3DInteractiveElement |
Polygon3DInteractiveElement([options])Параметры:
Создает Polygon3DInteractiveElement с указанными параметрами. |
Свойства | |
|---|---|
Наследуемые:
altitudeMode,
(атрибут: autofits-camera),
drawsOccludedSegments (атрибут: draws-occluded-segments),
extruded (атрибут: extruded),
fillColor (атрибут: fill-color),
geodesic (атрибут: geodesic),
innerPaths,
path (атрибут: path),
strokeColor (атрибут: stroke-color),
strokeWidth (атрибут: stroke-width),
zIndex (атрибут: z-index),
,
|
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
События | |
|---|---|
gmp-click |
function(clickEvent)Аргументы:
Это событие активируется при нажатии на элемент Polygon3DInteractiveElement. |
Интерфейс Polygon3DInteractiveElementOptions
google.maps.maps3d.Polygon3DInteractiveElementOptions
interface
extends Polygon3DElementOptions
Объект Polygon3DInteractiveElementOptions используется для определения свойств, которые можно задать для Polygon3DInteractiveElement.
Свойства | |
|---|---|
Унаследованные:
altitudeMode,
,
drawsOccludedSegments,
extruded,
fillColor,
geodesic,
innerCoordinates,
innerPaths,
outerCoordinates,
path,
strokeColor,
strokeWidth,
zIndex
|
Класс FlattenerElement
google.maps.maps3d.FlattenerElement
class
extends HTMLElement
implements FlattenerElementOptions
library "maps3d"
Элемент выравнивания используется для выравнивания определенной области на карте.
<gmp-flattener path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."> </gmp-flattener>
const {FlattenerElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
FlattenerElement |
FlattenerElement([options])Параметры:
|
Свойства | |
|---|---|
innerPaths |
Тип входных данных:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalТип выходных данных: Array<Array<LatLngAltitude>> optionalУпорядоченная последовательность координат, обозначающих замкнутый контур. Эти контуры определяют исключенные области в основном контуре многоугольника, который является зоной выравнивания. Области внутри innerPath не выравниваются. |
path
attr: path |
Тип входных данных:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalТип выходных данных: Array<LatLngAltitude> optionalУпорядоченная последовательность координат, обозначающих замкнутый контур. Это правило действует в зоне выравнивания.
HTML-атрибут: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..." |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс FlattenerElementOptions
google.maps.maps3d.FlattenerElementOptions
интерфейс
Объект FlattenerElementOptions, используемый для определения свойств, которые можно задать для FlattenerElement.
Свойства | |
|---|---|
innerPaths
необязательно |
Тип:
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optionalПосмотрите FlattenerElement.innerPaths. |
path
необязательно |
Тип:
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optionalПосмотрите FlattenerElement.path. |
Класс PopoverElement
google.maps.maps3d.PopoverElement
class
extends HTMLElement
implements PopoverElementOptions
library "maps3d"
Пользовательский элемент HTML, который отображает всплывающее окно. Оно похоже на всплывающую подсказку и часто связано с маркером.
<gmp-popover auto-pan-disabled light-dismiss-disabled open position-anchor="lat,lng"> </gmp-popover>
const {PopoverElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
PopoverElement |
PopoverElement([options])Параметры:
|
Свойства | |
|---|---|
altitudeMode |
По умолчанию:
AltitudeMode.CLAMP_TO_GROUND.Определяет, как интерпретируется высота. |
autoPanDisabled
attr: auto-pan-disabled |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Если задано значение true, отключает панорамирование карты, чтобы всплывающее окно было полностью видно при открытии.
HTML-атрибут: auto-pan-disabled |
lightDismissDisabled
attr: light-dismiss-disabled |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, должно ли это всплывающее окно быть "легко отклоняемым" или нет. Поведение "light dismiss" похоже на настройку атрибута
popover="auto", который является частью Popover API браузера.HTML-атрибут: light-dismiss-disabled |
open
attr: open |
Тип входных данных:
boolean optionalТип выходных данных: booleanПо умолчанию:
false.Указывает, должно ли быть открыто это всплывающее окно.
HTML-атрибут: open |
positionAnchor
attr: position-anchor |
Тип входных данных:
LatLngLiteral|LatLngAltitudeLiteral|Marker3DInteractiveElement|MarkerInteractiveElement|string optionalТип выходных данных: LatLngAltitude|Marker3DInteractiveElement|MarkerInteractiveElement optionalПозиция, в которой будет показано всплывающее окно. Если всплывающее окно привязано к интерактивному маркеру, будет использоваться позиция маркера.
HTML-атрибут:
|
игровые автоматы; | |
|---|---|
default |
Размещает контент в основной части всплывающего окна. |
header |
Размещает контент в заголовке всплывающего окна. |
Свойства CSS | |
|---|---|
--gmp-popover-max-width |
Максимальная ширина всплывающего окна независимо от ширины контента. |
--gmp-popover-min-width |
Минимальная ширина всплывающего окна независимо от ширины контента. При использовании этого свойства настоятельно рекомендуется задать для него значение, которое меньше ширины карты (в пикселях). |
--gmp-popover-pixel-offset-x |
Смещение по оси X (в пикселях) между кончиком всплывающего окна и точкой на карте, к географическим координатам которой оно привязано. |
--gmp-popover-pixel-offset-y |
Смещение по оси Y (в пикселях) кончика всплывающего окна от точки на карте, к географическим координатам которой привязано всплывающее окно. |
background-color |
Цвет фона всплывающего окна. Подробная информация приведена в документации по background-color. Обратите внимание, что это свойство также влияет на всплывающее окно места по умолчанию. Чтобы не менять стиль всплывающего окна по умолчанию, используйте целевые классы CSS или встроенные стили для настраиваемых всплывающих окон. |
border-radius |
Радиус границы всплывающего окна. Подробная информация приведена в документации по border-radius. Обратите внимание, что это свойство также влияет на всплывающее окно места по умолчанию. Чтобы не менять стиль всплывающего окна по умолчанию, используйте целевые классы CSS или встроенные стили для настраиваемых всплывающих окон. |
box-shadow |
Тень всплывающего окна. Подробная информация приведена в документации по box-shadow. Обратите внимание, что это свойство также влияет на всплывающее окно места по умолчанию. Чтобы не менять стиль всплывающего окна по умолчанию, используйте целевые классы CSS или встроенные стили для настраиваемых всплывающих окон. |
color-scheme |
Указывает, в какой цветовой схеме может отображаться это всплывающее окно. Подробная информация приведена в документации по color-scheme. Если не указано, по умолчанию используются настройки цветовой схемы пользователя. |
padding |
Отступы всплывающего окна. Подробная информация приведена в документации по padding. Обратите внимание, что это свойство также влияет на всплывающее окно места по умолчанию. Чтобы не менять стиль всплывающего окна по умолчанию, используйте целевые классы CSS или встроенные стили для настраиваемых всплывающих окон. |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс PopoverElementOptions
google.maps.maps3d.PopoverElementOptions
интерфейс
Объект PopoverElementOptions, используемый для определения свойств, которые можно задать для PopoverElement.
Свойства | |
|---|---|
altitudeMode
необязательно |
Тип:
AltitudeMode optionalПосмотрите PopoverElement.altitudeMode. |
autoPanDisabled
необязательно |
Тип:
boolean optionalПосмотрите PopoverElement.autoPanDisabled. |
lightDismissDisabled
необязательно |
Тип:
boolean optionalПосмотрите PopoverElement.lightDismissDisabled. |
open
необязательно |
Тип:
boolean optionalПосмотрите PopoverElement.open. |
positionAnchor
необязательно |
Тип:
LatLngLiteral|LatLngAltitudeLiteral|string|Marker3DInteractiveElement|MarkerInteractiveElement optionalПосмотрите PopoverElement.positionAnchor. |
Константы AltitudeMode
google.maps.maps3d.AltitudeMode
Библиотека
констант
"maps3d"
Определяет, как интерпретируются компоненты высоты в координатах.
Эти константы также можно использовать в качестве строк. В TypeScript строковые литералы определяются типом AltitudeModeString.
const {AltitudeMode} = await google.maps.importLibrary("maps3d");
Константы | |
|---|---|
ABSOLUTE |
Позволяет выражать объекты относительно среднего уровня моря. Это также означает, что если уровень детализации рельефа под объектом изменится, его абсолютное положение останется прежним. |
CLAMP_TO_GROUND |
Позволяет выражать объекты, размещенные на земле. Они будут оставаться на уровне земли, повторяя рельеф местности, независимо от указанной высоты. Если объект расположен над крупным водоемом, он будет размещен на уровне моря. |
RELATIVE_TO_GROUND |
Позволяет выражать объекты относительно поверхности земли. Если уровень детализации рельефа изменится, положение объекта относительно земли останется прежним. Если объект находится над водой, высота будет интерпретироваться как значение в метрах над уровнем моря. |
RELATIVE_TO_MESH |
Позволяет выражать объекты относительно самой высокой точки земли, здания или водной поверхности. Если вы находитесь над водой, это будет водная поверхность; если над сушей – поверхность здания (при наличии) или поверхность земли (если зданий нет). |
Класс CirclePathElement
google.maps.maps3d.CirclePathElement
class
extends HTMLElement
implements CirclePathElementOptions
library "maps3d"
Трехмерный круг на трехмерной карте.
<gmp-circle-path center="lat,lng,altitude" radius="number"> </gmp-circle-path>
const {CirclePathElement} = await google.maps.importLibrary("maps3d");
Конструктор | |
|---|---|
CirclePathElement |
CirclePathElement([options])Параметры:
Создает CirclePathElement с указанными параметрами. |
Свойства | |
|---|---|
center
attr: center |
Тип входных данных:
LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral optionalТип выходных данных: LatLngAltitude optionalЦентр круга.
HTML-атрибут: center="lat,lng,altitude" |
radius
attr: radius |
Тип входных данных:
number optionalТип выходных данных: number optionalРадиус круга в метрах.
HTML-атрибут: radius="number" |
Методы | |
|---|---|
Унаследованные:
addEventListener,
removeEventListener
|
Интерфейс CirclePathElementOptions
google.maps.maps3d.CirclePathElementOptions
интерфейс
Объект CirclePathElementOptions, используемый для определения свойств, которые можно задать для CirclePathElement.
Свойства | |
|---|---|
center
необязательно |
Тип:
LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral optionalПосмотрите CirclePathElement.center. |
radius
необязательно |
Тип:
number optionalПосмотрите CirclePathElement.radius. |