WebGL

WebGLOverlayView 類別

google.maps.WebGLOverlayView 類別

您可以透過 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) 參數：  options：這個 WebGLStateOptions 可讓開發人員還原 GL 情境。 傳回值：無 算繪環境可供使用時，就會呼叫此方法。可用來初始化或繫結任何 WebGL 狀態，例如著色器或緩衝區物件。
onDraw	onDraw(options) 參數：  options：WebGLDrawOptions 可讓開發人員將內容算繪到相關聯的 Google 基本地圖。 傳回值：無 實作此方法即可直接在地圖上繪製 WebGL 內容。請注意，如果疊加層需要繪製新畫面，請呼叫 WebGLOverlayView.requestRedraw。
onRemove	onRemove() 參數：無 傳回值：無 使用 WebGLOverlayView.setMap(null) 從地圖中移除疊加層時，系統會呼叫此方法，而且您應移除其中的所有中繼物件。必須實作此方法才能進行算繪。
onStateUpdate	onStateUpdate(options) 參數：  options：這個 WebGLStateOptions 可讓開發人員還原 GL 情境。 傳回值：無 實作這個方法，處理算繪動畫影格以外的所有 GL 狀態更新。
requestRedraw	requestRedraw() 參數：無 傳回值：無 觸發地圖重新繪製影格。
requestStateUpdate	requestStateUpdate() 參數：無 傳回值：無 觸發地圖以更新 GL 狀態。
setMap	setMap([map]) 參數：  map：Map optional這個地圖即可存取 div、模型和檢視狀態。 傳回值：無 將疊加層新增至地圖。
沿用： addListener、bindTo、get、notify、set、setValues、unbind、unbindAll

WebGLDrawOptions 介面

google.maps.WebGLDrawOptions 介面

繪圖選項。

屬性
gl	類型：  WebGLRenderingContext 用於算繪這個 WebGLOverlayView 的 WebGLRenderingContext。
transformer	類型：  CoordinateTransformer 矩陣會從相機空間轉換為經緯度座標。

WebGLStateOptions 介面

google.maps.WebGLStateOptions 介面

GL 狀態選項。

屬性
gl	類型：  WebGLRenderingContext 用於算繪這個 WebGLOverlayView 的 WebGLRenderingContext。

CoordinateTransformer 介面

google.maps.CoordinateTransformer 介面

這個介面提供便利的方法，可用來產生矩陣，用來在 Google 基本地圖上方算繪 WebGL 場景。

注意：該物件的參照不應留存在封裝的 WebGLOverlayView.onDraw 呼叫範圍內。

方法
fromLatLngAltitude	fromLatLngAltitude(latLngAltitude[, rotations, scale]) 參數：  latLngAltitude：LatLngAltitude|LatLngAltitudeLiteral 緯度、經度和海拔高度。 rotations：Float32Array optional 包含 XYZ 慣例中的歐爾旋轉角度 (以度為單位) 的陣列。 scale：Float32Array optional 陣列，包含要套用至基軸的 XYZ 純量陣列。 傳回值：  Float64Array MVP 矩陣，可與 WebGL 搭配使用。
getCameraParams	getCameraParams() 參數：無 傳回值：  CameraParams 相機參數

CameraParams 介面

google.maps.CameraParams 介面

用於擷取相機參數，例如用於 WebGLOverlayView 的 GL 相機參數。

這個介面會擴充 CameraOptions。

屬性
center	類型：  LatLng
heading	類型：  number
tilt	類型：  number
zoom	類型：  number