Maps SDK for Web - Maps.Marker

tt.Marker

Creates a marker component

Constructor

tt.Marker([options])

Example

var marker = new tt.Marker()
.setLngLat([30.5, 50.5])
.addTo(map);

Parameters

Name	Description
options Object \| HTMLElement default:None	Object with options or HTMLElement
element HTMLElement default:None	DOM element to use as a marker.
anchor String default: bottom	A string indicating the part of the Marker that should be positioned closest to the coordinate set via Marker.setLngLat . Options are 'center', 'top', 'bottom', 'left', 'right', 'top-left', 'top-right', 'bottom-left', and 'bottom-right' .
offset Maps.PointLike default:None	The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up.
rotation Number default:0	The rotation angle of the marker in degrees, relative to its respective `rotationAlignment` setting. A positive value will rotate the marker clockwise.
pitchAlignment String default:'auto'	`map` aligns the Marker to the plane of the map. `viewport` aligns the `Marker` to the plane of the viewport. `auto` automatically matches the value of `rotationAlignment`.
rotationAlignment String default:'auto'	`map` aligns the Marker's rotation relative to the map, maintaining a bearing as the map rotates. `viewport` aligns the Marker's rotation relative to the viewport, agnostic to map rotations. `auto` is equivalent to `viewport`.
color String default: #000000	The color to use for the default marker if options.element is not provided.
width String default: 30	The width of the default marker if options.element is not provided.
height String default: 36	The height of the default marker if options.element is not provided.
draggable Boolean default:None	A boolean indicating whether or not a marker is able to be dragged to a new position on the map.

Methods

addTo(map): Maps.Marker

Attaches the marker to a map

Parameters

Name	Description
map Required Map default:None	Instance of a map

Returns

Marker this

getElement( ): HTMLElement

Returns the Marker's HTML element.

Returns

HTMLElement element

getLngLat( ): Maps.LngLat

Get the marker's geographical location. The longitude of the result may differ by a multiple of 360 degrees from the longitude previously set by setLngLat because Marker wraps the anchor longitude across copies of the world to keep the marker on screen.

Returns

LngLat

getOffset( ): Maps.Point

Get the marker's offset.

Returns

Point

getPopup( ): Maps.Popup

Returns the Popup instance that is bound to the Marker

Returns

Popup popup

isDraggable( ): Boolean

Returns true if the marker can be dragged

Returns

Boolean

off(type, listener): Object

Removes a previously registered event listener.

Parameters

Name	Description
type Required String default:None	The event type to remove listeners.
listener Required Function default:None	The listener function to remove.

Returns

Object this

on(type, listener): Object

Adds a listener to a specified event type.

Parameters

Name	Description
type Required String default:None	The event type to add a listen for.
listener Required Function default:None	The function to be called when the event is fired. The listener function is called with the data object passed to fire, extended with the target and type properties.

Returns

Object this

once(type, listener): Object

Adds a listener that will be called only once to a specified event type. The listener will be called the first time the event fires after the listener is registered.

Parameters

Name	Description
type Required String default:None	The event type to listen for.
listener Required Function default:None	The function to be called when the event is fired the first time.

Returns

Object this

remove( ): Maps.Marker

Removes the marker from a map

Returns

Marker this

setDraggable([shouldBeDraggable=false]): Maps.Marker

Sets the draggable property and functionality of the marker

Parameters

Name	Description
shouldBeDraggable Boolean default:false	Turns drag functionality on/off

Returns

Marker this

setLngLat(lnglat): Maps.Marker

Set the marker's geographical position and move it.

Parameters

Name	Description
lnglat Required Maps.LngLat default:None

Returns

Marker this

setOffset(offset): Maps.Marker

Sets the offset of the marker

Parameters

Name	Description
offset Required Maps.PontLike default:None	The offset in pixels as a Point object to apply relative to the element's center. Negatives indicate left and up.