sparkline · default
60 pts
charts· chapter 29 · 25 primitives · 21 display · 4 composition
twenty-five primitives, one swiss-watch contract
twenty-one display charts, four composition primitives, and one five-layer surface that encodes the next-generation architectural ambition (liquidity · price · delta · annotation · microstructure) as types so the v2 webgpu adapter cannot drift from the v1 ssr floor. every chart is a server component. every dossier carries num · cls · states · tokens · description · kind. ci:charts grades the catalog on every push.
as of
00 · liveone synthetic ledger \u00b7 twelve panels \u00b7 advances on the brand's heartbeat \u00b7 covenant rule 11watch the gallery breathe together
sparkline · amber · area
head 102.01
sparkline · acid · returns
59 returns
sparkline · muted · highs
seed 0x4ebfeb5a
line chart · 3 series
price · high · low
candle chart
12 buckets · 5-tick window
depth bar · synthesised book
8 bids · 8 asks · spread 0.05
histogram · returns
59 samples
heatmap · cross-window correlation
4 windows · 12 / 24 / 48 / 60
trade receipt
- tape · head
- 102.01
- tape · length
- 60
- tape · seed
- 0x4ebfeb5a
- ticks · session
- 0
- pace
- 1× per heartbeat
- cadence · source
- brand-runtime · onTick · cycle counter
as of
01 · catalogevery primitive, in placethe twenty-five ssr primitives
as of
02 · layered surfacefive layers · one canvasthe swiss-watch composition root
| layer | kind | cells / items |
|---|---|---|
| 4 | liquidity | 100 |
| 1 | price | 28 |
| 2 | delta | 60 |
| 3 | annotation | 2 |
| 5 | microstructure | 28 |
why ssr first, webgpu later
the reference document proposes wgsl compute shaders and render passes for sub-millisecond aggregation at 100 m data points. v1 ships svg because the brand floor is calm and deterministic; the engine: 'svg' | 'webgpu'prop is forward-declared so a future ADR can introduce@zero/charts/webgpu without changing the consumer-facing prop shape. the contract is the type, not the renderer.as of
03 · semantic zoomfour scale tiersrepresentation changes with scale, not just magnification
macro · layers: priceswing · layers: price · annotationintraday · layers: liquidity · price · delta · annotation · microstructuretick · layers: liquidity · price · delta · microstructurethe navigation model
geometric zoom (pinch to magnify) is the wrong model for a terminal: at every magnification level the data already shown is unchanged. semantic zoom is the right model:which layers render, and which features are legible, changes with scale. macro hides microstructure; tick shows the spread strip and per-trade marks. consumers lift the scale value into url state, viewport breakpoints, or ai-suggested transitions.