WebGL

Classe WebGLOverlayView

lezione google.maps.WebGLOverlayView

La vista sovrapposta di WebGL fornisce l'accesso diretto allo stesso contesto di rendering WebGL utilizzato da Google Maps Platform per visualizzare la mappa base di base. L'utilizzo di un contesto di rendering condiviso offre vantaggi quali la copertura profonda con la geometria degli edifici 3D e la possibilità di sincronizzare i contenuti 2D/3D con le mappe di base.

Con la visualizzazione sovrapposta di WebGL puoi aggiungere contenuti alle tue mappe direttamente da WebGL o popolari librerie grafiche 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 costruzione o in qualsiasi momento successivo, quando l'overlay deve essere mostrato nuovamente dopo la rimozione. Il metodo onDraw() verrà quindi chiamato ogni volta che una proprietà della mappa cambia e potrebbe cambiare la posizione dell'elemento, come lo zoom, il centro o il tipo di mappa. WebGLOverlayView può essere aggiunto solo a una mappa vettoriale con MapOptions.mapId.

Questo corso estende MVCObject.

Accedi chiamando const {WebGLOverlayView} = await google.maps.importLibrary("maps"). Consulta la sezione Librerie nell'API Maps JavaScript.
WebGLOverlayView
WebGLOverlayView()
Parametri: nessuno
Crea un WebGLOverlayView.
getMap
getMap()
Parametri: nessuno
Valore restituito:  Map|null|undefined
onAdd
onAdd()
Parametri: nessuno
Valore di restituzione: nessuno
Implementa questo metodo per recuperare o creare strutture di dati intermedie prima che l'overlay venga disegnato e che non richiedono l'accesso immediato al contesto di rendering WebGL. Questo metodo deve essere implementato per poter essere visualizzato.
onContextLost
onContextLost()
Parametri: nessuno
Valore di restituzione: nessuno
Questo metodo viene chiamato quando il contesto di rendering viene perso per qualsiasi motivo ed è il punto in cui dovresti 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 di restituzione: nessuno
Questo metodo viene richiamato quando il contesto di rendering è disponibile. Usalo per inizializzare o associare qualsiasi stato WebGL, come ombreggiatori o buffer.
onDraw
onDraw(options)
Parametri: 
  • options:  WebGLDrawOptions che consentono agli sviluppatori di eseguire il rendering di contenuti su una mappa di base Google associata.
Valore di restituzione: nessuno
Implementa questo metodo per tracciare contenuti WebGL direttamente sulla mappa. Tieni presente che se l'overlay deve tracciare un nuovo frame, chiama WebGLOverlayView.requestRedraw.
onRemove
onRemove()
Parametri: nessuno
Valore di restituzione: nessuno
Questo metodo viene chiamato quando l'overlay viene rimosso dalla mappa con WebGLOverlayView.setMap(null) ed è quello in cui devi rimuovere tutti gli oggetti intermedi. Questo metodo deve essere implementato per poter essere visualizzato.
onStateUpdate
onStateUpdate(options)
Parametri: 
  • options:  WebGLStateOptions che consentono agli sviluppatori di ripristinare il contesto GL.
Valore di restituzione: nessuno
Implementa questo metodo per gestire gli aggiornamenti dello stato GL al di fuori del frame dell'animazione di rendering.
requestRedraw
requestRedraw()
Parametri: nessuno
Valore di restituzione: nessuno
Attiva la mappa per tracciare un nuovo frame.
requestStateUpdate
requestStateUpdate()
Parametri: nessuno
Valore di restituzione: nessuno
Attiva la mappa per aggiornare lo stato GL.
setMap
setMap([map])
Parametri: 
  • map:  Map optional la mappa per accedere a div, modello e stato di visualizzazione.
Valore di restituzione: nessuno
Aggiunge l'overlay alla mappa.
Ereditata: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

Interfaccia WebGLDrawOptions

google.maps.WebGLDrawOptions interfaccia

Opzioni di disegno.
gl
Il WebGL WebGLContext in cui eseguire il rendering di questo WebGLViewView.
transformer
La trasformazione della matrice dallo spazio della fotocamera alle coordinate di latitudine/longitudine.

Interfaccia di WebGLStateOptions

google.maps.WebGLStateOptions interfaccia

Opzioni per lo stato GL.
gl
Il WebGL WebGLContext in cui eseguire il rendering di questo WebGLViewView.

Interfaccia di CoordinateTransformer

google.maps.CoordinateTransformer interfaccia

Questa interfaccia fornisce metodi utili per generare matrici da utilizzare per il rendering di scene WebGL sopra la mappa di base di Google.

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

Interfaccia di cameraParams

google.maps.CameraParams interfaccia

Utilizzata per recuperare i parametri della videocamera, come quella della videocamera GL utilizzata per WebGLOverlayView.

Questa interfaccia estende CameraOptions.

center
Tipo:  LatLng
heading
Tipo:  number
tilt
Tipo:  number
zoom
Tipo:  number