Marker

Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Marker

Clase google.maps.Marker

Esta clase extiende MVCObject.

Marker
Marker([opts])
Parámetros:
Crea un marcador con las opciones especificadas. Si se especifica un mapa, el marcador se agrega al mapa en el momento de la construcción. Ten en cuenta que se debe establecer la posición para que se muestre el marcador.
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 del 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 desplaza el cursor.
getDraggable
getDraggable()
Parámetros: ninguno
Valor que se muestra: boolean si el marcador es arrastrable.
Obtén el estado arrastrable de Marker.
getIcon
getIcon()
Parámetros: ninguno
Valor que se muestra: string|Icon|null|Symbol|undefined
Obtén el ícono de Marker. Consulta los MarkerOptions.icon.
getLabel
getLabel()
Parámetros: ninguno
Valor que se muestra: MarkerLabel|null|string|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 el 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 si el marcador es visible.
Obtén la visibilidad de Marker.
getZIndex
getZIndex()
Parámetros: ninguno
Valor que se muestra: number|null|undefinedÍndice z del Marcador.
Obtén el zIndex de Marker. Consulta los MarkerOptions.zIndex.
setAnimation
setAnimation([animation])
Parámetros:
  • animationAnimation optional La animación que se reproducirá.
Valor que se muestra: Ninguno
Inicia una animación. Se cancelarán todas las animaciones en curso. Actualmente, se admiten las animaciones Animation.BOUNCE, Animation.DROP. Si pasas null, se detendrá cualquier animación.
setClickable
setClickable(flag)
Parámetros:
  • flagboolean Si 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 cuando se desplaza el cursor.
setDraggable
setDraggable(flag)
Parámetros:
  • flagboolean optional Si es true, se puede arrastrar el marcador.
Valor que se muestra: Ninguno
Se establece si Marker es arrastrable.
setIcon
setIcon([icon])
Parámetros:
Valor que se muestra: Ninguno
Establece el ícono para Marker. Consulta los MarkerOptions.icon.
setLabel
setLabel([label])
Parámetros:
Valor que se muestra: Ninguno
Configura la etiqueta para Marker. Consulta los MarkerOptions.label.
setMap
setMap(map)
Parámetros:
Valor que se muestra: Ninguno
Procesa 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 Un número entre 0.0, transparente y 1.0, opaco.
Valor que se muestra: Ninguno
Configura la opacidad de Marker.
setOptions
setOptions(options)
Parámetros:
Valor que se muestra: Ninguno
Establece las opciones para Marker.
setPosition
setPosition([latlng])
Parámetros:
Valor que se muestra: Ninguno
Establece la posición para Marker.
setShape
setShape([shape])
Parámetros:
Valor que se muestra: Ninguno
Configura la forma de Marker que se usa para la interacción. Consulta MarkerOptions.shape y MarkerShape.
setTitle
setTitle([title])
Parámetros:
  • titlestring optional
Valor que se muestra: Ninguno
Establece el título de la información sobre la herramienta de Marker. Consulta los MarkerOptions.title.
setVisible
setVisible(visible)
Parámetros:
  • visibleboolean Si 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
Configura el zIndex de Marker. Consulta los MarkerOptions.zIndex.
Heredada: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
MAX_ZINDEX El índice Z máximo predeterminado que la API asignará a un marcador. Puedes configurar un índice Z superior para colocar un marcador en la parte delantera.
animation_changed
function()
Argumentos: ninguno
Este evento se activa cuando cambia la propiedad de animación Marker.
click
function(event)
Argumentos:
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 Marker en la que se puede hacer clic.
contextmenu
function(event)
Argumentos:
Este evento se activa cuando se activa el evento de menú contextual DOM en Marker.
cursor_changed
function()
Argumentos: ninguno
Este evento se activa cuando cambia la propiedad del cursor Marker.
dblclick
function(event)
Argumentos:
Este evento se activa cuando se hace doble clic en el ícono Marker.
drag
function(event)
Argumentos:
Este evento se activa varias veces mientras el usuario arrastra el Marker.
dragend
function(event)
Argumentos:
Este evento se activa cuando el usuario deja de arrastrar la Marker.
draggable_changed
function()
Argumentos: ninguno
Este evento se activa cuando cambia la propiedad arrastrable Marker.
dragstart
function(event)
Argumentos:
Este evento se activa cuando el usuario comienza a arrastrar la 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 de Marker.
mousedown
function(event)
Argumentos:
Este evento se activa cuando se desactiva el mouse sobre el Marker.
mouseout
function(event)
Argumentos:
Este evento se activa cuando el mouse abandona el área del ícono de Marker.
mouseover
function(event)
Argumentos:
Este evento se activa cuando el mouse ingresa al área del ícono Marker.
mouseup
function(event)
Argumentos:
Este evento se activa para un mouseup sobre 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 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 de Marker.
zindex_changed
function()
Argumentos: ninguno
Este evento se activa cuando cambia la propiedad zIndex Marker.
rightclick
function(event)
Argumentos:
Este evento se activa cuando se hace clic con el botón derecho en la Marker.

MarkerOptions

Interfaz google.maps.MarkerOptions

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

anchorPoint optional
Tipo: Point optional
Desplazamiento de la posición del marcador a la punta de una ventana de información abierta con el marcador como ancla
animation optional
Tipo: Animation optional
Predeterminado: null
Qué animación reproducir cuando se agrega el marcador a un mapa
clickable optional
Tipo: boolean optional
Predeterminado: true
Si es true, el marcador recibe eventos táctiles y del mouse.
BetacollisionBehavior optional
Tipo: string|CollisionBehavior optional
Predeterminado: null
Establece un comportamiento de colisión para los marcadores de mapas vectoriales.
crossOnDrag optional
Tipo: boolean optional
Predeterminado: true
Si el valor es false, inhabilita la cruz que aparece debajo del marcador cuando se arrastra.
cursor optional
Tipo: string optional
Predeterminado: pointer
Tipo de cursor del mouse que se muestra cuando se coloca el cursor sobre un elemento.
draggable optional
Tipo: boolean optional
Predeterminado: false
Si es true, se puede arrastrar el marcador.
icon optional
Tipo: string|Icon|Symbol optional
Ícono de primer plano. Si se proporciona una string, se trata como si fuera un Icon con la string como url.
label optional
Tipo: string|MarkerLabel optional
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 MarkerOptions.title y no se proporciona, se agregará un texto de accesibilidad (p.ej., para usar con lectores de pantalla) al marcador con el texto de la etiqueta proporcionada. Ten en cuenta que actualmente label solo se usa como texto de accesibilidad para marcadores no optimizados.
map optional
Tipo: Map|StreetViewPanorama optional
Mapa en el que se muestra el marcador El mapa es necesario para mostrar el marcador y se puede proporcionar con Marker.setMap si no se proporciona en la construcción del marcador.
opacity optional
Tipo: number optional
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 al representar muchos marcadores como un único 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. Un marcador se puede construir, pero no se muestra hasta que se proporciona su posición, por ejemplo, mediante las acciones o las elecciones de un usuario. Se puede proporcionar una posición del marcador con Marker.setPosition si no se proporciona en la construcción del marcador.
shape optional
Tipo: MarkerShape optional
Definición de región del mapa de imágenes utilizada para arrastrar/hacer clic.
title optional
Tipo: string optional
Predeterminado: undefined
texto de sustitución. Si se proporciona, se agregará un texto de accesibilidad (p.ej., para usar con lectores de pantalla) al marcador con el valor proporcionado. Ten en cuenta que actualmente title solo se usa como texto de accesibilidad para marcadores no optimizados.
visible optional
Tipo: boolean optional
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 valor zIndex, y los valores más altos se muestran delante de 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 más bajos aparecen delante de otros marcadores más arriba de la pantalla.

Constantes de CollisionBehavior

google.maps.CollisionBehavior constantes

OPTIONAL_AND_HIDES_LOWER_PRIORITY Mostrar el marcador solo si no se superpone con otros marcadores. Si se superpusieran dos marcadores de este tipo, se muestra el que tiene el índice z más alto. Si tienen el mismo zIndex, se muestra el que tiene la posición vertical inferior de la pantalla.
REQUIRED Mostrar siempre el marcador independientemente de la colisión. Este es el comportamiento predeterminado.
REQUIRED_AND_HIDES_OPTIONAL Mostrar siempre el marcador independientemente de la colisión y ocultar los marcadores OPTIONAL_AND_HIDES_LOWER_PRIORITY o las etiquetas que se superpone con el marcador.

Icon (Interfaz)

Interfaz google.maps.Icon

Estructura que representa una imagen del ícono de marcador

url
Tipo: string
La URL de la imagen o la hoja del sprite.
anchor optional
Tipo: Point optional
Posición en la que se va a anclar una imagen en correspondencia con la ubicación del marcador en el mapa. De forma predeterminada, el ancla se encuentra 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 suministra una etiqueta. De forma predeterminada, el origen se encuentra en el punto central de la imagen.
origin optional
Tipo: Point optional
Posición de la imagen dentro de un sprite, si la hubiera. De forma predeterminada, el origen se encuentra en la esquina superior izquierda de la imagen (0, 0).
scaledSize optional
Tipo: Size optional
El tamaño de toda la imagen después del escalamiento, si corresponde. Usa esta propiedad para estirar o contraer una imagen o un sprite.
size optional
Tipo: Size optional
El tamaño de visualización del objeto o la imagen. Cuando usas sprites, debes especificar el tamaño del sprite. Si no se proporciona el tamaño, se establecerá cuando se cargue la imagen.

MarkerLabel

Interfaz google.maps.MarkerLabel

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

text
Tipo: string
El texto que se mostrará en la etiqueta
className optional
Tipo: string optional
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 pueden establecerse mediante las otras propiedades de MarkerLabel. Las clases de CSS no deben usarse para cambiar la posición ni la orientación de la etiqueta (p.ej., mediante traducciones y rotaciones) si también usan la administración de colisiones de marcadores.
color optional
Tipo: string optional
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
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 fuente del texto de la etiqueta (equivalente a la propiedad de grosor de la fuente de CSS)

MarkerShape.

Interfaz google.maps.MarkerShape

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

coords
Tipo: Array<number>
El formato de este atributo depende del valor de type y sigue la especificación w3 del área coords 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 especifica la posición de píxeles de la forma en relación con la esquina superior izquierda de la imagen objetivo. 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: Coords es [x1,y1,x2,y2...xn,yn], donde cada par x,y contiene las coordenadas de un vértice del polígono.
- rect: Coords es [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 las coordenadas inferior derecha del rectángulo.
type
Tipo: string
Describe el tipo de forma y puede ser circle, poly o rect.

Symbol.

Interfaz google.maps.Symbol

Describe un símbolo, que consiste en un trazado vectorial con estilo. Un símbolo se puede utilizar como el ícono de un marcador o colocarse en una polilínea.

path
Tipo: SymbolPath|string
La ruta del símbolo, que es una ruta de acceso integrada o una ruta personalizada expresada con la notación de ruta SVG. Obligatorio.
anchor optional
Tipo: Point optional
Predeterminado: google.maps.Point(0,0)
Posición del símbolo en relación con el marcador o la polilínea. Las coordenadas del trazado del símbolo se traducen hacia la izquierda y hacia arriba según las coordenadas x e y del ancla respectivamente. La posición se expresa en el mismo sistema de coordenadas que el trazado del símbolo.
fillColor optional
Tipo: string optional
El color de relleno del símbolo. Se admiten todos los colores CSS3, salvo aquellos con nombres extendidos. Para los marcadores de símbolos, la configuración predeterminada es “black”. En el caso de los símbolos de las polilíneas, el valor predeterminado es el color de trazo de la polilínea correspondiente.
fillOpacity optional
Tipo: number optional
Predeterminado: 0
La opacidad del relleno del símbolo.
labelOrigin optional
Tipo: Point optional
Predeterminado: google.maps.Point(0,0)
El origen de la etiqueta en relación con el origen de la ruta, si el marcador suministra la etiqueta. El origen se expresa en el mismo sistema de coordenadas que el trazado del símbolo. Esta propiedad no se usa para los símbolos de polilíneas.
rotation optional
Tipo: number optional
Predeterminado: 0
Ángulo que se utiliza para rotar el símbolo, expresado en grados en sentido horario. Un símbolo en una IconSequence en el que fixedRotation es false se rota en relación con el ángulo en el que se encuentra.
scale optional
Tipo: number optional
La cantidad en la que se ajusta el tamaño del símbolo. En el caso de los marcadores de símbolos, 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, el valor predeterminado es el grosor de trazo de la polilínea. Después del escalamiento, el símbolo debe encontrarse dentro de un cuadrado de 22 píxeles de tamaño centrado en el anclaje del símbolo.
strokeColor optional
Tipo: string optional
El color de trazo del símbolo. Se admiten todos los colores CSS3, salvo aquellos con nombres extendidos. Para los marcadores de símbolos, la configuración predeterminada es “black”. En el caso de los símbolos de una polilínea, el valor predeterminado es el color de trazo de la polilínea.
strokeOpacity optional
Tipo: number optional
La opacidad de trazo del símbolo. Para los marcadores de símbolos, la configuración predeterminada es 1. En el caso de los símbolos de una polilínea, el valor predeterminado es la opacidad de trazo de la polilínea.
strokeWeight optional
Tipo: number optional
Predeterminado: El Symbol.scale del símbolo.
El peso de trazo del símbolo.

SymbolPath

google.maps.SymbolPath constantes

Rutas de símbolos integradas.

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 adelante.
FORWARD_OPEN_ARROW Una flecha abierta que apunta hacia delante

Constantes de animación

google.maps.Animation constantes

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

BOUNCE El marcador rebota hasta que se detiene la animación llamando a Marker.setAnimation con null.
DROP El marcador cae desde la parte superior del mapa hasta su ubicación final. La animación cesará una vez que el marcador se encuentre en reposo y Marker.getAnimation mostrará null. Este tipo de animación generalmente se especifica durante la creación del marcador.