Map3DElement 类
google.maps.maps3d.Map3DElement 类
Map3DElement 是 3D 地图视图的 HTML 接口。
自定义元素：
<gmp-map-3d center="lat,lng,altitude" default-labels-disabled heading="number" max-altitude="number" max-heading="number" max-tilt="number" min-altitude="number" min-heading="number" min-tilt="number" range="number" roll="number" tilt="number"></gmp-map-3d>
此类扩展了 HTMLElement。
此类实现了 Map3DElementOptions。
通过调用 const {Map3DElement} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
构造函数 | |
|---|---|
Map3DElement |
Map3DElement([options])参数：
|
属性 | |
|---|---|
bounds |
类型：
LatLngBounds|LatLngBoundsLiteral optional设置后，会将相机的位置限制在指定的 lat/lng 边界内。请注意，边界之外的对象仍会呈现。边界可以同时限制经度和纬度，也可以仅限制纬度或经度。对于仅限纬度的边界，请分别使用 -180 和 180 的西经和东经。对于仅包含经度的边界，请分别使用 90 和 -90 的北纬和南纬。 |
center |
类型：
LatLngAltitude|LatLngAltitudeLiteral optional地图中心，以 LatLngAltitude 的形式给出，其中海拔高度以米为单位。请注意，这不一定是相机所在的位置，因为
range 字段会影响相机与地图中心的距离。如果未设置，则默认为 {lat: 0, lng: 0, altitude: 63170000}。63170000 米是允许的最大海拔高度（地球半径乘以 10）。HTML 属性：
|
defaultLabelsDisabled |
类型：
boolean optional默认值：
false如果设置为
true，则不会渲染默认地图标签。HTML 属性：
|
heading |
类型：
number optional地图的罗盘航向角（以度为单位），其中正北为 0。当没有倾斜时，任何滚动都会被解读为航向。
HTML 属性：
|
maxAltitude |
类型：
number optional地图上显示的海拔高度上限。有效值介于
0 和 63170000 米之间（地球半径乘以 10）。HTML 属性：
|
maxHeading |
类型：
number optional地图的航向（旋转）最大角度。有效值应介于
0 到 360 度之间。minHeading 和 maxHeading 表示允许使用标题手势的间隔（小于等于 360 度）。minHeading = 180 和 maxHeading = 90 将允许在 [0, 90] 中使用标题，并在 [180, 360] 中使用标题。minHeading = 90 和 maxHeading = 180 将允许在 [90, 180] 中使用标题。HTML 属性：
|
maxTilt |
类型：
number optional地图的最大入射角。有效值应介于
0 和 90 度之间。HTML 属性：
|
minAltitude |
类型：
number optional地图上显示的海拔高度下限。有效值介于
0 和 63170000 米之间（地球半径乘以 10）。HTML 属性：
|
minHeading |
类型：
number optional地图航向（旋转）的最小角度。有效值应介于
0 到 360 度之间。minHeading 和 maxHeading 表示允许使用标题手势的间隔（小于等于 360 度）。minHeading = 180 和 maxHeading = 90 将允许在 [0, 90] 中使用标题，并在 [180, 360] 中使用标题。minHeading = 90 和 maxHeading = 180 将允许在 [90, 180] 中使用标题。HTML 属性：
|
minTilt |
类型：
number optional地图的最小入射角。有效值应介于
0 和 90 度之间。HTML 属性：
|
range |
类型：
number optional摄像头到地图中心的距离（以米为单位）。
HTML 属性：
|
roll |
类型：
number optional相机绕视图矢量旋转的滚动角度（以度为单位）。为了解决模糊性问题，当没有倾斜度时，任何滚动都会被解读为航向。
HTML 属性：
|
tilt |
类型：
number optional相机视图矢量的倾斜度（以度为单位）。直接向下看地球的视图矢量的倾斜度为 0 度。指向地球以外的视图矢量的倾斜度为
180 度。HTML 属性：
|
方法 | |
|---|---|
|
addEventListener(type, listener[, options])参数：
返回值：
void设置一个函数，以便在有指定事件传送到目标时调用该函数。请参阅 addEventListener |
|
removeEventListener(type, listener[, options])参数：
返回值：
void从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener |
事件 | |
|---|---|
gmp-centerchange |
function(centerChangeEvent)参数：
当 Map3DElement 的 center 属性发生变化时，系统会触发此事件。 |
gmp-click |
function(clickEvent)参数：
当用户点击 Map3DElement 元素时，系统会触发此事件。 |
gmp-headingchange |
function(headingChangeEvent)参数：
当 Map3DElement 的 heading 属性发生变化时，系统会触发此事件。 |
gmp-rangechange |
function(rangeChangeEvent)参数：
当 Map3DElement 的 range 属性发生变化时，系统会触发此事件。 |
gmp-rollchange |
function(rollChangeEvent)参数：
当 Map3DElement 的滚动属性发生变化时，系统会触发此事件。 |
gmp-steadychange |
function(steadyChangeEvent)参数：
当 Map3DElement 的稳态发生变化时，系统会触发此事件。 |
gmp-tiltchange |
function(tiltChangeEvent)参数：
当 Map3DElement 的 tilt 属性发生变化时，系统会触发此事件。 |
Map3DElementOptions 接口
google.maps.maps3d.Map3DElementOptions 接口
Map3DElementOptions 对象，用于定义可在 Map3DElement 上设置的属性。
属性 | |
|---|---|
bounds optional |
类型：
LatLngBounds|LatLngBoundsLiteral optional请参阅 Map3DElement.bounds。 |
center optional |
类型：
LatLngAltitude|LatLngAltitudeLiteral optional请参阅 Map3DElement.center。 |
defaultLabelsDisabled optional |
类型：
boolean optional |
heading optional |
类型：
number optional请参阅 Map3DElement.heading。 |
maxAltitude optional |
类型：
number optional |
maxHeading optional |
类型：
number optional |
maxTilt optional |
类型：
number optional请参阅 Map3DElement.maxTilt。 |
minAltitude optional |
类型：
number optional |
minHeading optional |
类型：
number optional |
minTilt optional |
类型：
number optional请参阅 Map3DElement.minTilt。 |
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 是否稳定（即当前场景的所有渲染是否已完成）。 |
ClickEvent 类
google.maps.maps3d.ClickEvent 类
此事件是通过点击 Map3DElement 创建的。
此类扩展了 Event。
通过调用 const {ClickEvent} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
属性 | |
|---|---|
position |
类型：
LatLngAltitude optional事件发生时位于光标下方的纬度/经度/海拔。请注意，在较粗的级别下，返回的数据准确性会降低。此外，如果从更高相机位置点击水面，系统可能会将海底海拔高度作为海拔值返回。此事件会通过 DOM 树向上冒泡。 |
CenterChangeEvent 类
google.maps.maps3d.CenterChangeEvent 类
此事件是根据 Map3DElement 上的监控中心更改创建的。此事件会通过 DOM 树向上冒泡。
此类扩展了 Event。
通过调用 const {CenterChangeEvent} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
HeadingChangeEvent 类
google.maps.maps3d.HeadingChangeEvent 类
此事件是通过监控 Map3DElement 上的标题更改创建的。此事件会通过 DOM 树向上冒泡。
此类扩展了 Event。
通过调用 const {HeadingChangeEvent} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
RangeChangeEvent 类
google.maps.maps3d.RangeChangeEvent 类
此事件是通过监控 Map3DElement 上的范围更改创建的。此事件会通过 DOM 树向上冒泡。
此类扩展了 Event。
通过调用 const {RangeChangeEvent} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
RollChangeEvent 类
google.maps.maps3d.RollChangeEvent 类
此事件是通过监控 Map3DElement 上的滚动更改创建的。此事件会通过 DOM 树向上冒泡。
此类扩展了 Event。
通过调用 const {RollChangeEvent} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
TiltChangeEvent 类
google.maps.maps3d.TiltChangeEvent 类
此事件是通过监控 Map3DElement 上的倾斜度变化创建的。此事件会通过 DOM 树向上冒泡。
此类扩展了 Event。
通过调用 const {TiltChangeEvent} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
Polyline3DElement 类
google.maps.maps3d.Polyline3DElement 类
3D 多段线是 3D 地图上相连线段的线性叠加层。
自定义元素：
<gmp-polyline-3d altitude-mode="absolute" draws-occluded-segments extruded geodesic outer-color="string" outer-opacity="number" outer-width="number" stroke-color="string" stroke-opacity="number" stroke-width="number" z-index="number"></gmp-polyline-3d>
此类扩展了 HTMLElement。
此类实现了 Polyline3DElementOptions。
通过调用 const {Polyline3DElement} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
构造函数 | |
|---|---|
Polyline3DElement |
Polyline3DElement([options])参数：
|
属性 | |
|---|---|
altitudeMode |
类型：
AltitudeMode optional指定如何解读坐标中的海拔组件。
HTML 属性：
|
coordinates |
类型：
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional折线坐标的有序序列。在某些模式下，系统会忽略海拔，因此海拔是可选的。 |
drawsOccludedSegments |
类型：
boolean optional默认值：
false指定是否绘制多段线可能被遮挡的部分。多段线可能会被地图几何图形（例如建筑物）遮挡。
HTML 属性：
|
extruded |
类型：
boolean optional默认值：
false指定是否将多段线连接到地面。如需拉伸多段线，
altitudeMode 必须为 RELATIVE_TO_GROUND 或 ABSOLUTE。HTML 属性：
|
geodesic |
类型：
boolean optional默认值：
false当
true 时，多段线的边会被解读为测地线，并会遵循地球的曲率。当 false 时，多段线的边缘会在屏幕空间中渲染为直线。HTML 属性：
|
outerColor |
类型：
string optional外部颜色。支持所有 CSS3 颜色。
HTML 属性：
|
outerOpacity |
类型：
number optional外部不透明度介于
0.0 和 1.0 之间。HTML 属性：
|
outerWidth |
类型：
number optional外部宽度介于
0.0 和 1.0 之间。这是 strokeWidth 的百分比。HTML 属性：
|
strokeColor |
类型：
string optional笔触颜色。支持所有 CSS3 颜色。
HTML 属性：
|
strokeOpacity |
类型：
number optional描边不透明度介于
0.0 和 1.0 之间。HTML 属性：
|
strokeWidth |
类型：
number optional笔触宽度（以像素为单位）。
HTML 属性：
|
zIndex |
类型：
number optional相对于其他折线的 zIndex。
HTML 属性：
|
方法 | |
|---|---|
|
addEventListener(type, listener[, options])参数：
返回值：
void设置一个函数，以便在有指定事件传送到目标时调用该函数。请参阅 addEventListener |
|
removeEventListener(type, listener[, options])参数：
返回值：
void从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener |
Polyline3DElementOptions 接口
google.maps.maps3d.Polyline3DElementOptions 接口
Polyline3DElementOptions 对象，用于定义可在 Polyline3DElement 上设置的属性。
属性 | |
|---|---|
altitudeMode optional |
类型：
AltitudeMode optional |
coordinates optional |
类型：
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional |
drawsOccludedSegments optional |
类型：
boolean optional默认值：
false |
extruded optional |
类型：
boolean optional默认值：
false |
geodesic optional |
类型：
boolean optional默认值：
false |
outerColor optional |
类型：
string optional |
outerOpacity optional |
类型：
number optional |
outerWidth optional |
类型：
number optional |
strokeColor optional |
类型：
string optional |
strokeOpacity optional |
类型：
number optional |
strokeWidth optional |
类型：
number optional |
zIndex optional |
类型：
number optional |
Polygon3DElement 类
google.maps.maps3d.Polygon3DElement 类
3D 多边形（如 3D 多段线）定义了一系列有序排列的连接坐标。此外，多边形会形成闭合环路并定义填充区域。
自定义元素：
<gmp-polygon-3d altitude-mode="absolute" draws-occluded-segments extruded fill-color="string" fill-opacity="number" geodesic stroke-color="string" stroke-opacity="number" stroke-width="number" z-index="number"></gmp-polygon-3d>
此类扩展了 HTMLElement。
此类实现了 Polygon3DElementOptions。
通过调用 const {Polygon3DElement} = await google.maps.importLibrary("maps3d") 进行访问。请参阅 Maps JavaScript API 中的库。
构造函数 | |
|---|---|
Polygon3DElement |
Polygon3DElement([options])参数：
|
属性 | |
|---|---|
altitudeMode |
类型：
AltitudeMode optional指定如何解读坐标中的海拔组件。
HTML 属性：
|
drawsOccludedSegments |
类型：
boolean optional默认值：
false指定是否绘制多边形可能被遮挡的部分。多边形可能会被地图几何图形（例如建筑物）遮挡。
HTML 属性：
|
extruded |
类型：
boolean optional默认值：
false指定是否将多边形连接到地面。如需拉伸多边形，
altitudeMode 必须为 RELATIVE_TO_GROUND 或 ABSOLUTE。HTML 属性：
|
fillColor |
类型：
string optional填充色。支持所有 CSS3 颜色。
HTML 属性：
|
fillOpacity |
类型：
number optional填充透明度，范围为 0.0 到 1.0。
HTML 属性：
|
geodesic |
类型：
boolean optional默认值：
false当
true 时，多边形的边会被解释为测地线，并会遵循地球的曲率。当 false 时，多边形的边缘会在屏幕空间中渲染为直线。HTML 属性：
|
innerCoordinates |
类型：
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral>> optional用于指定闭合环的坐标的有序序列。与多段线不同，多边形可以由一个或多个路径组成，这些路径会在多边形内创建多个切口。 |
outerCoordinates |
类型：
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional用于指定闭合环的坐标的有序序列。在某些模式下，系统会忽略海拔，因此海拔是可选的。 |
strokeColor |
类型：
string optional笔触颜色。支持所有 CSS3 颜色。
HTML 属性：
|
strokeOpacity |
类型：
number optional描边不透明度介于
0.0 和 1.0 之间。HTML 属性：
|
strokeWidth |
类型：
number optional笔触宽度（以像素为单位）。
HTML 属性：
|
zIndex |
类型：
number optional相对于其他折线的 zIndex。
HTML 属性：
|
方法 | |
|---|---|
|
addEventListener(type, listener[, options])参数：
返回值：
void设置一个函数，以便在有指定事件传送到目标时调用该函数。请参阅 addEventListener |
|
removeEventListener(type, listener[, options])参数：
返回值：
void从目标中移除之前使用 addEventListener 注册的事件监听器。请参阅 removeEventListener |
Polygon3DElementOptions 接口
google.maps.maps3d.Polygon3DElementOptions 接口
Polygon3DElementOptions 对象，用于定义可在 Polygon3DElement 上设置的属性。
属性 | |
|---|---|
altitudeMode optional |
类型：
AltitudeMode optional |
drawsOccludedSegments optional |
类型：
boolean optional默认值：
false |
extruded optional |
类型：
boolean optional默认值：
false |
fillColor optional |
类型：
string optional |
fillOpacity optional |
类型：
number optional |
geodesic optional |
类型：
boolean optional默认值：
false |
innerCoordinates optional |
类型：
Iterable<Iterable<LatLngAltitude|LatLngAltitudeLiteral>|Iterable<LatLngLiteral>> optional |
outerCoordinates optional |
类型：
Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional |
strokeColor optional |
类型：
string optional |
strokeOpacity optional |
类型：
number optional |
strokeWidth optional |
类型：
number optional |
zIndex optional |
类型：
number 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 |
允许相对于地面+建筑物+水面的最高点来表示对象。在水上时，此值为水面；在地面上时，此值为建筑物表面（如果有）或地面（如果没有建筑物）。 |