WebGLOverlayView 類別
google.maps.WebGLOverlayView
class
運用 WebGL 疊加層檢視,即可直接存取 Google 地圖平台算繪向量基本地圖的環境。共用算繪環境有許多好處,包括運用 3D 建築物幾何圖形進行深度遮蔽,及同步處理 2D/3D 內容與基本地圖算繪。
您可以透過 WebGL 疊加層檢視,直接使用 WebGL 或常用圖形程式庫 (例如 Three.js 或 deck.gl) 在地圖上新增內容。如要使用疊加層,您可以擴充 google.maps.WebGLOverlayView
,並為下列生命週期鉤子提供實作:WebGLOverlayView.onAdd
、WebGLOverlayView.onContextRestored
、WebGLOverlayView.onDraw
、WebGLOverlayView.onContextLost
和 WebGLOverlayView.onRemove
。
您必須使用有效的 Map
物件呼叫 WebGLOverlayView.setMap
,才能觸發對 onAdd()
方法的呼叫,並觸發 setMap(null)
以便觸發 onRemove()
方法。setMap()
方法可在建構時呼叫,或在移除後應重新顯示疊加層的任何時間點呼叫。每當地圖屬性變更時,系統就會呼叫 onDraw()
方法,這可能會變更元素的位置,例如縮放、中心或地圖類型。WebGLOverlayView 只能新增至具有 MapOptions.mapId
的向量地圖 (包括設為 RenderingType.VECTOR
MapOptions.renderingType
並使用 Map.DEMO_MAP_ID
做為 MapOptions.mapId
的地圖)。
這個類別會擴充 MVCObject
。
請呼叫 const {WebGLOverlayView} = await google.maps.importLibrary("maps")
存取。請參閱「Maps JavaScript API 中的程式庫」。
建構函式 | |
---|---|
WebGLOverlayView |
WebGLOverlayView() 參數:無
建立 WebGLOverlayView 。 |
方法 | |
---|---|
getMap |
getMap() 參數:無
傳回值:
Map|null|undefined |
onAdd |
onAdd() 參數:無
傳回值:無
在繪製疊加層前,請實作此方法擷取或建立中繼資料結構,不需要立即存取 WebGL 算繪環境。您必須實作此方法才能進行轉譯。 |
onContextLost |
onContextLost() 參數:無
傳回值:無
如有任何因素造成算繪環境遺失,系統會呼叫這個方法,其中任何既有的 GL 狀態都不再需要使用,請加以清除。 |
onContextRestored |
onContextRestored(options) 參數:
傳回值:無
算繪環境可供使用時,系統會呼叫此方法。可用來初始化或繫結任何 WebGL 狀態,例如著色器或緩衝區物件。 |
onDraw |
onDraw(options) 參數:
傳回值:無
實作此方法,即可直接在地圖上繪製 WebGL 內容。請注意,如果疊加層需要繪製新的影格,請呼叫 WebGLOverlayView.requestRedraw 。 |
onRemove |
onRemove() 參數:無
傳回值:無
使用 WebGLOverlayView.setMap(null) 從地圖中移除疊加層時,系統會呼叫此方法,請務必移除其中的所有中繼物件。您必須實作此方法才能進行轉譯。 |
onStateUpdate |
onStateUpdate(options) 參數:
傳回值:無
實作這個方法,以便處理算繪動畫影格以外的任何 GL 狀態更新。 |
requestRedraw |
requestRedraw() 參數:無
傳回值:無
觸發地圖重新繪製影格。 |
requestStateUpdate |
requestStateUpdate() 參數:無
傳回值:無
觸發地圖更新 GL 狀態。 |
setMap |
setMap([map]) 參數:
傳回值:無
將疊加層新增至地圖。 |
繼承:
addListener 、bindTo 、get 、notify 、set 、setValues 、unbind 、unbindAll |
WebGLDrawOptions 介面
google.maps.WebGLDrawOptions
介面
繪圖選項。
屬性 | |
---|---|
gl |
用於算繪此 WebGLOverlayView 的 WebGLRenderingContext。 |
transformer |
從攝影機空間轉換至經緯度座標的矩陣轉換。 |
WebGLStateOptions 介面
google.maps.WebGLStateOptions
介面
GL 狀態選項。
屬性 | |
---|---|
gl |
用於算繪此 WebGLOverlayView 的 WebGLRenderingContext。 |
CoordinateTransformer 介面
google.maps.CoordinateTransformer
介面
這個介面提供方便的方法,可產生矩陣,用於在 Google 基本地圖上算繪 WebGL 場景。
注意:此物件的參照應不在封裝 WebGLOverlayView.onDraw
呼叫的範圍之外。
方法 | |
---|---|
fromLatLngAltitude |
fromLatLngAltitude(latLngAltitude[, rotations, scale]) 參數:
傳回值:
Float64Array 與 WebGL 搭配使用的 MVP 矩陣。 |
getCameraParams |
getCameraParams() 參數:無
傳回值:
CameraParams 相機參數 |
CameraParams 介面
google.maps.CameraParams
介面
用於擷取相機參數,例如用於 WebGLOverlayView
的 GL 相機參數。
這個介面會擴充 CameraOptions
。
屬性 | |
---|---|
center |
類型:
LatLng |
heading |
類型:
number |
tilt |
類型:
number |
zoom |
類型:
number |