WebGL

WebGLOverlayView 类

class google.maps.WebGLOverlayView extends MVCObject
library "maps"

通过 WebGL 叠加视图，您可以直接访问 Google Maps Platform 用来渲染矢量基本地图的同一 WebGL 渲染上下文。使用共享渲染上下文有诸多好处，例如可利用 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 的地图）。

const {WebGLOverlayView} = await google.maps.importLibrary("maps");
WebGLOverlayView
WebGLOverlayView()
参数：无
创建 WebGLOverlayView。
getMap
getMap()
参数：无
返回值：Map|null|undefined
onAdd
onAdd()
参数：无
返回值：无
实现此方法可在绘制叠加层之前提取或创建无需立即访问 WebGL 渲染上下文的中间数据结构。必须实现此方法才能进行渲染。
onContextLost
onContextLost()
参数：无
返回值：无
此方法在渲染上下文因任何原因丢失时调用，您应在其中清除所有先前存在的 GL 状态，因为已不再需要此类状态。
onContextRestored
onContextRestored(options)
参数：
返回值：无
此方法在渲染上下文可用时调用，可用于初始化或绑定任何 WebGL 状态，例如着色器或缓冲区对象。
onDraw
onDraw(options)
参数：
  • options: WebGLDrawOptions，可让开发者将内容渲染到关联的 Google 基本地图。
返回值：无
实现此方法可直接在地图上绘制 WebGL 内容。请注意，如果叠加层需要绘制新帧，请调用 WebGLOverlayView.requestRedraw。
onRemove
onRemove()
参数：无
返回值：无
此方法在使用 WebGLOverlayView.setMap(null) 从地图中移除叠加层时调用，您应在其中移除所有的中间对象。必须实现此方法才能进行渲染。
onStateUpdate
onStateUpdate(options)
参数：
返回值：无
实现此方法，以处理渲染动画帧之外的任何 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
用于渲染此 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 接口

interface google.maps.CameraParams extends CameraOptions

用于检索相机参数，例如用于 WebGLOverlayView 的 GL 相机的参数。
center
类型：LatLng
heading
类型：number
tilt
类型：number
zoom
类型：number