o11ykit
Direct result in
Pass the engine query result into the adapter. No wide table or gallery DTO step.
result -> published adapter -> native input
chart adapter gallery
One query.
Native charts.
The engine returns typed time-series results. The adapters turn that into the thing each chart library actually wants: props, rows, configs, datasets, aligned arrays, or traces. Switch libraries below; every gallery entry renders through the actual chart package it represents.
// Query once. Render anywhere.
const engine = new ScanEngine();
const result = engine.query(store, query);
const tremor = toTremorLineChartProps(result);
const recharts =
toRechartsTimeSeriesData(result);
// Every gallery chart starts from
// this TSDB engine result.
0
chart libraries
0
chart shapes
1
engine result
0
generic chart DTOs
user docs
What the adapter gives you.
Query the TSDB engine once, then pass the result directly to the adapter for the chart library you already use. The adapter returns native package input: Tremor props, Recharts rows and keys, Chart.js configs, ECharts options, Plotly figures, uPlot aligned arrays, Vega-Lite specs, and the equivalent shape for each supported library. Use the Show code button on any card to compare the query, adapter call, returned input, and native render code.
Native input out
Feed the returned object to the chart package exactly where that package expects it.
new Chart(canvas, config)
Live updates stay yours
Reuse the chart instance and call the library's normal update path with new adapter output.
chart.update("none")
ergonomics audit
What you still control.
The adapters handle the repetitive conversion work: aligned timestamps, latest values, histogram buckets, labels, sparse values, and package-specific field names. You keep control over presentation, colors, tooltips, axes, and the update strategy each chart library recommends. A chart shape only appears in this gallery when that library has a published adapter and a real native renderer path for it.
Labels and nulls
Supply a `seriesLabel` callback and let the adapter preserve sparse samples as the null or missing-value shape that library expects.
seriesLabel: (series) => ...
Styling remains native
The adapter gives you the data-bearing object. You can still merge in normal chart package options for themes, legends, grids, cursors, and interaction.
{ ...option, grid, tooltip }
Updates are package updates
For live data, append into the same store, query the sliding window, convert again, then call the chart library's own update API.
result -> adapter -> chart.update()
why it feels good
Each adapter speaks the library's dialect.
The public exports are named for the thing the library wants, not for an o11ykit intermediate model. A Tremor user gets props, a Recharts user gets rows and data keys, uPlot gets aligned arrays, ECharts gets options, and Plotly gets a figure.
coverage
Chart shape by chart shape.
A checked cell means this gallery has a published adapter call and a native package render path for that chart shape. The latest-bar and histogram cards use the chart package's own bar, histogram, or category-series inputs; there are no gallery-only drawing layers behind them.