Components/Charts/WorldMarkerMap

WorldMarkerMap

Charts

Labelled point markers with hover-card metrics on a world map.

Labelled marker layer with optional pulse halos and hover cards showing a headline metric + secondary line. Useful for infrastructure maps, event locations, or office networks.

Import

import { WorldMarkerMap } from "nosible-ux"

Examples

Earthquakes — magnitude ≥ 6.0

Office locations

Accessibility

Each marker renders as a focusable point; hover-card content is reflected in the accessible name. Pulse animation respects prefers-reduced-motion. Provide aria-label summarising the dataset.

Props

Name TypeDefaultDescription
aria-label
string | undefinedDefines a string value that labels the current element.
height
number | undefined
markers
MarkerDatum[]
projection
WorldProjectionKind | undefined
radius
number | undefinedMarker radius in px. Default: `5`.
width
number | undefined
withPulse
boolean | undefinedPulse halo around every marker. Default: `true`.