WebGL

Classe WebGLOverlayView

classe google.maps.WebGLOverlayView estende MVCObject
biblioteca "maps"

A visualização de sobreposição do WebGL fornece acesso direto ao mesmo contexto de renderização WebGL usado pela Plataforma Google Maps para renderizar o mapa básico vetorial. Esse uso de um contexto de renderização compartilhada oferece benefícios como a oclusão de profundidade com geometria de construção em 3D e a capacidade de sincronizar conteúdo 2D/3D com a renderização do mapa básico.

Com a visualização de sobreposição do WebGL, você pode adicionar conteúdo aos mapas usando diretamente WebGL ou bibliotecas de gráficos conhecidas, como a Three.js ou a deck.gl. Para usar a sobreposição, estenda google.maps.WebGLOverlayView e forneça uma implementação para cada um dos seguintes hooks de ciclo de vida: WebGLOverlayView.onAdd, WebGLOverlayView.onContextRestored, WebGLOverlayView.onDraw, WebGLOverlayView.onContextLost e WebGLOverlayView.onRemove.

É necessário chamar WebGLOverlayView.setMap com um objeto Map válido para acionar a chamada ao método onAdd() e setMap(null) para acionar o método onRemove(). O método setMap() pode ser chamado no momento da construção ou em qualquer momento posterior, quando a sobreposição precisar ser mostrada novamente após a remoção. O método onDraw() será chamado sempre que uma propriedade do mapa mudar e puder alterar a posição do elemento, como zoom, centro ou tipo de mapa. A WebGLOverlayView só pode ser adicionada a um mapa vetorial com um MapOptions.mapId (incluindo mapas definidos como RenderingType.VECTOR MapOptions.renderingType e usando Map.DEMO_MAP_ID como MapOptions.mapId).

const {WebGLOverlayView} = await google.maps.importLibrary("maps");
WebGLOverlayView
WebGLOverlayView()
Parâmetros: nenhum
Cria uma WebGLOverlayView.
getMap
getMap()
Parâmetros: nenhum
Valor de retorno: Map|null|undefined
onAdd
onAdd()
Parâmetros: nenhum
Valor de retorno: nenhum
Implemente esse método para buscar ou criar estruturas de dados intermediárias antes de desenhar a sobreposição sem necessidade de acesso imediato ao contexto de renderização do WebGL. Esse método precisa ser implementado para renderizar.
onContextLost
onContextLost()
Parâmetros: nenhum
Valor de retorno: nenhum
Esse método é chamado quando o contexto de renderização é perdido por algum motivo e é onde você precisa limpar qualquer estado GL preexistente, já que ele deixa de ser necessário.
onContextRestored
onContextRestored(options)
Parâmetros:
  • options: WebGLStateOptions que permitem que os desenvolvedores restaurem o contexto do GL.
Valor de retorno: nenhum
Esse método é chamado quando o contexto de renderização está disponível. Use esse hook para inicializar ou vincular qualquer estado WebGL, como sombreadores ou objetos de buffer.
onDraw
onDraw(options)
Parâmetros:
  • options: WebGLDrawOptions que permitem que os desenvolvedores renderizem conteúdo em um mapa básico do Google associado.
Valor de retorno: nenhum
Implemente esse método para desenhar conteúdo do WebGL diretamente no mapa. Se a sobreposição precisar de um novo frame, chame WebGLOverlayView.requestRedraw.
onRemove
onRemove()
Parâmetros: nenhum
Valor de retorno: nenhum
Esse método é chamado quando a sobreposição é removida do mapa com WebGLOverlayView.setMap(null), e é de onde você precisa remover todos os objetos intermediários. Esse método precisa ser implementado para renderizar.
onStateUpdate
onStateUpdate(options)
Parâmetros:
  • options: WebGLStateOptions que permitem que os desenvolvedores restaurem o contexto do GL.
Valor de retorno: nenhum
Implemente esse método para processar as atualizações de estado do GL fora do frame de animação de renderização.
requestRedraw
requestRedraw()
Parâmetros: nenhum
Valor de retorno: nenhum
Aciona o mapa para redesenhar um frame.
requestStateUpdate
requestStateUpdate()
Parâmetros: nenhum
Valor de retorno: nenhum
Aciona o mapa para atualizar o estado do GL.
setMap
setMap([map])
Parâmetros:
  • map: Map optional O mapa para acessar a div, o modelo e o estado de visualização.
Valor de retorno: nenhum
Adiciona a sobreposição ao mapa.
Herdado: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

Interface WebGLDrawOptions

interface google.maps.WebGLDrawOptions

Opções de desenho.
gl
O WebGLRenderingContext em que essa WebGLOverlayView será renderizada.
transformer
A transformação de matriz do espaço da câmera em coordenadas de latitude/longitude.

Interface WebGLStateOptions

interface google.maps.WebGLStateOptions

Opções de estado do GL.
gl
O WebGLRenderingContext em que essa WebGLOverlayView será renderizada.

Interface CoordinateTransformer

interface google.maps.CoordinateTransformer

Essa interface oferece métodos convenientes para gerar matrizes que serão usadas na renderização de cenas do WebGL sobre o mapa de base do Google.

Observação: uma referência a esse objeto não pode ser mantida fora do escopo da chamada WebGLOverlayView.onDraw de encapsulamento.
fromLatLngAltitude
fromLatLngAltitude(latLngAltitude[, rotations, scale])
Parâmetros:
  • latLngAltitude: LatLngAltitude|LatLngAltitudeLiteral Latitude, longitude e altitude.
  • rotations: Float32Array optional Uma matriz que contém um ângulo de rotação de Euler em graus, na convenção XYZ.
  • scale: Float32Array optional Matriz que contém uma matriz escalar XYZ para aplicar ao eixo cardeal.
Valor de retorno: matriz MVP Float64Array para usar com o WebGL.
getCameraParams
getCameraParams()
Parâmetros: nenhum
Valor de retorno: parâmetros de câmera CameraParams

Interface CameraParams

interface google.maps.CameraParams extends CameraOptions

Usado para recuperar parâmetros da câmera, como os da câmera GL usada para o WebGLOverlayView.
center
Tipo: LatLng
heading
Tipo: number
tilt
Tipo: number
zoom
Tipo: number