paperchart — small multiples
A grid of panels (default 3 columns). Every panel has the same shape, the same y-range, the same x-range. Labels sit at the top of each panel; the final value is printed at the top-right. Exactly one panel uses the accent.
When to use
- Trend comparisons across six to twelve subjects.
- When individual panels do not need axes — the reader scans the overall shape, not exact values.
- Prefer over
line when you have more than four series and overplotting would hurt readability.
Input shape
{
"data": {
"xLabels": ["'20", "'21", "'22", "'23", "'24", "'25", "'26"],
"unit": "%",
"panels": [
{ "label": "computer programmers", "caption": "coverage trend", "values": [6,10,22,34,55,70,75], "accent": true },
{ "label": "customer service", "values": [4,8,18,28,44,58,62] }
]
}
}
Visual rules
- Shared y-axis across all panels so shapes are directly comparable.
- First and last x labels only; nothing in between.
- Final value printed top-right, colored by the series.
- Exactly one panel with
accent: true.
1---2name: paperchart-small-multiples3description: Render a grid of identical-shape sparklines, one per subject, for scanning trends across many subjects at once. Use when the reader should compare the shape of a time series across nine to twelve subjects and individual panels do not need axis ticks. Ideal for adoption curves, coverage by occupation, or per-region metrics.4license: MIT5---67# paperchart — small multiples89A grid of panels (default 3 columns). Every panel has the same shape, the same y-range, the same x-range. Labels sit at the top of each panel; the final value is printed at the top-right. Exactly one panel uses the accent.1011## When to use1213- Trend comparisons across six to twelve subjects.14- When individual panels do not need axes — the reader scans the overall shape, not exact values.15- Prefer over `line` when you have more than four series and overplotting would hurt readability.1617## Input shape1819```json20{21 "data": {22 "xLabels": ["'20", "'21", "'22", "'23", "'24", "'25", "'26"],23 "unit": "%",24 "panels": [25 { "label": "computer programmers", "caption": "coverage trend", "values": [6,10,22,34,55,70,75], "accent": true },26 { "label": "customer service", "values": [4,8,18,28,44,58,62] }27 ]28 }29}30```3132## Visual rules3334- Shared y-axis across all panels so shapes are directly comparable.35- First and last x labels only; nothing in between.36- Final value printed top-right, colored by the series.37- Exactly one panel with `accent: true`.
shuakami