Advanced Markers

Clase AdvancedMarkerElement

Clase google.maps.marker.AdvancedMarkerElement

Muestra una posición en un mapa. Ten en cuenta que se debe configurar position para que se muestre AdvancedMarkerElement.

Nota: El uso como componente web (p.ej., con el elemento HTML personalizado <gmp-advanced-marker>) solo está disponible en el canal v=beta.

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

Esta clase extiende HTMLElement.

Esta clase implementa AdvancedMarkerElementOptions.

Para acceder, llama a const {AdvancedMarkerElement} = await google.maps.importLibrary("marker"). Consulta Bibliotecas de la API de Maps JavaScript.

Constructor
AdvancedMarkerElement	AdvancedMarkerElement([options]) Parámetros:  options:  AdvancedMarkerElementOptions optional Crea un AdvancedMarkerElement con las opciones especificadas. Si se especifica un mapa, el AdvancedMarkerElement se agrega al mapa durante la construcción.

Propiedades
collisionBehavior	Tipo:  CollisionBehavior optional Consulta los AdvancedMarkerElementOptions.collisionBehavior.
content	Tipo:  Node optional Consulta los AdvancedMarkerElementOptions.content.
element	Tipo:  HTMLElement Este campo es de solo lectura. El elemento DOM que respalda la vista.
gmpClickable	Aviso: Solo está disponible en el canal v=beta. Tipo:  boolean optional Consulta los AdvancedMarkerElementOptions.gmpClickable.
gmpDraggable	Tipo:  boolean optional Consulta los AdvancedMarkerElementOptions.gmpDraggable.
map	Tipo:  Map optional Consulta los AdvancedMarkerElementOptions.map.
position	Tipo:  LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional Consulta los AdvancedMarkerElementOptions.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 Consulta los AdvancedMarkerElementOptions.title. Atributo HTML: <gmp-advanced-marker title="string"></gmp-advanced-marker>
zIndex	Tipo:  number optional Consulta los AdvancedMarkerElementOptions.zIndex.

Métodos
addEventListener	Aviso: Solo está disponible en el canal v=beta. addEventListener(type, listener[, options]) Parámetros:  type:  string Es una cadena que distingue mayúsculas de minúsculas y representa el tipo de evento que se debe escuchar. listener:  EventListener|EventListenerObject Es el objeto que recibe una notificación. Debe ser una función o un objeto con el método handleEvent. options:  boolean|AddEventListenerOptions optional Consulta las opciones. Los eventos personalizados solo admiten capture y passive. Valor que se muestra:  void Establece una función a la que se llamará cada vez que se envíe el evento especificado al destino. Consulta addEventListener.
addListener	addListener(eventName, handler) Parámetros:  eventName:  string Evento observado. handler:  Function Es una función para controlar eventos. Valor que se muestra:  MapsEventListener Objeto de escucha de eventos resultante. Agrega la función de objeto de escucha determinada al nombre del evento determinado en el sistema de eventos de Maps.
removeEventListener	Aviso: Solo está disponible en el canal v=beta. removeEventListener(type, listener[, options]) Parámetros:  type:  string Es una cadena que especifica el tipo de evento para el que se debe quitar un objeto de escucha de eventos. listener:  EventListener|EventListenerObject Es el objeto de escucha de eventos del controlador de eventos que se quitará del objetivo del evento. options:  boolean|EventListenerOptions optional Consulta las opciones. Valor que se muestra:  void Quita del destino un objeto de escucha de eventos registrado anteriormente con addEventListener. Consulta removeEventListener.

Eventos
click	function(event) Argumentos:  event:  MapMouseEvent Este evento se activa cuando se hace clic en el elemento AdvancedMarkerElement. No está disponible con addEventListener() (usa gmp-click en su lugar).
drag	function(event) Argumentos:  event:  MapMouseEvent Este evento se activa de forma repetida mientras el usuario arrastra el AdvancedMarkerElement. No disponible con addEventListener().
dragend	function(event) Argumentos:  event:  MapMouseEvent Este evento se activa cuando el usuario deja de arrastrar el AdvancedMarkerElement. No disponible con addEventListener().
dragstart	function(event) Argumentos:  event:  MapMouseEvent Este evento se activa cuando el usuario comienza a arrastrar el AdvancedMarkerElement. No disponible con addEventListener().
gmp-click	Aviso: Solo está disponible en el canal v=beta. function(event) Argumentos:  event:  AdvancedMarkerClickEvent Este evento se activa cuando se hace clic en el elemento AdvancedMarkerElement. Se recomienda usar con addEventListener() (en lugar de addListener()).

Interface AdvancedMarkerElementOptions

Interfaz de google.maps.marker.AdvancedMarkerElementOptions

Son opciones para construir un AdvancedMarkerElement.

Propiedades
collisionBehavior optional	Tipo:  CollisionBehavior optional Es una enumeración que especifica cómo debe comportarse un AdvancedMarkerElement cuando colisiona con otro AdvancedMarkerElement o con las etiquetas del mapa base en un mapa vectorial. Nota: La colisión de AdvancedMarkerElement a AdvancedMarkerElement funciona en mapas de tramas y vectoriales. Sin embargo, la colisión de AdvancedMarkerElement a la etiqueta del mapa base solo funciona en mapas vectoriales.
content optional	Tipo:  Node optional Predeterminado: PinElement.element El elemento DOM que respalda la imagen de un AdvancedMarkerElement. Nota: AdvancedMarkerElement no clona el elemento DOM pasado. Una vez que se pasa el elemento DOM a un AdvancedMarkerElement, pasar el mismo elemento DOM a otro AdvancedMarkerElement moverá el elemento DOM y hará que el AdvancedMarkerElement anterior se vea vacío.
gmpClickable optional	Aviso: Solo está disponible en el canal v=beta. Tipo:  boolean optional Predeterminado: false Si es true, se podrá hacer clic en AdvancedMarkerElement y eso activará el evento gmp-click, que será interactivo para fines de accesibilidad (p.ej., permite la navegación con el teclado a través de las teclas de flecha).
gmpDraggable optional	Tipo:  boolean optional Predeterminado: false Si es true, se puede arrastrar el AdvancedMarkerElement. Nota: No se puede arrastrar AdvancedMarkerElement con altitud.
map optional	Tipo:  Map optional Es el mapa en el que se mostrará el AdvancedMarkerElement. El mapa es necesario para mostrar el AdvancedMarkerElement y se puede proporcionar configurando AdvancedMarkerElement.map si no se proporciona en la construcción.
position optional	Tipo:  LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional Establece la posición de AdvancedMarkerElement. Se puede crear un AdvancedMarkerElement sin una posición, pero no se mostrará hasta que se proporcione su posición, por ejemplo, a través de las acciones o elecciones de un usuario. Se puede proporcionar la posición de un AdvancedMarkerElement configurando AdvancedMarkerElement.position si no se proporciona en la construcción. Nota: AdvancedMarkerElement con altitud solo es compatible con los mapas de vectores.
title optional	Tipo:  string optional texto de sustitución. Si se proporciona, se agregará un texto de accesibilidad (p.ej., para usar con lectores de pantalla) a AdvancedMarkerElement con el valor proporcionado.
zIndex optional	Tipo:  number optional Todos los AdvancedMarkerElement se muestran en el mapa en orden de su zIndex, y los valores más altos se muestran delante de los AdvancedMarkerElement con valores más bajos. De forma predeterminada, los AdvancedMarkerElement se muestran según su posición vertical en la pantalla, y los AdvancedMarkerElement más bajos aparecen delante de los AdvancedMarkerElement más arriba en la pantalla. Ten en cuenta que zIndex también se usa para ayudar a determinar la prioridad relativa entre los marcadores avanzados CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY. Un valor zIndex más alto indica una prioridad más alta.

Clase AdvancedMarkerClickEvent

Clase google.maps.marker.AdvancedMarkerClickEvent

Aviso: Solo está disponible en el canal v=beta.

Este evento se crea haciendo clic en un marcador avanzado. Accede a la posición del marcador con event.target.position.

Esta clase extiende Event.

Para acceder, llama a const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker"). Consulta Bibliotecas de la API de Maps JavaScript.

Clase PinElement

Clase google.maps.marker.PinElement

Un PinElement representa un elemento DOM que consta de una forma y un glifo. La forma tiene el mismo estilo de globo que se ve en el AdvancedMarkerElement predeterminado. El glifo es un elemento DOM opcional que se muestra en forma de globo. Un PinElement puede tener una relación de aspecto diferente según su PinElement.scale.

Nota: Aún no se admite el uso como componente web (p.ej., como subclase de HTMLElement o a través de HTML).

Esta clase extiende HTMLElement.

Esta clase implementa PinElementOptions.

Para acceder, llama a const {PinElement} = await google.maps.importLibrary("marker"). Consulta Bibliotecas de la API de Maps JavaScript.

Constructor
PinElement	PinElement([options]) Parámetros:  options:  PinElementOptions optional

Propiedades
background	Tipo:  string optional Consulta los PinElementOptions.background.
borderColor	Tipo:  string optional Consulta los PinElementOptions.borderColor.
element	Tipo:  HTMLElement Este campo es de solo lectura. El elemento DOM que respalda la vista.
glyph	Tipo:  string|Element|URL optional Consulta los PinElementOptions.glyph.
glyphColor	Tipo:  string optional Consulta los PinElementOptions.glyphColor.
scale	Tipo:  number optional Consulta los PinElementOptions.scale.

Métodos
addEventListener	Aviso: Solo está disponible en el canal v=beta. addEventListener(type, listener[, options]) Parámetros:  type:  string listener:  EventListener|EventListenerObject options:  boolean|AddEventListenerOptions optional Valor que se muestra:  void Esta función aún no está disponible para su uso.
removeEventListener	Aviso: Solo está disponible en el canal v=beta. removeEventListener(type, listener[, options]) Parámetros:  type:  string Es una cadena que especifica el tipo de evento para el que se debe quitar un objeto de escucha de eventos. listener:  EventListener|EventListenerObject Es el objeto de escucha de eventos del controlador de eventos que se quitará del objetivo del evento. options:  boolean|EventListenerOptions optional Consulta las opciones. Valor que se muestra:  void Quita del destino un objeto de escucha de eventos registrado anteriormente con addEventListener. Consulta removeEventListener.

Interfaz PinElementOptions

Interfaz de google.maps.marker.PinElementOptions

Son opciones para crear un PinElement.

Propiedades
background optional	Tipo:  string optional Es el color de fondo de la forma del pin. Admite cualquier valor de color de CSS.
borderColor optional	Tipo:  string optional Es el color del borde de la forma del pin. Admite cualquier valor de color de CSS.
glyph optional	Tipo:  string|Element|URL optional Es el elemento DOM que se muestra en el pin.
glyphColor optional	Tipo:  string optional Es el color del glifo. Admite cualquier valor de color de CSS.
scale optional	Tipo:  number optional Predeterminado: 1 Es la escala del pin.