Charts
Every chart in any RisqBase product must be classifiable as exactly one of the canonical types. If a proposed chart can't be classified, reconsider the chart before inventing a new type. ChartContainer currently implements 7 of these as React primitives (line · bar · sparkline · area · heatmap · metric-card · choropleth); the rest are taxonomy entries with library guidance pending v4.4. Sources: Datawrapper Academy, Apple Swift Charts, Observable Plot, Cleveland-McGill perceptual ranking.
Filter by purpose group to find a chart that fits the question you're asking the data.
2–12 categories, short labels.
8–40 categories or long labels.
2–4 sub-series across 2–8 categories.
Values cluster at similar magnitudes.
Comparing categories where zero matters.
Frequency distribution of a continuous variable.
Five-number summary across 2–12 groups.
Distribution shape, not just summary.
2–3 overlapping distributions.
2–6 components; exact totals matter.
Time-series cumulative decomposition.
10–50 leaves; ranking over exact values.
Part-to-whole emphasising the hierarchy.
Single value as ~100 unit-squares.
Two continuous vars, 10–10,000 observations.
Before / after · plan / actual.
1–8 series on a continuous time axis.
Single series cumulative magnitude.
Inline trend · 64×24 default.
Map-bound categorical / sequential.
Map-bound magnitude bubbles.
2–5 parts; prohibitions enforced.
Part-to-whole at scale.
Single bar broken into shares.
Counts · currency · duration.
0–100 score · primitive in data-viz/.
Inline bar trend.
Conversion drop-off across stages.
Two-dimensional categorical / sequential.
OHLC encoding.
Prohibited per §8.1.3 (area mis-perceived).
Origin-destination arcs.
Multi-stage flow.
Eleven rows mapping data-shape → canonical chart type. If the data fits more than one row, prefer the type with higher Cleveland-McGill perceptual rank.
Ordered for perceptual difference. Cycle past 8 → use small-multiples.
Single-hue per domain: risk · financial · operational.
Above: financial ramp · L\\* 97 → 18.
Warm + cool variants. n4 / p4 ≥7:1 vs surface.
Above: cool diverging · 9-stop.
Full chart-domain ramps in the token explorer →
Charts inherit the active theme via CSS variables. In dark, plot-area + legend + tooltip darken; mark colours stay in family but L\\* lifts for readability. In HC, marks differentiate via shape, dash, and pattern - colour cannot carry meaning. In print, fills collapse to greyscale with pattern overlays.
visx@^3.0.0 is the charting library (per spec §8.7). Visx is composable Visx-component wrappers around D3 utilities. peerDependencies declared; CI-locked via package-lock.json; the 4.x upgrade is a major version bump.
Rejected: Recharts (limited composition), Observable Plot (Node-only data-grammar), Nivo (heavier runtime), Direct D3 (no React idiom).