WebGL

Classe WebGLOverlayView

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

La visualizzazione sovrapposta WebGL fornisce l'accesso diretto allo stesso contesto di rendering WebGL utilizzato da Google Maps Platform per eseguire il rendering della mappa base vettoriale. Questo utilizzo di un contesto di rendering condiviso offre vantaggi come l'occlusione di profondità con la geometria degli edifici in 3D e la possibilità di sincronizzare i contenuti 2D/3D con il rendering della mappa base.

Con la visualizzazione sovrapposta WebGL puoi aggiungere contenuti alle tue mappe utilizzando direttamente WebGL o librerie grafiche popolari come Three.js o deck.gl. Per utilizzare l'overlay, puoi estendere google.maps.WebGLOverlayView e fornire un'implementazione per ciascuno dei seguenti hook del ciclo di vita: WebGLOverlayView.onAdd, WebGLOverlayView.onContextRestored, WebGLOverlayView.onDraw, WebGLOverlayView.onContextLost e WebGLOverlayView.onRemove.

Devi chiamare WebGLOverlayView.setMap con un oggetto Map valido per attivare la chiamata al metodo onAdd() e setMap(null) per attivare il metodo onRemove(). Il metodo setMap() può essere chiamato al momento della creazione o in qualsiasi momento successivo, quando l'overlay deve essere mostrato di nuovo dopo la rimozione. Il metodo onDraw() verrà quindi chiamato ogni volta che cambia una proprietà della mappa che potrebbe modificare la posizione dell'elemento, ad esempio lo zoom, il centro o il tipo di mappa. WebGLOverlayView può essere aggiunto solo a una mappa vettoriale con un MapOptions.mapId (incluse le mappe impostate su RenderingType.VECTOR MapOptions.renderingType e che utilizzano Map.DEMO_MAP_ID come MapOptions.mapId).

const {WebGLOverlayView} = await google.maps.importLibrary("maps");
WebGLOverlayView
WebGLOverlayView()
Parametri: nessuno
Crea un WebGLOverlayView.
getMap
getMap()
Parametri: nessuno
Valore restituito: Map|null|undefined
onAdd
onAdd()
Parametri: nessuno
Valore restituito: nessuno
Implementa questo metodo per recuperare o creare strutture di dati intermedie prima che venga disegnato l'overlay che non richiedono l'accesso immediato al contesto di rendering WebGL. Questo metodo deve essere implementato per il rendering.
onContextLost
onContextLost()
Parametri: nessuno
Valore restituito: nessuno
Questo metodo viene chiamato quando il contesto di rendering viene perso per qualsiasi motivo ed è qui che devi ripulire qualsiasi stato GL preesistente, poiché non è più necessario.
onContextRestored
onContextRestored(options)
Parametri:
  • options: WebGLStateOptions che consentono agli sviluppatori di ripristinare il contesto GL.
Valore restituito: nessuno
Questo metodo viene chiamato quando il contesto di rendering è disponibile. Utilizzalo per inizializzare o associare qualsiasi stato WebGL, ad esempio shader o oggetti buffer.
onDraw
onDraw(options)
Parametri:
  • options: WebGLDrawOptions che consentono agli sviluppatori di eseguire il rendering dei contenuti su una mappa base di Google associata.
Valore restituito: nessuno
Implementa questo metodo per disegnare contenuti WebGL direttamente sulla mappa. Tieni presente che se l'overlay richiede il disegno di un nuovo frame, devi chiamare WebGLOverlayView.requestRedraw.
onRemove
onRemove()
Parametri: nessuno
Valore restituito: nessuno
Questo metodo viene chiamato quando l'overlay viene rimosso dalla mappa con WebGLOverlayView.setMap(null) e consente di rimuovere tutti gli oggetti intermedi. Questo metodo deve essere implementato per il rendering.
onStateUpdate
onStateUpdate(options)
Parametri:
  • options: WebGLStateOptions che consentono agli sviluppatori di ripristinare il contesto GL.
Valore restituito: nessuno
Implementa questo metodo per gestire eventuali aggiornamenti dello stato GL al di fuori del frame di animazione di rendering.
requestRedraw
requestRedraw()
Parametri: nessuno
Valore restituito: nessuno
Attiva la mappa per ridisegnare un frame.
requestStateUpdate
requestStateUpdate()
Parametri: nessuno
Valore restituito: nessuno
Attiva la mappa per aggiornare lo stato GL.
setMap
setMap([map])
Parametri:
  • map: Map optional La mappa per accedere allo stato di div, modello e visualizzazione.
Valore restituito: nessuno
Aggiunge l'overlay alla mappa.
Ereditate: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

Interfaccia WebGLDrawOptions

interfaccia google.maps.WebGLDrawOptions

Opzioni di disegno.
gl
Il WebGLRenderingContext su cui eseguire il rendering di questo WebGLOverlayView.
transformer
La trasformazione della matrice dallo spazio della fotocamera alle coordinate di latitudine/longitudine.

Interfaccia WebGLStateOptions

interfaccia google.maps.WebGLStateOptions

Opzioni di stato GL.
gl
Il WebGLRenderingContext su cui eseguire il rendering di questo WebGLOverlayView.

Interfaccia CoordinateTransformer

interfaccia google.maps.CoordinateTransformer

Questa interfaccia fornisce metodi pratici per generare matrici da utilizzare per il rendering di scene WebGL sulla mappa base di Google.

Nota: un riferimento a questo oggetto non deve essere conservato al di fuori dell'ambito della chiamata WebGLOverlayView.onDraw di incapsulamento.
fromLatLngAltitude
fromLatLngAltitude(latLngAltitude[, rotations, scale])
Parametri:
  • latLngAltitude: LatLngAltitude|LatLngAltitudeLiteral Latitudine, longitudine e altitudine.
  • rotations: Float32Array optional Un array che contiene un angolo di rotazione di Eulero in gradi, nella convenzione XYZ.
  • scale: Float32Array optional Array che contiene un array scalare XYZ da applicare all'asse cardinale.
Valore restituito: matrice MVP Float64Array da utilizzare con WebGL.
getCameraParams
getCameraParams()
Parametri: nessuno
Valore restituito: parametri della fotocamera CameraParams

Interfaccia CameraParams

interface google.maps.CameraParams extends CameraOptions

Utilizzato per recuperare i parametri della fotocamera, ad esempio quelli della fotocamera GL utilizzata per WebGLOverlayView.
center
Tipo: LatLng
heading
Tipo: number
tilt
Tipo: number
zoom
Tipo: number