Heatmap
GraphHeatmap
Labeled rows and columns with the same intensity glyphs as Activity. Punchcards, hours, anything 2d.
Command
pnpm dlx shadcn@latest add <origin>/r/graph-heatmap.jsonPunchcard
Same glyphs as Activity. Low intensity uses the second hue.
048121620
- Mon
- Tue
- Wed
- Thu
- Fri
- Sat
- Sun
LessMore
Coverage
Lock max so two heatmaps share a scale.
abcd
- auth
- billing
- docs
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | — | Caption drawn on the top edge of the frame. |
| columns | string[] | — | Column headers, left to right. |
| rows | HeatRow[] | — | label plus a value per column. |
| max | number | — | Lock the intensity scale across charts. |
| legend | boolean | true | Less / more glyph key. |
| caption | string | — | Optional note under the matrix. |
| glyphs | "shade" | "ascii" | "hash" | "bar" | string[] | "shade" | Character set. shade is ·░▒▓█. ascii is .- =#@. Pass a preset or your own characters. |
| palette | "mono" | "duo" | "multi" | "mono" | mono is one accent plus muted. duo paints the second series with --graph-accent-2. multi cycles three accents. |
| corner | string | "+" | Character at each corner of the frame. |
| className | string | — | Passed to the outer frame. |