3D Maps

Map3DElement class

google.maps.maps3d.Map3DElement class

Map3DElement 是 3D 地圖檢視畫面的 HTML 介面。

自訂元素：
<gmp-map-3d center="lat,lng,altitude" default-labels-disabled default-ui-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
設定後，相機位置會限制在指定的經緯度範圍內。請注意，範圍外的物件仍會算繪。範圍可以同時限制經緯度，也可以只限制緯度或經度。如要使用僅限緯度的界線，請分別使用 -180 和 180 的西經和東經。如要使用僅限經度的界線，請分別使用 90 和 -90 的南北緯度。
center
地圖中心，以 LatLngAltitude 形式提供，其中海拔高度是以高於地面的公尺為單位。請注意，這不一定是攝影機所在位置，因為 range 欄位會影響攝影機與地圖中心的距離。如果未設定，則預設值為 {lat: 0, lng: 0, altitude: 63170000}。63170000 公尺是允許的最大海拔高度 (地球半徑乘以 10)。
HTML 屬性：
  • <gmp-map-3d center="lat,lng,altitude"></gmp-map-3d>
defaultLabelsDisabled
類型：  boolean optional
預設值： false
true：系統不會轉譯預設地圖標籤。
HTML 屬性：
  • <gmp-map-3d default-labels-disabled></gmp-map-3d>
defaultUIDisabled
類型：  boolean optional
預設值： false
如果設為 true，所有預設 UI 按鈕都會停用。不會停用鍵盤和手勢控制功能。
HTML 屬性：
  • <gmp-map-3d default-ui-disabled></gmp-map-3d>
heading
類型：  number optional
地圖的指南針航向 (以度為單位)，正北為零。如果沒有傾斜，任何滾動都會解讀為航向。
HTML 屬性：
  • <gmp-map-3d heading="number"></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>
range
類型：  number optional
攝影機與地圖中心的距離 (以公尺為單位)。
HTML 屬性：
  • <gmp-map-3d range="number"></gmp-map-3d>
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>
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string代表要監聽的事件類型，且區分大小寫。
  • listener：EventListener|EventListenerObject接收通知的物件。這必須是函式或包含 handleEvent 方法的物件
  • options：boolean|AddEventListenerOptions optional請參閱選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定函式，每當指定事件傳送至目標時，系統就會呼叫該函式。請參閱 addEventListener。
flyCameraAround
flyCameraAround(options)
參數： 
傳回值：無
這個方法會讓攝影機在指定時間內繞著指定位置旋轉，並在該時間內旋轉指定次數。

預設為順時針旋轉。如果輪數為負數，攝影機就會改為逆時針旋轉。

由於動畫只能在載入最少量的地圖後啟動，因此這個方法為非同步。動畫開始播放後，這個方法就會傳回。

如果輪數為零，系統不會旋轉，動畫會在開始後立即完成。
flyCameraTo
flyCameraTo(options)
參數： 
傳回值：無
這個方法會將攝影機從目前位置以拋物線移動至指定結束位置，移動時間為指定時長。

由於動畫只能在載入最少量的地圖後啟動，因此這個方法為非同步。動畫開始播放後，這個方法就會傳回。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前透過 addEventListener 註冊的事件監聽器。請參閱「removeEventListener」。
stopCameraAnimation
stopCameraAnimation()
參數：無
傳回值：無
這個方法會停止任何可能正在執行的飛行動畫。攝影機會停留在動畫中途的位置，不會傳送到終點。

這個方法是非同步的，因為動畫只能在載入最少量的地圖後啟動或停止。動畫停止後，這個方法就會傳回。
gmp-animationend
function(animationEndEvent)
引數： 
  • animationEndEvent：Event
飛行動畫結束時，會觸發這個事件。這個事件會透過 DOM 樹狀結構向上傳播。
gmp-centerchange
function(centerChangeEvent)
引數： 
  • centerChangeEvent：Event
當地圖 3D 元素的中心屬性變更時，就會觸發這個事件。
gmp-click
function(clickEvent)
引數： 
點選 Map3DElement 元素時，系統會觸發此事件。
gmp-headingchange
function(headingChangeEvent)
引數： 
  • headingChangeEvent：Event
當地圖 3D 元素的 heading 屬性變更時，就會觸發這個事件。
gmp-rangechange
function(rangeChangeEvent)
引數： 
  • rangeChangeEvent：Event
當 Map3DElement 的範圍屬性變更時，就會觸發這個事件。
gmp-rollchange
function(rollChangeEvent)
引數： 
  • rollChangeEvent：Event
當 Map3DElement 的捲動屬性變更時，就會觸發這個事件。
gmp-steadychange
function(steadyChangeEvent)
引數： 
Map3DElement 的穩定狀態變更時，就會觸發這個事件。
gmp-tiltchange
function(tiltChangeEvent)
引數： 
  • tiltChangeEvent：Event
Map3DElement 的傾斜屬性變更時，就會觸發這個事件。

Map3DElementOptions interface

google.maps.maps3d.Map3DElementOptions 介面

Map3DElementOptions 物件，用於定義可在 Map3DElement 上設定的屬性。
bounds optional
類型：  LatLngBounds|LatLngBoundsLiteral optional
詳情請參閱《Map3DElement.bounds》。
center optional
詳情請參閱《Map3DElement.center》。
defaultLabelsDisabled optional
類型：  boolean optional
詳情請參閱《Map3DElement.defaultLabelsDisabled》。
defaultUIDisabled optional
類型：  boolean optional
詳情請參閱《Map3DElement.defaultUIDisabled》。
heading optional
類型：  number optional
詳情請參閱《Map3DElement.heading》。
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》。
range optional
類型：  number optional
詳情請參閱《Map3DElement.range》。
roll optional
類型：  number optional
詳情請參閱《Map3DElement.roll》。
tilt optional
類型：  number optional
詳情請參閱《Map3DElement.tilt》。

FlyAroundAnimationOptions 介面

google.maps.maps3d.FlyAroundAnimationOptions 介面

FlyCameraAround 動畫的自訂選項。
camera
類型：  CameraOptions
環繞動畫期間，攝影機應對準的中心點。請注意，地圖方向會隨著攝影機繞著中心點旋轉而改變。
durationMillis optional
類型：  number optional
動畫時間長度 (以毫秒為單位)。這是動畫的總時間長度，而非單一旋轉的長度。
rounds optional
類型：  number optional
在指定時間內繞著中心旋轉的圈數。這項操作可控制整體旋轉速度。將負數傳遞至 rounds 會導致攝影機逆時針旋轉，而非預設的順時針方向。

FlyToAnimationOptions interface

google.maps.maps3d.FlyToAnimationOptions 介面

FlyCameraTo 動畫的自訂選項。
endCamera
類型：  CameraOptions
動畫結束時攝影機應指向的位置。
durationMillis optional
類型：  number optional
動畫時間長度 (以毫秒為單位)。如果時間長度為 0，攝影機就會直接傳送到最終位置。

CameraOptions interface

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 class

google.maps.maps3d.SteadyChangeEvent class

這項事件是透過監控 Map3DElement 的穩定狀態而建立。這個事件會透過 DOM 樹狀結構向上傳播。

這個類別會擴充 Event。

撥打 const {SteadyChangeEvent} = await google.maps.importLibrary("maps3d") 即可存取。
請參閱「Maps JavaScript API 中的程式庫」。
isSteady
類型：  boolean
指出 Map3DElement 是否穩定 (即目前場景的所有算繪作業都已完成)。

LocationClickEvent class

google.maps.maps3d.LocationClickEvent class

這個事件是透過點選 Map3DElement 建立。

這個類別會擴充 Event。

撥打 const {LocationClickEvent} = await google.maps.importLibrary("maps3d") 即可存取。
請參閱「Maps JavaScript API 中的程式庫」。
position
類型：  LatLngAltitude optional
事件發生時游標下方的緯度/經度/海拔高度。請注意，如果使用較粗略的層級，系統會傳回精確度較低的資料。此外，從較高的相機位置點選水面時，系統可能會傳回海床高度做為海拔高度值。這個事件會透過 DOM 樹狀結構向上傳播。

PlaceClickEvent class

google.maps.maps3d.PlaceClickEvent class

這個事件是透過點選 Map3DElement 建立。

這個類別會擴充 LocationClickEvent。

撥打 const {PlaceClickEvent} = await google.maps.importLibrary("maps3d") 即可存取。
請參閱「Maps JavaScript API 中的程式庫」。
placeId
類型：  string
地圖功能的 Place ID。
繼承： position
fetchPlace
fetchPlace()
參數：無
傳回值：  Promise<Place>
擷取這個地點 ID 的 Place。在產生的 Place 物件中，系統會填入 ID 屬性。後續可透過 Place.fetchFields() 要求其他欄位，但須啟用 Places API 並支付相關費用。如果擷取 Place 時發生錯誤，系統會拒絕 Promise。

Marker3DElement class

google.maps.maps3d.Marker3DElement class

在 3D 地圖上顯示位置。請注意，必須設定 position，Marker3DElement 才會顯示。

自訂元素：
<gmp-marker-3d altitude-mode="absolute" collision-behavior="required" draws-when-occluded extruded label="string" 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
預設值： AltitudeMode.CLAMP_TO_GROUND
指定如何解讀位置的海拔高度元件。
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
預設值： CollisionBehavior.REQUIRED
列舉，指定 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
標記尖端的位置。在特定模式下，系統會忽略海拔高度，因此這是選填欄位。
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 的任何自訂元素都會成為 slot，但只有 HTMLImageElement、SVGElement 和 PinElement 類型的元素會用於繪製標記，其他元素則會遭到忽略。
、HTMLImageElement 和 SVGElement 必須先包裝在 <template> 元素中，才能指派給 Marker3DElement 的預設插槽。

目前系統會先將圖片和 SVG 光柵化，再於 3D 場景中算繪，因此嵌入 SVG 或新增至圖片的 CSS 類別中的自訂 HTML 不會套用，且標記顯示在畫面上時可能不會反映。
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string代表要監聽的事件類型，且區分大小寫。
  • listener：EventListener|EventListenerObject接收通知的物件。這必須是函式或包含 handleEvent 方法的物件
  • options：boolean|AddEventListenerOptions optional請參閱選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定函式，每當指定事件傳送至目標時，系統就會呼叫該函式。請參閱 addEventListener。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前透過 addEventListener 註冊的事件監聽器。請參閱「removeEventListener」。

Marker3DElementOptions interface

google.maps.maps3d.Marker3DElementOptions 介面

Marker3DElementOptions 物件，用於定義可在 Marker3DElement 上設定的屬性。
altitudeMode optional
類型：  AltitudeMode optional
詳情請參閱《Marker3DElement.altitudeMode》。
collisionBehavior optional
類型：  CollisionBehavior optional
詳情請參閱《Marker3DElement.collisionBehavior》。
drawsWhenOccluded optional
類型：  boolean optional
詳情請參閱《Marker3DElement.drawsWhenOccluded》。
extruded optional
類型：  boolean optional
詳情請參閱《Marker3DElement.extruded》。
label optional
類型：  string optional
詳情請參閱《Marker3DElement.label》。
position optional
詳情請參閱《Marker3DElement.position》。
sizePreserved optional
類型：  boolean optional
詳情請參閱《Marker3DElement.sizePreserved》。
zIndex optional
類型：  number optional
詳情請參閱《Marker3DElement.zIndex》。

Marker3DInteractiveElement class

google.maps.maps3d.Marker3DInteractiveElement class

在 3D 地圖上顯示位置。請注意，必須設定 position，Marker3DInteractiveElement 才會顯示。與 Marker3DElement 不同，Marker3DInteractiveElement 會收到 gmp-click 事件。

自訂元素：
<gmp-marker-3d-interactive></gmp-marker-3d-interactive>

這個類別會擴充 Marker3DElement。

這個類別會實作 Marker3DInteractiveElementOptions。

撥打 const {Marker3DInteractiveElement} = await google.maps.importLibrary("maps3d") 即可存取。
請參閱「Maps JavaScript API 中的程式庫」。
Marker3DInteractiveElement
Marker3DInteractiveElement([options])
參數： 
使用指定的選項建立 Marker3DInteractiveElement。
已繼承： 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。

已繼承： altitudeMode、 collisionBehavior、 drawsWhenOccluded、 extruded、 label、 position、 sizePreserved、 zIndex

Model3DElement 類別

google.maps.maps3d.Model3DElement class

可算繪 gLTF 模型的 3D 模型。請注意，必須設定 position 和 src，Model3DElement 才會顯示。

應支援 gLTF PBR 的核心屬性。目前不支援擴充功能或擴充功能屬性。

自訂元素：
<gmp-model-3d altitude-mode="absolute" src="src"></gmp-model-3d>

這個類別會擴充 HTMLElement。

這個類別會實作 Model3DElementOptions。

撥打 const {Model3DElement} = await google.maps.importLibrary("maps3d") 即可存取。
請參閱「Maps JavaScript API 中的程式庫」。
Model3DElement
Model3DElement([options])
參數： 
使用指定的選項建立 Model3DElement。
altitudeMode
類型：  AltitudeMode optional
預設值： AltitudeMode.CLAMP_TO_GROUND
指定如何解讀位置資訊中的海拔高度。
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
類型：  Orientation3D|Orientation3DLiteral optional
說明如何旋轉 3D 模型的座標系統，以便將模型放置在 3D 地圖上。

系統會依序對模型套用以下旋轉角度：側滾、傾斜和航向。
position
設定 Model3DElement 的位置。在特定模式下，系統會忽略海拔高度，因此這是選填欄位。
scale
類型：  number|Vector3D|Vector3DLiteral optional
預設值： 1
在模型座標空間中，沿著 x、y 和 z 軸縮放模型。
src
類型：  string|URL optional
指定 3D 模型的網址。目前僅支援 .glb 格式的模型。

系統會將所有相對 HTTP 網址解析為對應的絕對網址。

請注意，如果您的.glb模型檔案託管在與主要應用程式不同的網站或伺服器上，請務必設定正確的 CORS HTTP 標頭。這樣一來，您的應用程式就能安全地存取其他網域的模型檔案。
HTML 屬性：
  • <gmp-model-3d src="src"></gmp-model-3d>
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string代表要監聽的事件類型，且區分大小寫。
  • listener：EventListener|EventListenerObject接收通知的物件。這必須是函式或包含 handleEvent 方法的物件
  • options：boolean|AddEventListenerOptions optional請參閱選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定函式，每當指定事件傳送至目標時，系統就會呼叫該函式。請參閱 addEventListener。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前透過 addEventListener 註冊的事件監聽器。請參閱「removeEventListener」。

Model3DElementOptions 介面

google.maps.maps3d.Model3DElementOptions 介面

Model3DElementOptions 物件，用於定義可在 Model3DElement 上設定的屬性。
altitudeMode optional
類型：  AltitudeMode optional
詳情請參閱《Model3DElement.altitudeMode》。
orientation optional
類型：  Orientation3D|Orientation3DLiteral optional
詳情請參閱《Model3DElement.orientation》。
position optional
詳情請參閱《Model3DElement.position》。
scale optional
類型：  number|Vector3D|Vector3DLiteral optional
詳情請參閱《Model3DElement.scale》。
src optional
類型：  string|URL optional
詳情請參閱《Model3DElement.src》。

Polyline3DElement class

google.maps.maps3d.Polyline3DElement class

3D 折線是 3D 地圖上連接線段的線性疊加層。

自訂元素：
<gmp-polyline-3d altitude-mode="absolute" draws-occluded-segments extruded geodesic outer-color="string" outer-width="number" 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
預設值： AltitudeMode.ABSOLUTE
指定如何解讀座標中的海拔高度元件。
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>
coordinates
折線座標的排列順序。在特定模式下，系統會忽略海拔高度，因此這是選填欄位。
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>
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>
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string代表要監聽的事件類型，且區分大小寫。
  • listener：EventListener|EventListenerObject接收通知的物件。這必須是函式或包含 handleEvent 方法的物件
  • options：boolean|AddEventListenerOptions optional請參閱選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定函式，每當指定事件傳送至目標時，系統就會呼叫該函式。請參閱 addEventListener。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前透過 addEventListener 註冊的事件監聽器。請參閱「removeEventListener」。

Polyline3DElementOptions 介面

google.maps.maps3d.Polyline3DElementOptions 介面

Polyline3DElementOptions 物件，用於定義可在 Polyline3DElement 上設定的屬性。
altitudeMode optional
類型：  AltitudeMode optional
詳情請參閱《Polyline3DElement.altitudeMode》。
coordinates optional
詳情請參閱《Polyline3DElement.coordinates》。
drawsOccludedSegments optional
類型：  boolean optional
詳情請參閱《Polyline3DElement.drawsOccludedSegments》。
extruded optional
類型：  boolean optional
詳情請參閱《Polyline3DElement.extruded》。
geodesic optional
類型：  boolean optional
詳情請參閱《Polyline3DElement.geodesic》。
outerColor optional
類型：  string optional
詳情請參閱《Polyline3DElement.outerColor》。
outerWidth optional
類型：  number optional
詳情請參閱《Polyline3DElement.outerWidth》。
strokeColor optional
類型：  string optional
詳情請參閱《Polyline3DElement.strokeColor》。
strokeWidth optional
類型：  number optional
詳情請參閱《Polyline3DElement.strokeWidth》。
zIndex optional
類型：  number optional
詳情請參閱《Polyline3DElement.zIndex》。

Polygon3DElement class

google.maps.maps3d.Polygon3DElement class

3D 多邊形 (如 3D 折線) 會定義一系列依序排列的連續座標。此外，多邊形會形成封閉迴圈，並定義填滿的區域。

自訂元素：
<gmp-polygon-3d altitude-mode="absolute" draws-occluded-segments extruded fill-color="string" geodesic 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
預設值： AltitudeMode.ABSOLUTE
指定如何解讀座標中的海拔高度元件。
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>
innerCoordinates
指定閉合迴圈的座標順序。與折線不同，多邊形可能由一或多個路徑組成，在多邊形內建立多個剪裁區域。
outerCoordinates
指定閉合迴圈的座標順序。在特定模式下，系統會忽略海拔高度，因此這是選填欄位。
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>
BetaaddEventListener
addEventListener(type, listener[, options])
參數： 
  • type：string代表要監聽的事件類型，且區分大小寫。
  • listener：EventListener|EventListenerObject接收通知的物件。這必須是函式或包含 handleEvent 方法的物件
  • options：boolean|AddEventListenerOptions optional請參閱選項。自訂事件僅支援 capture 和 passive。
傳回值：  void
設定函式，每當指定事件傳送至目標時，系統就會呼叫該函式。請參閱 addEventListener。
BetaremoveEventListener
removeEventListener(type, listener[, options])
參數： 
傳回值：  void
從目標中移除先前透過 addEventListener 註冊的事件監聽器。請參閱「removeEventListener」。

Polygon3DElementOptions 介面

google.maps.maps3d.Polygon3DElementOptions 介面

Polygon3DElementOptions 物件，用於定義可在 Polygon3DElement 上設定的屬性。
altitudeMode optional
類型：  AltitudeMode optional
詳情請參閱《Polygon3DElement.altitudeMode》。
drawsOccludedSegments optional
類型：  boolean optional
詳情請參閱《Polygon3DElement.drawsOccludedSegments》。
extruded optional
類型：  boolean optional
詳情請參閱《Polygon3DElement.extruded》。
fillColor optional
類型：  string optional
詳情請參閱《Polygon3DElement.fillColor》。
geodesic optional
類型：  boolean optional
詳情請參閱《Polygon3DElement.geodesic》。
innerCoordinates optional
詳情請參閱《Polygon3DElement.innerCoordinates》。
outerCoordinates optional
詳情請參閱《Polygon3DElement.outerCoordinates》。
strokeColor optional
類型：  string optional
詳情請參閱《Polygon3DElement.strokeColor》。
strokeWidth optional
類型：  number optional
詳情請參閱《Polygon3DElement.strokeWidth》。
zIndex optional
類型：  number optional
詳情請參閱《Polygon3DElement.zIndex》。

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 可表示相對於地面、建築物和水面最高點的物件。如果位於水面上，則為水面；如果位於地形上，則為建築物表面 (如有) 或地面 (如無建築物)。