Advanced Markers

Classe AdvancedMarkerElement

Classe google.maps.marker.AdvancedMarkerElement

Mostra uma posição em um mapa. O position precisa ser definido para que o AdvancedMarkerElement seja exibido.

Observação:o uso como um componente da Web (por exemplo, o elemento HTML personalizado <gmp-advanced-marker>) só está disponível no canal v=beta.

Elemento personalizado:
<gmp-advanced-marker position="lat,lng" title="string"></gmp-advanced-marker>

Essa classe estende HTMLElement.

Essa classe implementa AdvancedMarkerElementOptions.

Acesse chamando const {AdvancedMarkerElement} = await google.maps.importLibrary("marker"). Consulte Bibliotecas na API Maps JavaScript.

AdvancedMarkerElement
AdvancedMarkerElement([options])
Parâmetros: 
Cria um AdvancedMarkerElement com as opções especificadas. Se um mapa for especificado, o AdvancedMarkerElement será adicionado ao mapa durante a construção.
collisionBehavior
Tipo:  CollisionBehavior optional
content
Tipo:  Node optional
element
Tipo:  HTMLElement
Este campo é somente leitura. O elemento DOM que dá suporte à visualização.
gmpDraggable
Tipo:  boolean optional
map
Tipo:  Map optional
position
Atributo HTML:
  • <gmp-advanced-marker position="lat,lng"></gmp-advanced-marker>
  • <gmp-advanced-marker position="lat,lng,altitude"></gmp-advanced-marker>
title
Tipo:  string
Atributo HTML:
  • <gmp-advanced-marker title="string"></gmp-advanced-marker>
zIndex
Tipo:  number optional
BetaaddEventListener
addEventListener(type, listener[, options])
Parâmetros: 
  • typestring é uma string que diferencia maiúsculas de minúsculas e representa o tipo de evento a ser detectado.
  • listenerEventListener|EventListenerObject o objeto que recebe uma notificação. Precisa ser uma função ou um objeto com o método handleEvent
  • optionsboolean|AddEventListenerOptions optional Veja as opções. Os eventos personalizados oferecem suporte apenas a capture e passive.
Valor de retorno:  void
Configura uma função que será chamada sempre que o evento especificado for entregue ao destino. Consulte addEventListener
addListener
addListener(eventName, handler)
Parâmetros: 
  • eventNamestring evento observado.
  • handler:  função Function para processar eventos.
Valor de retorno:  MapsEventListener Listener de eventos resultante.
Adiciona a função de listener especificada ao nome de evento especificado no sistema de Eventing do Google Maps.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parâmetros: 
Valor de retorno:  void
Remove do destino um listener de eventos registrado anteriormente com addEventListener. Consulte removeEventListener
click
function(event)
Argumentos: 
Este evento é disparado quando o elemento AdvancedMarkerElement é clicado.

Indisponível com addEventListener() (use gmp-click).
drag
function(event)
Argumentos: 
Este evento é disparado repetidamente enquanto o usuário arrasta AdvancedMarkerElement.

Indisponível no addEventListener().
dragend
function(event)
Argumentos: 
Este evento é disparado quando o usuário para de arrastar AdvancedMarkerElement.

Indisponível no addEventListener().
dragstart
function(event)
Argumentos: 
Este evento é disparado quando o usuário começa a arrastar a AdvancedMarkerElement.

Indisponível no addEventListener().
Betagmp-click
function(event)
Argumentos: 
Este evento é disparado quando o elemento AdvancedMarkerElement é clicado. Melhor usado com addEventListener() (em vez de addListener()).

AdvancedMarkerElementOptions

Interface google.maps.marker.AdvancedMarkerElementOptions

Opções para criar um AdvancedMarkerElement.

collisionBehavior optional
Tipo:  CollisionBehavior optional
Uma enumeração que especifica como uma AdvancedMarkerElement precisa se comportar quando entrar em conflito com outra AdvancedMarkerElement ou com os rótulos do mapa básico em um mapa vetorial.

Observação: a colisão de AdvancedMarkerElement a AdvancedMarkerElement funciona em mapas vetoriais e rasterizados. No entanto, AdvancedMarkerElement para a colisão de rótulos do mapa base só funciona em mapas vetoriais.

content optional
Tipo:  Node optional
O elemento DOM que apoia o visual de uma AdvancedMarkerElement.

Observação: AdvancedMarkerElement não clona o elemento DOM transmitido. Depois que o elemento DOM for transmitido para um AdvancedMarkerElement, transmitir o mesmo elemento DOM para outro AdvancedMarkerElement moverá o elemento DOM e fará com que o AdvancedMarkerElement anterior pareça vazio.

gmpDraggable optional
Tipo:  boolean optional
Padrão:false
Se ele for definido como true, a AdvancedMarkerElement poderá ser arrastada.

Observação: não é possível arrastar AdvancedMarkerElement com altitude.

map optional
Tipo:  Map optional
Mapa em que o AdvancedMarkerElement será mostrado. O mapa é necessário para mostrar o AdvancedMarkerElement e pode ser fornecido definindo AdvancedMarkerElement.map caso ele não seja informado na construção.
position optional
Define a posição do AdvancedMarkerElement. Um AdvancedMarkerElement pode ser construído sem uma posição, mas não será exibido até que a posição seja fornecida, por exemplo, por ações ou escolhas do usuário. A posição de um AdvancedMarkerElement pode ser fornecida configurando AdvancedMarkerElement.position, caso essa informação não seja informada na construção.

Observação: AdvancedMarkerElement com altitude é compatível apenas com mapas vetoriais.

title optional
Tipo:  string optional
texto da sobreposição. Se fornecido, um texto de acessibilidade (por exemplo, para uso com leitores de tela) será adicionado ao AdvancedMarkerElement com o valor fornecido.
zIndex optional
Tipo:  number optional
Todos os AdvancedMarkerElements são exibidos no mapa na ordem do zIndex. Os valores maiores são exibidos na frente de AdvancedMarkerElements com valores menores. Por padrão, AdvancedMarkerElements são mostradas de acordo com a posição vertical na tela, com AdvancedMarkerElements mais baixos aparecendo à frente de AdvancedMarkerElements mais acima na tela. zIndex também é usado para ajudar a determinar a prioridade relativa entre os marcadores avançados CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY. Um valor zIndex mais alto indica uma prioridade mais alta.

Classe AdvancedMarkerClickEvent

Classe google.maps.marker.AdvancedMarkerClickEvent

Esse evento é criado clicando em um marcador avançado. Acesse a posição do marcador com event.target.position.

Essa classe estende Event.

Acesse chamando const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker"). Consulte Bibliotecas na API Maps JavaScript.

Classe PinElement

Classe google.maps.marker.PinElement

Um PinElement representa um elemento DOM que consiste em uma forma e um glifo. A forma tem o mesmo estilo de balão visto no AdvancedMarkerElement padrão. O glifo é um elemento DOM opcional exibido na forma de balão. Um PinElement pode ter uma proporção diferente dependendo do PinElement.scale.

Observação:ainda não há suporte para o uso como um componente da Web (por exemplo, como uma subclasse HTMLElement ou por meio de HTML).

Essa classe estende HTMLElement.

Essa classe implementa PinElementOptions.

Acesse chamando const {PinElement} = await google.maps.importLibrary("marker"). Consulte Bibliotecas na API Maps JavaScript.

PinElement
PinElement([options])
Parâmetros: 
background
Tipo:  string optional
borderColor
Tipo:  string optional
element
Tipo:  HTMLElement
Este campo é somente leitura. O elemento DOM que dá suporte à visualização.
glyph
Tipo:  string|Element|URL optional
glyphColor
Tipo:  string optional
scale
Tipo:  number optional
BetaaddEventListener
addEventListener(type, listener[, options])
Parâmetros: 
Valor de retorno:  void
Esta função ainda não está disponível para uso.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Parâmetros: 
Valor de retorno:  void
Remove do destino um listener de eventos registrado anteriormente com addEventListener. Consulte removeEventListener

PinElementOptions

Interface google.maps.marker.PinElementOptions

Opções para criar um PinElement.

background optional
Tipo:  string optional
A cor de fundo da forma do alfinete. Compatível com qualquer valor de cor CSS.
borderColor optional
Tipo:  string optional
A cor da borda da forma do alfinete. Compatível com qualquer valor de cor CSS.
glyph optional
Tipo:  string|Element|URL optional
O elemento DOM exibido no pin.
glyphColor optional
Tipo:  string optional
A cor do glifo. Compatível com qualquer valor de cor CSS.
scale optional
Tipo:  number optional
Padrão:1
A escala do alfinete.