Map marker. Overview

Usage

Map markers identify points of interest. Selecting a marker can show additional information, when available. Markers can be grouped into clusters that users can expand step by step by selecting them or zooming in.

Rules

  • Markers may overlap, but must remain selectable at high zoom levels. Alternatively, group multiple markers into clusters.
  • Selecting a marker centres the map on it.
Variants

States

The component has the following states:

  • Default
  • Hover
  • Active
  • Clustered

Variants

Neutral

Neutral map marker
Neutral map marker

Icon

Default colour
Map marker with a default-colour icon
Map marker with a default-colour icon
Blue
Map marker with a blue icon
Map marker with a blue icon

Pictogram

Default colour
Map marker with a default-colour pictogram
Map marker with a default-colour pictogram
Blue
Map marker with a blue pictogram
Map marker with a blue pictogram

Alert

Alert map marker
Alert map marker

Point of interest

Point-of-interest map marker
Point-of-interest map marker