Stay organized with collections Save and categorize content based on your preferences.
WebGLOverlayView classgoogle.maps.WebGLOverlayView
class
The WebGL Overlay View provides direct access to the same WebGL rendering context Google Maps Platform uses to render the vector basemap. This use of a shared rendering context provides benefits such as depth occlusion with 3D building geometry, and the ability to sync 2D/3D content with basemap rendering.
With WebGL Overlay View you can add content to your maps using WebGL directly, or popular Graphics libraries like Three.js or deck.gl. To use the overlay, you can extend google.maps.WebGLOverlayView
and provide an implementation for each of the following lifecycle hooks: WebGLOverlayView.onAdd
, WebGLOverlayView.onContextRestored
, WebGLOverlayView.onDraw
, WebGLOverlayView.onContextLost
and WebGLOverlayView.onRemove
.
You must call WebGLOverlayView.setMap
with a valid Map
object to trigger the call to the onAdd()
method and setMap(null)
in order to trigger the onRemove()
method. The setMap()
method can be called at the time of construction or at any point afterward when the overlay should be re-shown after removing. The onDraw()
method will then be called whenever a map property changes that could change the position of the element, such as zoom, center, or map type. WebGLOverlayView may only be added to a vector map having a MapOptions.mapId
(including maps set to the RenderingType.VECTOR
MapOptions.renderingType
and using Map.DEMO_MAP_ID
as the MapOptions.mapId
).
This class extends MVCObject
.
Access by calling const {WebGLOverlayView} = await google.maps.importLibrary("maps")
.
See Libraries in the Maps JavaScript API.
WebGLOverlayView
WebGLOverlayView()
Parameters: None
Creates a WebGLOverlayView
.
getMap
getMap()
Parameters: None
Return Value:Map|null|undefined
onAdd
onAdd()
Parameters: None
Return Value: None
Implement this method to fetch or create intermediate data structures before the overlay is drawn that don’t require immediate access to the WebGL rendering context. This method must be implemented to render.
onContextLost
onContextLost()
Parameters: None
Return Value: None
This method is called when the rendering context is lost for any reason, and is where you should clean up any pre-existing GL state, since it is no longer needed.
onContextRestored
onContextRestored(options)
options
: WebGLStateOptions
that allow developers to restore the GL context.Return Value: None
This method is called once the rendering context is available. Use it to initialize or bind any WebGL state such as shaders or buffer objects.
onDraw
onDraw(options)
options
: WebGLDrawOptions
that allow developers to render content to an associated Google basemap.Return Value: None
Implement this method to draw WebGL content directly on the map. Note that if the overlay needs a new frame drawn then call
WebGLOverlayView.requestRedraw
.
onRemove
onRemove()
Parameters: None
Return Value: None
This method is called when the overlay is removed from the map with WebGLOverlayView.setMap(null)
, and is where you should remove all intermediate objects. This method must be implemented to render.
onStateUpdate
onStateUpdate(options)
options
: WebGLStateOptions
that allow developerse to restore the GL context.Return Value: None
Implement this method to handle any GL state updates outside of the render animation frame.
requestRedraw
requestRedraw()
Parameters: None
Return Value: None
Triggers the map to redraw a frame.
requestStateUpdate
requestStateUpdate()
Parameters: None
Return Value: None
Triggers the map to update GL state.
setMap
setMap([map])
map
: Map optional
The map to access the div, model and view state.Return Value: None
Adds the overlay to the map.
Inherited:addListener
, bindTo
, get
, notify
, set
, setValues
, unbind
, unbindAll
WebGLDrawOptions interface
google.maps.WebGLDrawOptions
interface
Drawing options.
WebGLStateOptions interfacegoogle.maps.WebGLStateOptions
interface
GL state options.
CoordinateTransformer interfacegoogle.maps.CoordinateTransformer
interface
This interface provides convenience methods for generating matrices to use for rendering WebGL scenes on top of the Google base map.
Note: A reference to this object should not be held outside of the scope of the encapsulating WebGLOverlayView.onDraw
call.
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2025-07-09 UTC.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-07-09 UTC."],[],[]]
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4