Draw on the map

Marker3DElement 类

google.maps.maps3d.Marker3DElement 类

在 3D 地图上显示一个位置。请注意,必须设置 position 才能显示 Marker3DElement。

自定义元素:
<gmp-marker-3d altitude-mode="absolute" collision-behavior="required" draws-when-occluded extruded label="string" position="lat,lng" size-preserved z-index="number"></gmp-marker-3d>

此类扩展了 HTMLElement。

此类实现 Marker3DElementOptions。

通过拨打 const {Marker3DElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Marker3DElement
Marker3DElement([options])
参数:
使用指定的选项创建 Marker3DElement。
altitudeMode
类型:AltitudeMode optional
指定如何解读位置的高度分量。
HTML 属性:
  • <gmp-marker-3d altitude-mode="absolute"></gmp-marker-3d>
  • <gmp-marker-3d altitude-mode="clamp-to-ground"></gmp-marker-3d>
  • <gmp-marker-3d altitude-mode="relative-to-ground"></gmp-marker-3d>
  • <gmp-marker-3d altitude-mode="relative-to-mesh"></gmp-marker-3d>
collisionBehavior
类型:CollisionBehavior optional
一个枚举,用于指定 Marker3DElement 与另一个 Marker3DElement 或底图标签冲突时的行为方式。
HTML 属性:
  • <gmp-marker-3d collision-behavior="required"></gmp-marker-3d>
  • <gmp-marker-3d collision-behavior="required-and-hides-optional"></gmp-marker-3d>
  • <gmp-marker-3d collision-behavior="optional-and-hides-lower-priority"></gmp-marker-3d>
drawsWhenOccluded
类型:boolean optional
默认值:false
指定此标记在被遮挡时是否应绘制。标记可能会被地图几何图形(例如建筑物)遮挡。
HTML 属性:
  • <gmp-marker-3d draws-when-occluded></gmp-marker-3d>
extruded
类型:boolean optional
默认值:false
指定是否将标记连接到地面。如需拉伸标记,altitudeMode 必须为 RELATIVE_TO_GROUND 或 ABSOLUTE。
HTML 属性:
  • <gmp-marker-3d extruded></gmp-marker-3d>
label
类型:string optional
此标记要显示的文本。
HTML 属性:
  • <gmp-marker-3d label="string"></gmp-marker-3d>
position
标记尖端的位置。在某些模式下,海拔高度会被忽略,因此是可选的。
HTML 属性:
  • <gmp-marker-3d position="lat,lng"></gmp-marker-3d>
  • <gmp-marker-3d position="lat,lng,altitude"></gmp-marker-3d>
sizePreserved
类型:boolean optional
默认值:false
指定此标记是否应保持其大小,而不考虑与摄像头的距离。默认情况下,标记会根据与镜头的距离/倾斜度进行缩放。
HTML 属性:
  • <gmp-marker-3d size-preserved></gmp-marker-3d>
zIndex
类型:number optional
与其他标记相比的 zIndex。
HTML 属性:
  • <gmp-marker-3d z-index="number"></gmp-marker-3d>
default
直接添加到 Marker3DElement 的任何自定义元素都将插入到槽中,但只有 HTMLImageElement、SVGElement 和 PinElement 类型的元素会用于绘制标记,其他元素将被忽略。
HTMLImageElement 和 SVGElement 必须封装在 <template> 元素中,然后才能分配给 Marker3DElement 的默认槽。

图片和 SVG 目前会在 3D 场景中渲染之前进行光栅化,因此嵌入到 SVG 中的自定义 HTML 或添加到图片中的 CSS 类不会应用,并且在屏幕上显示标记时可能不会反映出来。
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。

Marker3DElementOptions 接口

google.maps.maps3d.Marker3DElementOptions 接口

Marker3DElementOptions 对象,用于定义可在 Marker3DElement 上设置的属性。

altitudeMode optional
类型:AltitudeMode optional
collisionBehavior optional
类型:CollisionBehavior optional
drawsWhenOccluded optional
类型:boolean optional
extruded optional
类型:boolean optional
label optional
类型:string optional
position optional
sizePreserved optional
类型:boolean optional
zIndex optional
类型:number optional

Marker3DInteractiveElement 类

google.maps.maps3d.Marker3DInteractiveElement 类

在 3D 地图上显示一个位置。请注意,必须设置 position 才能显示 Marker3DInteractiveElement。与 Marker3DElement 不同,Marker3DInteractiveElement 会收到 gmp-click 事件。

自定义元素:
<gmp-marker-3d-interactive gmp-popover-target="popover-id" title="string"></gmp-marker-3d-interactive>

此类扩展了 Marker3DElement。

此类实现 Marker3DInteractiveElementOptions。

通过拨打 const {Marker3DInteractiveElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Marker3DInteractiveElement
Marker3DInteractiveElement([options])
参数:
使用指定的选项创建 Marker3DInteractiveElement。
gmpPopoverTargetElement
类型:PopoverElement optional
设置后,点击此标记即可打开弹出式窗口元素。
HTML 属性:
  • <gmp-marker-3d-interactive gmp-popover-target="popover-id"></gmp-marker-3d-interactive>
title
类型:string
鼠标悬停文本。如果提供了无障碍文本(例如,供屏幕阅读器使用),系统会使用提供的值将该文本添加到 Marker3DInteractiveElement。
HTML 属性:
  • <gmp-marker-3d-interactive title="string"></gmp-marker-3d-interactive>
继承的方法: altitudeMode、collisionBehavior、drawsWhenOccluded、extruded、label、position、sizePreserved、zIndex
default
直接添加到 Marker3DInteractiveElement 的任何自定义元素都会,但只有 PinElement 类型的元素会用于绘制标记,其他元素将被忽略。
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。
gmp-click
function(clickEvent)
参数: 
当用户点击 Marker3DInteractiveElement 元素时,系统会触发此事件。

Marker3DInteractiveElementOptions 接口

google.maps.maps3d.Marker3DInteractiveElementOptions 接口

Marker3DInteractiveElementOptions 对象,用于定义可在 Marker3DInteractiveElement 上设置的属性。

此接口扩展了 Marker3DElementOptions。

gmpPopoverTargetElement optional
类型:PopoverElement optional
title optional
类型:string optional
继承的方法: altitudeMode、collisionBehavior、drawsWhenOccluded、extruded、label、position、sizePreserved、zIndex

Model3DElement 类

google.maps.maps3d.Model3DElement 类

一种 3D 模型,可用于渲染 gLTF 模型。请注意,必须设置 position 和 src,Model3DElement 才会显示。

应支持 gLTF PBR 的核心属性。目前不支持任何扩展程序或扩展程序属性。

自定义元素:
<gmp-model-3d altitude-mode="absolute" orientation="heading,tilt,roll" position="lat,lng" scale="number" src="url"></gmp-model-3d>

此类扩展了 HTMLElement。

此类实现 Model3DElementOptions。

通过拨打 const {Model3DElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Model3DElement
Model3DElement([options])
参数:
使用指定的选项创建 Model3DElement。
altitudeMode
类型:AltitudeMode optional
指定如何解读位置中的海拔高度。
HTML 属性:
  • <gmp-model-3d altitude-mode="absolute"></gmp-model-3d>
  • <gmp-model-3d altitude-mode="clamp-to-ground"></gmp-model-3d>
  • <gmp-model-3d altitude-mode="relative-to-ground"></gmp-model-3d>
  • <gmp-model-3d altitude-mode="relative-to-mesh"></gmp-model-3d>
orientation
描述 3D 模型坐标系的旋转,以便在 3D 地图上定位模型。

旋转会按以下顺序应用于模型:横滚、俯仰,然后是航向。
HTML 属性:
  • <gmp-model-3d orientation="heading,tilt,roll"></gmp-model-3d>
position
设置 Model3DElement 的位置。在某些模式下,海拔高度会被忽略,因此是可选的。
HTML 属性:
  • <gmp-model-3d position="lat,lng"></gmp-model-3d>
  • <gmp-model-3d position="lat,lng,altitude"></gmp-model-3d>
scale
类型:number|Vector3D|Vector3DLiteral optional
默认值:1
在模型的坐标空间中沿 x、y 和 z 轴缩放模型。
HTML 属性:
  • <gmp-model-3d scale="number"></gmp-model-3d>
  • <gmp-model-3d scale="x,y,z"></gmp-model-3d>
src
类型:string|URL optional
指定 3D 模型的网址。目前仅支持 .glb 格式的模型。

任何相对 HTTP 网址都将解析为对应的绝对网址。

请注意,如果您将 .glb 模型文件托管在与主应用不同的网站或服务器上,请务必设置正确的 CORS HTTP 标头。这样,您的应用就可以安全地访问其他网域中的模型文件。
HTML 属性:
  • <gmp-model-3d src="url"></gmp-model-3d>
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。

Model3DElementOptions 接口

google.maps.maps3d.Model3DElementOptions 接口

Model3DElementOptions 对象,用于定义可在 Model3DElement 上设置的属性。

altitudeMode optional
类型:AltitudeMode optional
orientation optional
position optional
scale optional
类型:number|Vector3D|Vector3DLiteral optional
src optional
类型:string|URL optional
请参阅 Model3DElement.src。

Model3DInteractiveElement 类

google.maps.maps3d.Model3DInteractiveElement 类

一种 3D 模型,可用于渲染 gLTF 模型。请注意,必须设置 position 和 src,Model3DElement 才会显示。

应支持 gLTF PBR 的核心属性。目前不支持任何扩展程序或扩展程序属性。

与 Model3DElement 不同,Model3DInteractiveElement 会收到 gmp-click 事件。

自定义元素:
<gmp-model-3d-interactive></gmp-model-3d-interactive>

此类扩展了 Model3DElement。

此类实现 Model3DInteractiveElementOptions。

通过拨打 const {Model3DInteractiveElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Model3DInteractiveElement
Model3DInteractiveElement([options])
参数:
使用指定的选项创建 Model3DInteractiveElement。
继承的方法: altitudeMode、orientation、position、scale、src
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。
gmp-click
function(clickEvent)
参数: 
当用户点击 Model3DInteractiveElement 元素时,系统会触发此事件。

Model3DInteractiveElementOptions 接口

google.maps.maps3d.Model3DInteractiveElementOptions 接口

Model3DInteractiveElementOptions 对象,用于定义可在 Model3DInteractiveElement 上设置的属性。

此接口扩展了 Model3DElementOptions。

继承的方法: altitudeMode、orientation、position、scale、src

Polyline3DElement 类

google.maps.maps3d.Polyline3DElement 类

3D 多段线是 3D 地图上相连线段的线性叠加层。

自定义元素:
<gmp-polyline-3d altitude-mode="absolute" 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>

此类扩展了 HTMLElement。

此类实现 Polyline3DElementOptions。

通过拨打 const {Polyline3DElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Polyline3DElement
Polyline3DElement([options])
参数:
使用指定的选项创建 Polyline3DElement。
altitudeMode
类型:AltitudeMode optional
指定如何解读坐标中的海拔高度分量。
HTML 属性:
  • <gmp-polyline-3d altitude-mode="absolute"></gmp-polyline-3d>
  • <gmp-polyline-3d altitude-mode="clamp-to-ground"></gmp-polyline-3d>
  • <gmp-polyline-3d altitude-mode="relative-to-ground"></gmp-polyline-3d>
  • <gmp-polyline-3d altitude-mode="relative-to-mesh"></gmp-polyline-3d>
drawsOccludedSegments
类型:boolean optional
默认值:false
指定是否绘制多段线中可能被遮挡的部分。多段线可能会被地图几何图形(例如建筑物)遮挡。
HTML 属性:
  • <gmp-polyline-3d draws-occluded-segments></gmp-polyline-3d>
extruded
类型:boolean optional
默认值:false
指定是否将多段线连接到地面。如需拉伸多段线,altitudeMode 必须为 RELATIVE_TO_GROUND 或 ABSOLUTE。
HTML 属性:
  • <gmp-polyline-3d extruded></gmp-polyline-3d>
geodesic
类型:boolean optional
默认值:false
如果为 true,多段线的边缘会被解读为测地线,并会遵循地球的曲率。如果为 false,则多段线的边缘在屏幕空间中渲染为直线。
HTML 属性:
  • <gmp-polyline-3d geodesic></gmp-polyline-3d>
outerColor
类型:string optional
外圈颜色。支持所有 CSS3 颜色。
HTML 属性:
  • <gmp-polyline-3d outer-color="string"></gmp-polyline-3d>
outerWidth
类型:number optional
外宽介于 0.0 和 1.0 之间。这是 strokeWidth 的百分比。
HTML 属性:
  • <gmp-polyline-3d outer-width="number"></gmp-polyline-3d>
path
折线坐标的有序序列。在某些模式下,海拔高度会被忽略,因此是可选的。
HTML 属性:
  • <gmp-polyline-3d path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."></gmp-polyline-3d>
strokeColor
类型:string optional
笔触颜色。支持所有 CSS3 颜色。
HTML 属性:
  • <gmp-polyline-3d stroke-color="string"></gmp-polyline-3d>
strokeWidth
类型:number optional
笔触宽度(以像素为单位)。
HTML 属性:
  • <gmp-polyline-3d stroke-width="number"></gmp-polyline-3d>
zIndex
类型:number optional
相对于其他折线的 zIndex。
HTML 属性:
  • <gmp-polyline-3d z-index="number"></gmp-polyline-3d>
coordinates
折线坐标的有序序列。在某些模式下,海拔高度会被忽略,因此是可选的。
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。

Polyline3DElementOptions 接口

google.maps.maps3d.Polyline3DElementOptions 接口

Polyline3DElementOptions 对象,用于定义可在 Polyline3DElement 上设置的属性。

altitudeMode optional
类型:AltitudeMode optional
coordinates optional
drawsOccludedSegments optional
类型:boolean optional
extruded optional
类型:boolean optional
geodesic optional
类型:boolean optional
outerColor optional
类型:string optional
outerWidth optional
类型:number optional
strokeColor optional
类型:string optional
strokeWidth optional
类型:number optional
zIndex optional
类型:number optional

Polyline3DInteractiveElement 类

google.maps.maps3d.Polyline3DInteractiveElement 类

3D 多段线是 3D 地图上相连线段的线性叠加层。与 Polyline3DElement 不同,Polyline3DInteractiveElement 会收到 gmp-click 事件。

自定义元素:
<gmp-polyline-3d-interactive></gmp-polyline-3d-interactive>

此类扩展了 Polyline3DElement。

此类实现 Polyline3DInteractiveElementOptions。

通过拨打 const {Polyline3DInteractiveElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Polyline3DInteractiveElement
Polyline3DInteractiveElement([options])
参数:
使用指定的选项创建 Polyline3DInteractiveElement。
继承的方法: altitudeMode、drawsOccludedSegments、extruded、geodesic、outerColor、outerWidth、path、strokeColor、strokeWidth、zIndex、coordinates
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。
gmp-click
function(clickEvent)
参数: 
  • clickEvent:LocationClickEvent 事件对象将包含点击位置的纬度-经度-海拔高度。
当用户点击 Polyline3DInteractiveElement 元素时,系统会触发此事件。

Polyline3DInteractiveElementOptions 接口

google.maps.maps3d.Polyline3DInteractiveElementOptions 接口

Polyline3DInteractiveElementOptions 对象,用于定义可在 Polyline3DInteractiveElement 上设置的属性。

此接口扩展了 Polyline3DElementOptions。

继承的方法: altitudeMode、coordinates、drawsOccludedSegments、extruded、geodesic、outerColor、outerWidth、strokeColor、strokeWidth、zIndex

Polygon3DElement 类

google.maps.maps3d.Polygon3DElement 类

3D 多边形(类似于 3D 多段线)定义了一系列有序排列的相连坐标。此外,多边形会形成闭合环路,并定义一个填充区域。

自定义元素:
<gmp-polygon-3d altitude-mode="absolute" 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>

此类扩展了 HTMLElement。

此类实现 Polygon3DElementOptions。

通过拨打 const {Polygon3DElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Polygon3DElement
Polygon3DElement([options])
参数:
使用指定的选项创建 Polygon3DElement。
altitudeMode
类型:AltitudeMode optional
指定如何解读坐标中的海拔高度分量。
HTML 属性:
  • <gmp-polygon-3d altitude-mode="absolute"></gmp-polygon-3d>
  • <gmp-polygon-3d altitude-mode="clamp-to-ground"></gmp-polygon-3d>
  • <gmp-polygon-3d altitude-mode="relative-to-ground"></gmp-polygon-3d>
  • <gmp-polygon-3d altitude-mode="relative-to-mesh"></gmp-polygon-3d>
drawsOccludedSegments
类型:boolean optional
默认值:false
指定是否绘制多边形中可能被遮挡的部分。多边形可能会被地图几何图形(例如建筑物)遮挡。
HTML 属性:
  • <gmp-polygon-3d draws-occluded-segments></gmp-polygon-3d>
extruded
类型:boolean optional
默认值:false
指定是否将多边形连接到地面。如需拉伸多边形,altitudeMode 必须为 RELATIVE_TO_GROUND 或 ABSOLUTE。
HTML 属性:
  • <gmp-polygon-3d extruded></gmp-polygon-3d>
fillColor
类型:string optional
填充色。支持所有 CSS3 颜色。
HTML 属性:
  • <gmp-polygon-3d fill-color="string"></gmp-polygon-3d>
geodesic
类型:boolean optional
默认值:false
如果为 true,多边形的边缘会被解读为测地线,并会遵循地球的曲率。如果为 false,多边形的边缘在屏幕空间中会渲染为直线。
HTML 属性:
  • <gmp-polygon-3d geodesic></gmp-polygon-3d>
innerPaths
用于指定闭合环的坐标的有序序列。与多段线不同,多边形可能由一个或多个路径组成,这些路径会在多边形内创建多个切口。
path
用于指定闭合环的坐标的有序序列。在某些模式下,海拔高度会被忽略,因此是可选的。
HTML 属性:
  • <gmp-polygon-3d path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."></gmp-polygon-3d>
strokeColor
类型:string optional
笔触颜色。支持所有 CSS3 颜色。
HTML 属性:
  • <gmp-polygon-3d stroke-color="string"></gmp-polygon-3d>
strokeWidth
类型:number optional
笔触宽度(以像素为单位)。
HTML 属性:
  • <gmp-polygon-3d stroke-width="number"></gmp-polygon-3d>
zIndex
类型:number optional
相对于其他折线的 zIndex。
HTML 属性:
  • <gmp-polygon-3d z-index="number"></gmp-polygon-3d>
outerCoordinates
用于指定闭合环的坐标的有序序列。在某些模式下,海拔高度会被忽略,因此是可选的。
innerCoordinates
用于指定闭合环的坐标的有序序列。与多段线不同,多边形可能由一个或多个路径组成,这些路径会在多边形内创建多个切口。
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。

Polygon3DElementOptions 接口

google.maps.maps3d.Polygon3DElementOptions 接口

Polygon3DElementOptions 对象,用于定义可在 Polygon3DElement 上设置的属性。

altitudeMode optional
类型:AltitudeMode optional
drawsOccludedSegments optional
类型:boolean optional
extruded optional
类型:boolean optional
fillColor optional
类型:string optional
geodesic optional
类型:boolean optional
innerCoordinates optional
outerCoordinates optional
strokeColor optional
类型:string optional
strokeWidth optional
类型:number optional
zIndex optional
类型:number optional

Polygon3DInteractiveElement 类

google.maps.maps3d.Polygon3DInteractiveElement 类

3D 多边形(类似于 3D 多段线)定义了一系列有序排列的相连坐标。此外,多边形会形成闭合环路,并定义一个填充区域。与 Polygon3DElement 不同,Polygon3DInteractiveElement 会收到 gmp-click 事件。

自定义元素:
<gmp-polygon-3d-interactive></gmp-polygon-3d-interactive>

此类扩展了 Polygon3DElement。

此类实现 Polygon3DInteractiveElementOptions。

通过拨打 const {Polygon3DInteractiveElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

Polygon3DInteractiveElement
Polygon3DInteractiveElement([options])
参数:
使用指定的选项创建 Polygon3DInteractiveElement。
继承的方法: altitudeMode、drawsOccludedSegments、extruded、fillColor、geodesic、innerPaths、path、strokeColor、strokeWidth、zIndex、outerCoordinates、innerCoordinates
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。
gmp-click
function(clickEvent)
参数: 
  • clickEvent:LocationClickEvent 事件对象将包含点击位置的纬度-经度-海拔高度。
当用户点击 Polygon3DInteractiveElement 元素时,系统会触发此事件。

Polygon3DInteractiveElementOptions 接口

google.maps.maps3d.Polygon3DInteractiveElementOptions 接口

Polygon3DInteractiveElementOptions 对象,用于定义可在 Polygon3DInteractiveElement 上设置的属性。

此接口扩展了 Polygon3DElementOptions。

继承的方法: altitudeMode、drawsOccludedSegments、extruded、fillColor、geodesic、innerCoordinates、outerCoordinates、strokeColor、strokeWidth、zIndex

PopoverElement 类

google.maps.maps3d.PopoverElement 类

用于呈现弹出式窗口的自定义 HTML 元素。它看起来像一个气泡,通常与标记相连。

自定义元素:
<gmp-popover altitude-mode="absolute" auto-pan-disabled light-dismiss-disabled open position-anchor="lat,lng"></gmp-popover>

此类扩展了 HTMLElement。

此类实现 PopoverElementOptions。

通过拨打 const {PopoverElement} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

PopoverElement
PopoverElement([options])
参数:
altitudeMode
类型:AltitudeMode optional
指定如何解读位置的高度分量。
HTML 属性:
  • <gmp-popover altitude-mode="absolute"></gmp-popover>
  • <gmp-popover altitude-mode="clamp-to-ground"></gmp-popover>
  • <gmp-popover altitude-mode="relative-to-ground"></gmp-popover>
  • <gmp-popover altitude-mode="relative-to-mesh"></gmp-popover>
autoPanDisabled
类型:boolean optional
默认值:false
如果设为 true,则会停用平移地图功能,以便在弹出式窗口打开时使其完全可见。
HTML 属性:
  • <gmp-popover auto-pan-disabled></gmp-popover>
lightDismissDisabled
类型:boolean optional
默认值:false
指定是否应“轻度关闭”此弹出式窗口。“轻触关闭”行为类似于设置 popover="auto" 属性,该属性是浏览器 Popover API 的一部分。
HTML 属性:
  • <gmp-popover light-dismiss-disabled></gmp-popover>
open
类型:boolean optional
默认值:false
指定是否应打开此弹出式窗口。
HTML 属性:
  • <gmp-popover open></gmp-popover>
positionAnchor
此弹出式窗口的显示位置。如果弹出式窗口锚定到互动式标记,则系统会改用该标记的位置。
HTML 属性:
  • <gmp-popover position-anchor="lat,lng"></gmp-popover>
  • <gmp-popover position-anchor="lat,lng,altitude"></gmp-popover>
  • <gmp-popover position-anchor="marker-id"></gmp-popover>
default
将插槽内容放置在弹出式窗口的主要部分。
header
将插槽内容放置在弹出式窗口的标题部分。
--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。如需了解详情,请参阅 box-shadow 文档。请注意,默认地点弹出式窗口也会受此属性的影响。在自定义弹出式窗口中使用有针对性的 CSS 类或内嵌样式,以避免为默认地点弹出式窗口设置样式。
color-scheme
指明此弹出式窗口可以采用哪种配色方案进行渲染。如需了解详情,请参阅 color-scheme 文档。如果未指定,则默认为用户的配色方案偏好设置。
padding
弹出式窗口的内边距。如需了解详情,请参阅 padding 文档。请注意,默认地点弹出式窗口也会受此属性的影响。在自定义弹出式窗口中使用有针对性的 CSS 类或内嵌样式,以避免为默认地点弹出式窗口设置样式。
addEventListener
addEventListener(type, listener[, options])
参数:
  • type:string一个区分大小写的字符串,表示要监听的事件类型。
  • listener:EventListener|EventListenerObject 接收通知的对象。这必须是函数或具有 handleEvent 方法的对象
  • options:boolean|AddEventListenerOptions optional请参阅选项。自定义事件仅支持 capture 和 passive。
返回值:void
设置一个函数,每当指定事件传递到目标时,系统都会调用该函数。请参阅 addEventListener。
removeEventListener
removeEventListener(type, listener[, options])
参数:
返回值:void
从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener。

PopoverElementOptions 接口

google.maps.maps3d.PopoverElementOptions 接口

PopoverElementOptions 对象,用于定义可在 PopoverElement 上设置的属性。

altitudeMode optional
类型:AltitudeMode optional
autoPanDisabled optional
类型:boolean optional
lightDismissDisabled optional
类型:boolean optional
open optional
类型:boolean optional
请参阅 PopoverElement.open。
positionAnchor optional

AltitudeMode 常量

google.maps.maps3d.AltitudeMode 常量

指定如何解读坐标中的海拔高度分量。

通过拨打 const {AltitudeMode} = await google.maps.importLibrary("maps3d") 访问。
请参阅 Maps JavaScript API 中的库。

ABSOLUTE 允许相对于平均海平面来表示对象。这也意味着,即使对象下方的地形细节层次发生变化,其绝对位置也会保持不变。
CLAMP_TO_GROUND 允许表达放置在地面上的对象。无论提供的高度是多少,它们都会跟随地形保持在地面。如果对象位于主要水体上方,则会放置在海平面上。
RELATIVE_TO_GROUND 允许相对于地面表达对象。如果地形细节层次发生变化,对象相对于地面的位置将保持不变。在水面上方时,海拔高度将解读为高于海平面的米数。
RELATIVE_TO_MESH 允许相对于地面、建筑物和水面中的最高点来表示对象。如果位于水面上方,则为水平面;如果位于地形上方,则为建筑物表面(如果有)或地面(如果没有建筑物)。