Se usó la API de Cloud Translation para traducir esta página.

Marker

Clase google.maps.Marker

Esta clase extiende MVCObject.

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

Constructor
`Marker`	`Marker([opts])` Parámetros: `opts`: `MarkerOptions optional` Argumentos opcionales con nombre Crea un marcador con las opciones especificadas. Si se especifica un mapa, este se agrega al mapa durante la construcción. Ten en cuenta que se debe establecer la posición para que se muestre el marcador.

Constantes
`MAX_ZINDEX`	Es el índice z máximo predeterminado que la API asignará a un marcador. Puedes establecer un índice z más alto para colocar un marcador al frente.

Métodos
`getAnimation`	`getAnimation()` Parámetros: Ninguno Valor que se muestra: `Animation\|null\|undefined` Obtén la animación que se está ejecutando actualmente.
`getClickable`	`getClickable()` Parámetros: Ninguno Valor que se muestra: `boolean` Es verdadero si se puede hacer clic en el marcador. Obtén el estado en el que se puede hacer clic de `Marker`.
`getCursor`	`getCursor()` Parámetros: Ninguno Valor que se muestra: `string\|null\|undefined` Obtén el tipo de cursor del mouse que se muestra cuando se coloca el cursor sobre él.
`getDraggable`	`getDraggable()` Parámetros: Ninguno Valor que se muestra: `boolean` Es verdadero si el marcador es arrastrable. Obtén el estado arrastrable de `Marker`.
`getIcon`	`getIcon()` Parámetros: Ninguno Valor que se muestra: `string\|Icon\|Symbol\|null\|undefined` Obtén el ícono de `Marker`. Consulta los `MarkerOptions.icon`.
`getLabel`	`getLabel()` Parámetros: Ninguno Valor que se muestra: `MarkerLabel\|string\|null\|undefined` Obtén la etiqueta de `Marker`. Consulta los `MarkerOptions.label`.
`getMap`	`getMap()` Parámetros: Ninguno Valor que se muestra: `Map\|StreetViewPanorama` Obtén el mapa o Panaroama en el que se renderiza `Marker`.
`getOpacity`	`getOpacity()` Parámetros: Ninguno Valor que se muestra: `number\|null\|undefined` Es un número entre 0.0 y 1.0. Obtén la opacidad de `Marker`.
`getPosition`	`getPosition()` Parámetros: Ninguno Valor que se muestra: `LatLng\|null\|undefined` Obtén la posición de `Marker`.
`getShape`	`getShape()` Parámetros: Ninguno Valor que se muestra: `MarkerShape\|null\|undefined` Obtén la forma del `Marker` que se usa para la interacción. Consulta `MarkerOptions.shape` y `MarkerShape`.
`getTitle`	`getTitle()` Parámetros: Ninguno Valor que se muestra: `string\|null\|undefined` Obtén el título de la información sobre la herramienta de `Marker`. Consulta los `MarkerOptions.title`.
`getVisible`	`getVisible()` Parámetros: Ninguno Valor que se muestra: `boolean` Es verdadero si el marcador es visible. Obtén la visibilidad de `Marker`.
`getZIndex`	`getZIndex()` Parámetros: Ninguno Valor que se muestra: `number\|null\|undefined` zIndex del marcador. Obtén el zIndex de `Marker`. Consulta los `MarkerOptions.zIndex`.
`setAnimation`	`setAnimation([animation])` Parámetros: `animation`: `Animation optional` Es la animación que se reproducirá. Valor que se muestra: ninguno Inicia una animación. Se cancelará cualquier animación en curso. Actualmente, las animaciones admitidas son: `Animation.BOUNCE` y `Animation.DROP`. Pasar `null` hará que se detenga cualquier animación.
`setClickable`	`setClickable(flag)` Parámetros: `flag`: `boolean` Si el valor es `true`, se puede hacer clic en el marcador. Valor que se muestra: ninguno Establece si se puede hacer clic en `Marker`.
`setCursor`	`setCursor([cursor])` Parámetros: `cursor`: `string optional` Tipo de cursor del mouse. Valor que se muestra: ninguno Establece el tipo de cursor del mouse que se muestra al colocarlo sobre un elemento.
`setDraggable`	`setDraggable(flag)` Parámetros: `flag`: `boolean optional` Si el valor es `true`, el marcador se puede arrastrar. Valor que se muestra: ninguno Establece si `Marker` es arrastrable.
`setIcon`	`setIcon([icon])` Parámetros: `icon`: `string\|Icon\|Symbol optional` Valor que se muestra: ninguno Establece el ícono para el `Marker`. Consulta los `MarkerOptions.icon`.
`setLabel`	`setLabel([label])` Parámetros: `label`: `string\|MarkerLabel optional` La etiqueta puede ser una string de caracteres o un objeto `MarkerLabel`. Valor que se muestra: ninguno Establece la etiqueta para `Marker`. Consulta los `MarkerOptions.label`.
`setMap`	`setMap(map)` Parámetros: `map`: `Map\|StreetViewPanorama` Valor que se muestra: ninguno Renderiza el objeto `Marker` en el mapa o la panorámica especificados. Si el mapa se establece en `null`, se quitará el marcador.
`setOpacity`	`setOpacity([opacity])` Parámetros: `opacity`: `number optional` Es un número entre 0.0, transparente y 1.0, opaco. Valor que se muestra: ninguno Establece la opacidad de `Marker`.
`setOptions`	`setOptions(options)` Parámetros: `options`: `MarkerOptions` Valor que se muestra: ninguno Configura las opciones para `Marker`.
`setPosition`	`setPosition([latlng])` Parámetros: `latlng`: `LatLng\|LatLngLiteral optional` Es la nueva posición. Valor que se muestra: ninguno Establece la publicación para `Marker`.
`setShape`	`setShape([shape])` Parámetros: `shape`: `MarkerShape optional` Valor que se muestra: ninguno Establece la forma del `Marker` que se usa para la interacción. Consulta `MarkerOptions.shape` y `MarkerShape`.
`setTitle`	`setTitle([title])` Parámetros: `title`: `string optional` Valor que se muestra: ninguno Establece el título de la información sobre la herramienta `Marker`. Consulta los `MarkerOptions.title`.
`setVisible`	`setVisible(visible)` Parámetros: `visible`: `boolean` si el valor es `true`, el marcador es visible. Valor que se muestra: ninguno Establece si `Marker` es visible.
`setZIndex`	`setZIndex([zIndex])` Parámetros: `zIndex`: `number optional` Valor que se muestra: ninguno Establece el zIndex de `Marker`. Consulta los `MarkerOptions.zIndex`.
Heredado: `addListener`, `bindTo`, `get`, `notify`, `set`, `setValues`, `unbind`, `unbindAll`

Eventos
`animation_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad de la animación `Marker`.
`click`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando se hace clic en el ícono `Marker`.
`clickable_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad en la que se puede hacer clic `Marker`.
`contextmenu`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando se activa el evento de menú contextual del DOM en `Marker`.
`cursor_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad del cursor `Marker`.
`dblclick`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando se hace doble clic en el ícono `Marker`.
`drag`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa de manera repetida mientras el usuario arrastra el elemento `Marker`.
`dragend`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando el usuario deja de arrastrar `Marker`.
`draggable_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad arrastrable `Marker`.
`dragstart`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando el usuario comienza a arrastrar `Marker`.
`flat_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad plana `Marker`.
`icon_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad del ícono `Marker`.
`mousedown`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa para un mousedown en el `Marker`.
`mouseout`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando el mouse sale del área del ícono `Marker`.
`mouseover`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando el mouse ingresa al área del ícono de `Marker`.
`mouseup`	`function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa para un mouseup en el `Marker`.
`position_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad de posición `Marker`.
`shape_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad de la forma `Marker`.
`title_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad de título `Marker`.
`visible_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad visible `Marker`.
`zindex_changed`	`function()` Argumentos: Ninguno Este evento se activa cuando cambia la propiedad zIndex `Marker`.
`rightclick`	Obsoleto: En su lugar, usa el evento `Marker.contextmenu` para admitir patrones de uso, como Ctrl + clic en macOS. `function(event)` Argumentos: `event`: `MapMouseEvent` Este evento se activa cuando se hace clic con el botón derecho en `Marker`.

MarkerOptions

Interfaz google.maps.MarkerOptions

MarkerOptions que se utiliza para definir las propiedades que se pueden establecer en un Marker.

Propiedades
`anchorPoint optional`	Tipo: `Point optional` El desplazamiento desde la posición del marcador hasta la punta de un objeto InfoWindow que se abrió con el marcador como ancla
`animation optional`	Tipo: `Animation optional` Valor predeterminado: `null` Qué animación se reproduce cuando se agrega un marcador a un mapa.
`clickable optional`	Tipo: `boolean optional` Valor predeterminado: `true` Si es `true`, el marcador recibe eventos táctiles y del mouse.
`collisionBehavior optional`	Obsoleto: `collisionBehavior` dejó de estar disponible a partir de julio de 2023. En su lugar, usa `AdvancedMarkerElement.collisionBehavior`. Aviso: Solo disponible en el canal v=beta. Tipo: `string\|CollisionBehavior optional` Valor predeterminado: `null` Configura un comportamiento de colisión para los marcadores de los mapas de vectores.
`crossOnDrag optional`	Tipo: `boolean optional` Valor predeterminado: `true` Si es `false`, inhabilita la cruz que aparece debajo del marcador cuando se arrastra.
`cursor optional`	Tipo: `string optional` Valor predeterminado: `pointer` Tipo de cursor del mouse que se muestra al colocarlo sobre un elemento.
`draggable optional`	Tipo: `boolean optional` Valor predeterminado: `false` Si es `true`, el marcador se puede arrastrar.
`icon optional`	Tipo: `string\|Icon\|Symbol optional` Ícono para el primer plano. Si se proporciona una string, se la trata como si fuera un `Icon` con la string como `url`.
`label optional`	Tipo: `string\|MarkerLabel optional` Valor predeterminado: `null` Agrega una etiqueta al marcador. Una etiqueta de marcador es una letra o un número que aparecen dentro de un marcador. La etiqueta puede ser una string o un objeto `MarkerLabel`. Si se proporciona, pero no se proporciona un `MarkerOptions.title`, se agregará un texto de accesibilidad (p.ej., para el uso con lectores de pantalla) al marcador con el texto de la etiqueta proporcionada. Ten en cuenta que, actualmente, `label` solo se usa para el texto de accesibilidad de los marcadores no optimizados.
`map optional`	Tipo: `Map\|StreetViewPanorama optional` Mapa en el que se debe mostrar el marcador Se requiere el mapa para mostrar el marcador y se puede proporcionar con `Marker.setMap` si no se proporciona durante la construcción.
`opacity optional`	Tipo: `number optional` Valor predeterminado: 1.0 Un número entre 0.0, transparente y 1.0, opaco.
`optimized optional`	Tipo: `boolean optional` La optimización mejora el rendimiento mediante la renderización de muchos marcadores como un solo elemento estático. Esto resulta útil en los casos en los que se requiere una gran cantidad de marcadores. Obtén más información sobre la optimización de marcadores.
`position optional`	Tipo: `LatLng\|LatLngLiteral optional` Establece la posición del marcador. Se puede construir un marcador, pero no se puede mostrar hasta que se proporcione su posición; por ejemplo, mediante las acciones u opciones del usuario. Se puede proporcionar una posición del marcador con `Marker.setPosition` si no se proporciona durante la construcción
`shape optional`	Tipo: `MarkerShape optional` Definición de región del mapa de imágenes utilizada para arrastrar y hacer clic.
`title optional`	Tipo: `string optional` Valor predeterminado: `undefined` texto de sustitución. Si se proporciona, se agregará un texto de accesibilidad (p.ej., para el uso con lectores de pantalla) al marcador con el valor proporcionado. Ten en cuenta que, actualmente, `title` solo se usa para el texto de accesibilidad de los marcadores no optimizados.
`visible optional`	Tipo: `boolean optional` Valor predeterminado: `true` Si es `true`, el marcador es visible.
`zIndex optional`	Tipo: `number optional` Todos los marcadores se muestran en el mapa en el orden de su zIndex, y los valores más altos se muestran frente a los marcadores con valores más bajos. De forma predeterminada, los marcadores se muestran según su posición vertical en la pantalla, y los marcadores inferiores aparecen delante de los que están más arriba en la pantalla.

Constantes CollisionBehavior

Constantes google.maps.CollisionBehavior

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

Constantes
`OPTIONAL_AND_HIDES_LOWER_PRIORITY`	Muestra el marcador solo si no se superpone con otros. Si dos marcadores de este tipo se superponen, se muestra el que tenga el valor zIndex más alto. Si tienen el mismo zIndex, se muestra el que tenga la posición vertical más baja en la pantalla.
`REQUIRED`	Indicar siempre el marcador independientemente de la colisión. Este es el comportamiento predeterminado.
`REQUIRED_AND_HIDES_OPTIONAL`	Muestra siempre el marcador independientemente de la colisión y oculta los marcadores o etiquetas OPTIONAL_AND_HIDES_LOWER_PRIORITY que se superpongan con él.

Icon.

Interfaz google.maps.Icon

Estructura que representa una imagen del ícono de marcador

Propiedades
`url`	Tipo: `string` La URL de la hoja de imágenes o de objetos.
`anchor optional`	Tipo: `Point optional` Es la posición en la que se debe anclar una imagen en correspondencia con la ubicación del marcador en el mapa. De forma predeterminada, el ancla se ubica en el punto central de la parte inferior de la imagen.
`labelOrigin optional`	Tipo: `Point optional` El origen de la etiqueta en relación con la esquina superior izquierda de la imagen del ícono, si el marcador proporciona una etiqueta. De forma predeterminada, el origen se encuentra en el punto central de la imagen.
`origin optional`	Tipo: `Point optional` Es la posición de la imagen dentro de un objeto, si corresponde. De forma predeterminada, el origen se encuentra en la esquina superior izquierda de la imagen `(0, 0)`.
`scaledSize optional`	Tipo: `Size optional` Tamaño de toda la imagen después del escalamiento, si corresponde. Usa esta propiedad para estirar o reducir una imagen o un objeto.
`size optional`	Tipo: `Size optional` Es el tamaño de visualización del objeto o la imagen. Cuando usas objetos, debes especificar su tamaño. Si no se proporciona el tamaño, se establecerá cuando se cargue la imagen.

Estas opciones especifican la apariencia de una etiqueta de marcador. Una etiqueta de marcador es una cadena (generalmente un carácter único) que aparece dentro del marcador. Si lo usas con un marcador personalizado, puedes cambiar su posición con la propiedad labelOrigin en la clase Icon.

Propiedades
`text`	Tipo: `string` El texto que se mostrará en la etiqueta.
`className optional`	Tipo: `string optional` Valor predeterminado: `''` (string vacía) La propiedad className del elemento de la etiqueta (equivalente al atributo de clase del elemento). Se pueden agregar varias clases de CSS separadas por espacios. El color, el tamaño, el grosor y la familia de la fuente solo se pueden configurar con las otras propiedades de `MarkerLabel`. No se deben usar clases de CSS para cambiar la posición ni la orientación de la etiqueta (p.ej., mediante traslaciones y rotaciones) si también se utiliza la administración de colisiones de marcadores.
`color optional`	Tipo: `string optional` Valor predeterminado: `'black'` El color del texto de la etiqueta
`fontFamily optional`	Tipo: `string optional` La familia de fuentes del texto de la etiqueta (equivalente a la propiedad de familia de fuentes de CSS).
`fontSize optional`	Tipo: `string optional` Valor predeterminado: `'14px'` El tamaño de fuente del texto de la etiqueta (equivalente a la propiedad de tamaño de fuente de CSS).
`fontWeight optional`	Tipo: `string optional` El grosor de la fuente del texto de la etiqueta (equivalente a la propiedad de grosor de fuente de CSS).

MarkerShape

Interfaz google.maps.MarkerShape

Este objeto define la región de la imagen de un marcador en la que se puede hacer clic. La forma consta de dos propiedades, type y coord, que definen la región no transparente de una imagen.

Propiedades
`coords`	Tipo: `Array<number>` El formato de este atributo depende del valor de `type` y sigue la especificación `coords` del ÁREA de w3 que se encuentra en http://www.w3.org/TR/REC-html40/struct/objects.html#adef-coords. El atributo `coords` es un array de números enteros que especifican la posición en píxeles de la forma en relación con la esquina superior izquierda de la imagen de destino. Las coordenadas dependen del valor de `type` de la siguiente manera: - `circle`: las coordenadas son `[x1,y1,r]`,donde x1, y2 son las coordenadas del centro del círculo y r es el radio del círculo. - `poly`: Coordenadas es `[x1,y1,x2,y2...xn,yn]`, donde cada par x,y contiene las coordenadas de un vértice del polígono. - `rect`: Las coordenadas son `[x1,y1,x2,y2]`, donde x1,y1 son las coordenadas de la esquina superior izquierda del rectángulo y x2,y2 son las coordenadas de la esquina inferior derecha del rectángulo.
`type`	Tipo: `string` Describe el tipo de forma, que puede ser `circle`, `poly` o `rect`.

Propiedades

coords

Tipo: Array<number>

El formato de este atributo depende del valor de type y sigue la especificación coords del ÁREA de w3 que se encuentra en http://www.w3.org/TR/REC-html40/struct/objects.html#adef-coords.
El atributo coords es un array de números enteros que especifican la posición en píxeles de la forma en relación con la esquina superior izquierda de la imagen de destino. Las coordenadas dependen del valor de type de la siguiente manera:
- circle: las coordenadas son [x1,y1,r],donde x1, y2 son las coordenadas del centro del círculo y r es el radio del círculo.
- poly: Coordenadas es [x1,y1,x2,y2...xn,yn], donde cada par x,y contiene las coordenadas de un vértice del polígono.
- rect: Las coordenadas son [x1,y1,x2,y2], donde x1,y1 son las coordenadas de la esquina superior izquierda del rectángulo y x2,y2 son las coordenadas de la esquina inferior derecha del rectángulo.

type

Tipo: string

Describe el tipo de forma, que puede ser circle, poly o rect.

Symbol.

Interfaz google.maps.Symbol

Describe un símbolo, que consiste en una ruta vectorial con estilo. Se puede usar un símbolo como ícono de un marcador o se puede colocar en una polilínea.

Propiedades
`path`	Tipo: `SymbolPath\|string` La ruta del símbolo, que es una ruta de acceso de símbolos integrada o una ruta personalizada expresada con la notación de ruta de acceso SVG. Obligatorio.
`anchor optional`	Tipo: `Point optional` Valor predeterminado: `google.maps.Point(0,0)` Es la posición del símbolo en relación con el marcador o la polilínea. Las coordenadas del trazado del símbolo se traducen a la izquierda y hacia arriba a través de las coordenadas x e y del anclaje, respectivamente. La posición se expresa en el mismo sistema de coordenadas que la ruta del símbolo.
`fillColor optional`	Tipo: `string optional` Color de relleno del símbolo. Se admiten todos los colores CSS3, salvo aquellos con nombres extendidos. En el caso de los símbolos de marcadores, el valor predeterminado es negro. En el caso de los símbolos de polilíneas, el valor predeterminado es el color del trazo de la polilínea correspondiente.
`fillOpacity optional`	Tipo: `number optional` Valor predeterminado: `0` La opacidad de relleno del símbolo.
`labelOrigin optional`	Tipo: `Point optional` Valor predeterminado: `google.maps.Point(0,0)` El origen de la etiqueta en relación con el origen de la ruta, si el marcador proporciona la etiqueta. El origen se expresa en el mismo sistema de coordenadas que la ruta del símbolo. Esta propiedad no se usa para símbolos en polilíneas.
`rotation optional`	Tipo: `number optional` Valor predeterminado: `0` Es el ángulo de rotación del símbolo, expresado en grados en el sentido de las manecillas del reloj. Un símbolo en una `IconSequence`, donde `fixedRotation` es `false`, se rota en relación con el ángulo del borde en el que se encuentra.
`scale optional`	Tipo: `number optional` Es la escala de tamaño del símbolo. En el caso de los símbolos de marcadores, el valor predeterminado es 1; después del escalamiento, el símbolo puede ser de cualquier tamaño. En el caso de los símbolos de una polilínea, de forma predeterminada se establece el grosor del trazo de la polilínea. Después del ajuste, el símbolo debe caber dentro de un cuadrado de 22 píxeles centrado en el anclaje correspondiente.
`strokeColor optional`	Tipo: `string optional` El color del trazo del símbolo. Se admiten todos los colores CSS3, salvo aquellos con nombres extendidos. En el caso de los símbolos de marcadores, el valor predeterminado es negro. En el caso de los símbolos de una polilínea, el color predeterminado es el color del trazo de la polilínea.
`strokeOpacity optional`	Tipo: `number optional` La opacidad del trazo del símbolo. En el caso de los símbolos de marcadores, el valor predeterminado es 1. En el caso de los símbolos de una polilínea, el valor predeterminado es la opacidad del trazo de la polilínea.
`strokeWeight optional`	Tipo: `number optional` Predeterminado: La `Symbol.scale` del símbolo. El grosor del trazo del símbolo.

Constantes SymbolPath

Constantes google.maps.SymbolPath

Rutas de símbolos integradas.

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

Constantes
`BACKWARD_CLOSED_ARROW`	Una flecha cerrada que apunta hacia atrás
`BACKWARD_OPEN_ARROW`	Una flecha abierta que apunta hacia atrás
`CIRCLE`	Un círculo
`FORWARD_CLOSED_ARROW`	Una flecha cerrada que apunta hacia delante
`FORWARD_OPEN_ARROW`	Una flecha abierta que apunta hacia delante

Constantes de animación

Constantes google.maps.Animation

Animaciones que se pueden reproducir en un marcador Usa el método Marker.setAnimation en Marker o la opción MarkerOptions.animation para reproducir una animación.

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

Constantes
`BOUNCE`	El marcador rebota hasta que se detiene la animación llamando a `Marker.setAnimation` con `null`.
`DROP`	El marcador se coloca desde la parte superior del mapa hasta su ubicación final. La animación finalizará una vez que el marcador esté en su posición, y `Marker.getAnimation` mostrará `null`. Por lo general, este tipo de animación se especifica durante la creación del marcador.

Marker

Marker

Constructor

Constantes

Métodos

Eventos

MarkerOptions

Propiedades

Constantes CollisionBehavior

Constantes

Icon.

Propiedades

MarkerLabel

Propiedades

MarkerShape

Propiedades

Symbol.

Propiedades

Constantes SymbolPath

Constantes

Constantes de animación

Constantes