Knit UI
GitHub

Playground

Loading playground…

Playground
<FillLayer />

Examples

Basic

A single translucent fill over one polygon.

Loading example…

BasicSourceStorybook

Data Driven

Data-driven: fillColor is interpolated from each region's density, producing a choropleth from pale to deep red.

Loading example…

Data DrivenSourceStorybook

With Outline

A fill with a contrasting outline color to crisply delineate the polygon.

Loading example…

With OutlineSourceStorybook

Styling Variations

Styling variations: a near-solid, high-opacity fill with antialiasing disabled for a flat, poster-like region block.

Loading example…

Styling VariationsSourceStorybook

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
styleFillLayerStyle | undefined
testIDstring | undefined