Knit UI
GitHub

Playground

Loading playground…

Playground
<SymbolLayer />

Examples

Text Labels

Plain text labels reading each city's name.

Loading example…

Text LabelsSourceStorybook

Halo Labels

Styled labels with a white halo for legibility over busy areas, offset upward and anchored from the top.

Loading example…

Halo LabelsSourceStorybook

With Icon

An icon registered via <Images> placed at each city, with the name labelled beneath it. iconImage references the sprite by the key it was registered under.

Loading example…

With IconSourceStorybook

Props

PropTypeDefaultDescription
afterIdstring | undefined
beforeIdstring | undefined
filterFilterSpecification | undefined
idstring | undefined
layerIndexnumber | undefined
layoutRecord<string, unknown> | undefined
maxzoomnumber | undefined
minzoomnumber | undefined
paintRecord<string, unknown> | undefined
sourcestring | undefined
source-layerstring | undefined
sourceLayerstring | undefined
styleSymbolLayerStyle | undefined
testIDstring | undefined