Map@knitui/map
Styles
The package ships nine vendored MapLibre basemap styles as JSON. Each is a complete, keyless StyleSpecification that you hand to the map's mapStyle prop. The gallery below shows the same camera under every bundled style; the final story lets you switch between them with a Storybook control.
import { Map } from "@knitui/map";Playground
Loading playground…
<Map
mapStyle={asStyle(voyagerStyle)}
/>Examples
Voyager
Carto Voyager — a balanced, colourful basemap.
Loading example…
Positron
Carto Positron — a light, low-contrast basemap good for overlays.
Loading example…
Dark Matter
Carto Dark Matter — a dark counterpart to Positron.
Loading example…
Klokantech Basic
Klokantech Basic — a plain street-level reference basemap.
Loading example…
Osm Liberty
OSM Liberty — a vivid OpenStreetMap-derived street style.
Loading example…
Osm Liberty Custom
A customised variant of OSM Liberty.
Loading example…
Yoda Light
Yoda Light — a soft, light themed basemap.
Loading example…
Yoda Dark
Yoda Dark — a dark themed basemap.
Loading example…
Zoomstack Night
OS Zoomstack Night — a dark, night-oriented basemap.
Loading example…
Style Switcher
Switch the active basemap with the mapStyle select control in the Controls panel. Each option maps to one of the nine bundled styles.
Loading example…
Props
Prop extraction did not resolve this component. Run pnpm docs:generate, or add an override in apps/docs/content/overrides/.