Loading map...

Props

Prop	Type	Default	Description
`className`	`string`	`''`	Additional CSS classes to apply to the running map card
`distance`	`string`	`'5.2 km'`	The distance of the running route
`duration`	`string`	`'32:15'`	The duration of the running route
`pace`	`string`	`'6:12/km'`	The pace of the running route
`title`	`string`	`'Morning Run'`	The title of the running route
`animate`	`boolean`	`true`	Whether to animate the route drawing
`animationDuration`	`number`	`3000`	Animation duration in milliseconds
`height`	`string \| number`	`'400px'`	Height of the map container
`width`	`string \| number`	`'100%'`	Width of the map container
`center`	`[number, number]`	`[53.34, -6.265]`	Map center coordinates [latitude, longitude]
`zoom`	`number`	`13`	Map zoom level
`polyline`	`[number, number][]`	`defaultPolyline`	Custom route coordinates array
`showStats`	`boolean`	`true`	Show or hide the stats panel
`statsPosition`	`'bottom' \| 'top' \| 'left' \| 'right'`	`'bottom'`	Position of the stats panel
`theme`	`'light' \| 'dark'`	`'light'`	Map theme (light or dark)
`tileLayer`	`string`	`undefined`	Custom tile layer URL (overrides theme)
`routeColor`	`string`	`'#6e7af2'`	Color of the route line
`routeWeight`	`number`	`8`	Thickness of the route line
`routeOpacity`	`number`	`0.6`	Opacity of the route line (0-1)
`glowColor`	`string`	`'#6e7af2'`	Color of the route glow effect
`glowWeight`	`number`	`16`	Thickness of the glow effect
`glowOpacity`	`number`	`0.2`	Opacity of the glow effect (0-1)

Running Map