Repository navigation
Data Formats
Every chart takes a table. There are 15 layouts between them.
Paste, type or upload a table in the studio and the chart redraws on it. Commas, tabs
and semicolons all work; a header row is detected, and 1,234, $99 and 42% all
read as numbers. A title row above the table is skipped, and the editor says how many
it dropped. The gallery can also go the other way — paste a table into it and it
narrows itself to the charts that can read it, offering the columns of your table a
chart can take where it cannot take all of them.
| Layout | Charts | In one line |
|---|---|---|
labelSeries |
25 | The first column names each row; every column after it becomes its own series. |
items |
21 | One row per item: a name and the number beside it. |
labelValue |
17 | A label and a single value per row. |
observations |
9 | Raw measurements, one per row, as a group name and a value — or one column per group. |
pairs |
6 | A fixed set of columns per row, usually a label and two values set against each other. |
ohlc |
5 | Open, high, low and close, in that order. |
tree |
5 | A hierarchy: one level per column, a Parent > Child path in a single cell, or both in the same table. |
edges |
4 | A source and a target, and nothing else. |
places |
4 | A place and where it sits: a name, a longitude, a latitude and a value. |
regions |
4 | A country name and its value. |
rowSeries |
4 | The transpose: each row is one series and every column after the name is a point along it. |
xyGroups |
4 | A group name and an x/y position per row — or just x and y where there is one group. |
links |
3 | A row is a whole path, not one hop. |
matrix |
2 | A grid: the first column labels the row, every column after it is one cell. |
dimensions |
1 | One column per dimension, named by its heading, then the count. |
The first column names each row; every column after it becomes its own series. The ordinary spreadsheet layout.
An example, as Basic Line opens:
region,2023,2024
North,520,680
South,440,575
East,610,720
West,380,495
25 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Basic Line |
region, 2023, 2024
|
| Multi-Series Line |
region, 2023, 2024
|
| Stepped Line |
region, 2023, 2024
|
| Stepped Line — Multi |
region, 2023, 2024
|
| Area |
region, 2023, 2024
|
| Stacked Area |
region, 2023, 2024
|
| 100% Stacked Area |
region, 2023, 2024
|
| Step Area |
region, 2023, 2024
|
| Vertical Bar |
region, 2023, 2024
|
| Stacked Bar |
region, 2023, 2024
|
| 100% Stacked Bar |
region, 2023, 2024
|
| Radar |
axis, Score
|
| Radar — Comparison |
axis, Us, Them
|
| Radar — Filled |
axis, Team
|
| Scatterplot Matrix |
item, Price, Rating, Reviews
|
| Radial Line |
month, 2024, 2025
|
| Stream Graph |
region, 2023, 2024
|
| Bump Chart |
region, 2023, 2024
|
| Bar + Line |
quarter, Revenue, Growth
|
| Stacked Bar + Total Line |
region, 2023, 2024
|
| Cycle Plot |
month, 2023, 2024, 2025
|
| Dot Plot |
role, Berlin, London
|
| Line — Custom Engine |
region, 2023, 2024
|
| Area — Custom Engine |
region, 2023, 2024
|
| Bar — Custom Engine |
region, 2023, 2024
|
One row per item: a name and the number beside it. What that number means differs by chart — the columns below say which.
An example, as Waterfall opens:
step,change
FY2023,0
New sales,2.1
Churn,-0.5
FY2024,0
21 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Waterfall |
step, change
|
| Lollipop |
category, value
|
| Waffle |
browser, share
|
| Word Cloud |
term, count
|
| Dot Matrix |
category, value
|
| Tally Chart |
category, value
|
| Circle Pack |
name, value
|
| Proportional Area |
scope, value
|
| Nested Proportional Area |
source, value
|
| Venn Diagram |
set, size
|
| Funnel |
stage, count
|
| Marimekko |
segment, share
|
| Pareto Chart |
cause, count
|
| Bar with Error Bars |
group, mean, error
|
| Quadrant Chart |
item, x, y
|
| Timeline |
event, start, end, lane
|
| Tile Grid Map |
code, value, row, col
|
| Bullet Chart |
measure, actual, target, max
|
| Radial Bar |
device, value
|
| Pictogram (Isotype) |
mode, percent
|
| Pie / Doughnut — Custom Engine |
category, value
|
A label and a single value per row. The narrowest layout there is.
An example, as Confidence Band opens:
day,mean
Day 1,18
Day 2,19
Day 3,21
Day 4,22
17 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Confidence Band |
day, mean
|
| Fan Chart |
year, value
|
| Spiral Plot |
period, value
|
| Surplus / Deficit Line |
month, value
|
| Horizontal Bar |
category, value
|
| Diverging Bar |
category, value
|
| Pie |
category, value
|
| Doughnut |
category, value
|
| Gauge |
label, value
|
| Polar Area |
category, value
|
| Nightingale Rose |
category, value
|
| Scatter |
x, y
|
| Hexagonal Binning |
x, y
|
| 2D Density Contour |
x, y
|
| Radial Histogram |
direction, count
|
| Radial Column |
direction, speed
|
| Calendar Heatmap |
date, count
|
Raw measurements, one per row, as a group name and a value — or one column per group. Repeated group names are the point: they are what gives the chart a distribution.
An example, as Histogram opens:
group,value
Control,52
Control,48
Control,61
Treatment,64
Treatment,71
Treatment,58
9 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Histogram |
group, value
|
| Box Plot |
group, value
|
| Violin |
group, value
|
| Density Plot |
group, value
|
| Ridgeline Plot |
group, value
|
| Cumulative Curve (ECDF) |
group, value
|
| Beeswarm |
group, value
|
| Barcode Plot |
group, value
|
| Stem & Leaf Plot |
group, value
|
A fixed set of columns per row, usually a label and two values set against each other.
An example, as Spine Chart opens:
band,Desktop,Mobile
Under 25,34,66
25-34,48,52
6 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Spine Chart |
band, Desktop, Mobile
|
| Floating Bar (Gantt) |
task, start, end
|
| Butterfly (Population Pyramid) |
band, Male, Female
|
| Slope Chart |
label, 2015, 2025
|
| Dumbbell |
label, 2015, 2025
|
| Span Chart |
city, min, max
|
Open, high, low and close, in that order. A leading date column is ignored, so it is safe to keep one.
An example, as Candlestick opens:
open,high,low,close
148.2,151.0,147.1,150.4
150.4,152.8,149.9,151.2
151.2,151.9,148.0,148.6
5 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Candlestick |
open, high, low, close
|
| OHLC Bar |
open, high, low, close
|
| Renko |
open, high, low, close
|
| Point & Figure |
open, high, low, close
|
| Kagi |
open, high, low, close
|
A hierarchy: one level per column, a Parent > Child path in a single cell, or both in the same table.
An example, as Treemap opens:
path,value
Women > Dresses > Silk,180
Women > Tops > Tees,75
Men > Shirts > Oxford,95
5 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Treemap |
path, value
|
| Sunburst |
path, value
|
| Icicle |
path, value
|
| Dendrogram |
path, value
|
| Radial Dendrogram |
path, value
|
A source and a target, and nothing else. The nodes are whatever names appear.
An example, as Network Graph opens:
source,target
Web,Gateway
Mobile,Gateway
Gateway,API
API,Postgres
4 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Network Graph |
source, target
|
| Arc Diagram |
source, target
|
| Adjacency Matrix |
source, target
|
| Non-ribbon Chord |
source, target
|
A place and where it sits: a name, a longitude, a latitude and a value. Longitude first — swapping the pair puts every mark in the sea.
An example, as Voronoi Diagram opens:
name,x,y
Depot N,22,18
Depot E,78,26
Depot S,62,82
4 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Voronoi Diagram |
name, x, y
|
| City Map |
city, lon, lat, value
|
| Proportional Symbol Map |
name, lon, lat, value
|
| Flow Map |
name, lon, lat, value
|
A country name and its value. Spell countries out in full.
An example, as Choropleth Map opens:
country,value
France,64
Germany,71
Spain,52
Italy,58
4 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Choropleth Map |
country, value
|
| Globe |
country, value
|
| Dot Density Map |
country, value
|
| Cartogram (Non-contiguous) |
country, value
|
The transpose: each row is one series and every column after the name is a point along it. Sparklines, horizon bands and Likert scales are written this way, and choosing the wrong one of these two silently transposes the chart.
An example, as Horizon Chart opens:
metric,t1,t2,t3,t4,t5
CPU,0.2,0.5,-0.3,0.8,0.1
Memory,0.4,0.2,0.6,-0.1,0.3
4 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Horizon Chart |
metric, t1, t2, t3, t4, t5
|
| Sparkline |
metric, Jan, Feb, Mar, Apr, May
|
| Diverging Stacked Bar (Likert) |
question, Strongly disagree, Disagree, Neutral, Agree, Strongly agree
|
| Parallel Coordinates |
item, Price, Rating, Reviews
|
A group name and an x/y position per row — or just x and y where there is one group.
An example, as Scatter — Clusters opens:
group,x,y
High value,75,82
High value,80,78
Regular,45,48
Regular,50,42
4 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Scatter — Clusters |
group, x, y
|
| Bubble |
group, x, y
|
| Connected Scatter |
group, x, y
|
| Scatter — Custom Engine |
group, x, y
|
A row is a whole path, not one hop. Ad, Visit, Checkout, 320 is 320 flowing Ad → Visit and Visit → Checkout. A hop appearing in two paths is summed into one ribbon.
An example, as Sankey opens:
from,to,value
Organic,Visit,4200
Paid,Visit,2800
Visit,Checkout,3800
Visit,Bounce,6500
3 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Sankey |
from, to, value
|
| Chord Diagram |
from, to, value
|
| Alluvial Diagram |
from, to, value
|
A grid: the first column labels the row, every column after it is one cell.
An example, as Heatmap opens:
day,0,1,2,3
Mon,4,8,12,6
Tue,3,9,14,7
2 charts read this layout:
| Chart | Columns it expects |
|---|---|
| Heatmap |
day, 0, 1, 2, 3
|
| Time Table |
room, 09, 10, 11, 12
|
One column per dimension, named by its heading, then the count. The headings are part of the data here.
An example, as Parallel Sets opens:
Channel,Device,Outcome,value
Organic,Desktop,Purchase,320
Organic,Mobile,Bounce,480
Paid,Mobile,Purchase,180
Email,Desktop,Purchase,160
1 chart reads this layout:
| Chart | Columns it expects |
|---|---|
| Parallel Sets |
Channel, Device, Outcome, value
|
Generated from the registry by tools/build-wiki.mjs. Do not edit by hand — regenerate.