Type Alias MarkerOptions

The Marker options object

type MarkerOptions = {
    anchor?: PositionAnchor;
    className?: string;
    clickTolerance?: number;
    color?: string;
    draggable?: boolean;
    element?: HTMLElement;
    offset?: PointLike;
    opacity?: string | number;
    opacityWhenCovered?: string | number;
    pitchAlignment?: Alignment;
    rotation?: number;
    rotationAlignment?: Alignment;
    scale?: number;
    subpixelPositioning?: boolean;
}
Index

Properties

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'.

'center'
className?: string

Space-separated CSS class names to add to marker element.

clickTolerance?: number

The max number of pixels a user can shift the mouse pointer during a click on the marker for it to be considered a valid click (as opposed to a marker drag). The default is to inherit map's clickTolerance.

0
color?: string

The color to use for the default marker if options.element is not provided. The default is light blue.

'#3FB1CE'
draggable?: boolean

A boolean indicating whether or not a marker is able to be dragged to a new position on the map.

false
element?: HTMLElement

DOM element to use as a marker. The default is a light blue, droplet-shaped SVG marker.

offset?: PointLike

The offset in pixels as a PointLike object to apply relative to the element's center. Negatives indicate left and up.

opacity?: string | number

Marker's opacity when it's in clear view (not behind 3d terrain) Accepts any valid CSS opacity value as a number or string.

1
opacityWhenCovered?: string | number

Marker's opacity when it's behind 3d terrain Accepts any valid CSS opacity value as a number or string.

0.2
pitchAlignment?: Alignment

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.

'auto'
rotation?: number

The rotation angle of the marker in degrees, relative to its respective rotationAlignment setting. A positive value will rotate the marker clockwise.

0
rotationAlignment?: Alignment

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.

'auto'
scale?: number

The scale to use for the default marker if options.element is not provided. The default scale corresponds to a height of 41px and a width of 27px.

1
subpixelPositioning?: boolean

If true, rounding is disabled for placement of the marker, allowing for subpixel positioning and smoother movement when the marker is translated.

false
Was this helpful?