HeatmapChart

Molecule

Matrix of cells coloured on one token scale. A missing value (`null`) renders as an empty cell, never as 0, so gaps in the data stay visible. Hover shows the value; the scale can be fixed with `min` / `max`.

Missing data is empty, not zero

Preview

Messages per hour and weekday (every 37th cell is missing)

Code
<HeatmapChart cells={cells} height={220} valueLabel="Messages" />

Fixed scale and value format

Preview

Humidity by room and time of day (fixed 0-100 scale)

Code
<HeatmapChart cells={cells} min={0} max={100} valueLabel="Humidity" valueFormat={(v) => v + '%'} />
Sourcemodules/ui/Chart/charts/HeatmapChart.tsx