Layers@knitui/map
Heatmap Layer
HeatmapLayer renders point density as a smooth, color-graded surface. heatmapWeight weights individual points, heatmapRadius controls the blur kernel, heatmapIntensity scales the overall signal, and heatmapColor maps the heatmap-density ramp (0 → 1) to colors. It must live inside a source and reference it via source.
WebiOSAndroidnative split14 own props3 examples
import { HeatmapLayer } from "@knitui/map";Playground
Loading playground…
<HeatmapLayer />Examples
Density
A density heatmap from ~400 scattered points around Berlin.
Loading example…
Radius And Intensity
Larger radius and higher intensity produce a softer, hotter bloom.
Loading example…
Custom Color Ramp
A custom heatmapColor ramp: transparent blue at low density rising through royal blue, lime and yellow to red at the hottest cores.
Loading example…
Props
| Prop | Type | Default | Description |
|---|---|---|---|
afterId | string | undefined | — | — |
beforeId | string | undefined | — | — |
filter | FilterSpecification | undefined | — | — |
id | string | undefined | — | — |
layerIndex | number | undefined | — | — |
layout | Record<string, unknown> | undefined | — | — |
maxzoom | number | undefined | — | — |
minzoom | number | undefined | — | — |
paint | Record<string, unknown> | undefined | — | — |
source | string | undefined | — | — |
source-layer | string | undefined | — | — |
sourceLayer | string | undefined | — | — |
style | HeatmapLayerStyle | undefined | — | — |
testID | string | undefined | — | — |