---
title: "MarkerOptions | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Type Alias MarkerOptions

The [Marker](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Marker/) options object

type MarkerOptions \= {  
    [anchor](#anchor)?: [PositionAnchor](https://docs.maptiler.com/sdk-js/api-reference/types/PositionAnchor/);  
    [className](#classname)?: string;  
    [clickTolerance](#clicktolerance)?: number;  
    [color](#color)?: string;  
    [draggable](#draggable)?: boolean;  
    [element](#element)?: [HTMLElement](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.HTMLElement/);  
    [offset](#offset)?: [PointLike](https://docs.maptiler.com/sdk-js/api-reference/types/PointLike/);  
    [opacity](#opacity)?: string | number;  
    [opacityWhenCovered](#opacitywhencovered)?: string | number;  
    [pitchAlignment](#pitchalignment)?: [Alignment](https://docs.maptiler.com/sdk-js/api-reference/types/Alignment/);  
    [rotation](#rotation)?: number;  
    [rotationAlignment](#rotationalignment)?: [Alignment](https://docs.maptiler.com/sdk-js/api-reference/types/Alignment/);  
    [scale](#scale)?: number;  
    [subpixelPositioning](#subpixelpositioning)?: boolean;  
}

##### Index

### Properties[](#properties)

[anchor?](#anchor) [className?](#classname) [clickTolerance?](#clicktolerance) [color?](#color) [draggable?](#draggable) [element?](#element) [offset?](#offset) [opacity?](#opacity) [opacityWhenCovered?](#opacitywhencovered) [pitchAlignment?](#pitchalignment) [rotation?](#rotation) [rotationAlignment?](#rotationalignment) [scale?](#scale) [subpixelPositioning?](#subpixelpositioning)

## Properties[](#properties-1)

### `Optional`anchor[](#anchor)

anchor?: [PositionAnchor](https://docs.maptiler.com/sdk-js/api-reference/types/PositionAnchor/)

A string indicating the part of the Marker that should be positioned closest to the coordinate set via [Marker.setLngLat](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Marker/#setlnglat). Options are `'center'`, `'top'`, `'bottom'`, `'left'`, `'right'`, `'top-left'`, `'top-right'`, `'bottom-left'`, and `'bottom-right'`.

#### Default Value[](#default-value)

```typescript
'center'
```

### `Optional`className[](#classname)

className?: string

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

### `Optional`clickTolerance[](#clicktolerance)

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.

#### Default Value[](#default-value-1)

```typescript
0
```

### `Optional`color[](#color)

color?: string

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

#### Default Value[](#default-value-2)

```typescript
'#3FB1CE'
```

### `Optional`draggable[](#draggable)

draggable?: boolean

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

#### Default Value[](#default-value-3)

```typescript
false
```

### `Optional`element[](#element)

element?: [HTMLElement](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.HTMLElement/)

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

### `Optional`offset[](#offset)

offset?: [PointLike](https://docs.maptiler.com/sdk-js/api-reference/types/PointLike/)

The offset in pixels as a [PointLike](https://docs.maptiler.com/sdk-js/api-reference/types/PointLike/) object to apply relative to the element's center. Negatives indicate left and up.

### `Optional`opacity[](#opacity)

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.

#### Default Value[](#default-value-4)

```typescript
1
```

### `Optional`opacityWhenCovered[](#opacitywhencovered)

opacityWhenCovered?: string | number

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

#### Default Value[](#default-value-5)

```typescript
0.2
```

### `Optional`pitchAlignment[](#pitchalignment)

pitchAlignment?: [Alignment](https://docs.maptiler.com/sdk-js/api-reference/types/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`.

#### Default Value[](#default-value-6)

```typescript
'auto'
```

### `Optional`rotation[](#rotation)

rotation?: number

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

#### Default Value[](#default-value-7)

```typescript
0
```

### `Optional`rotationAlignment[](#rotationalignment)

rotationAlignment?: [Alignment](https://docs.maptiler.com/sdk-js/api-reference/types/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`.

#### Default Value[](#default-value-8)

```typescript
'auto'
```

### `Optional`scale[](#scale)

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

#### Default Value[](#default-value-9)

```typescript
1
```

### `Optional`subpixelPositioning[](#subpixelpositioning)

subpixelPositioning?: boolean

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

#### Default Value[](#default-value-10)

```typescript
false
```