JSON to Table
Render an array of objects as a sortable table you can read.
Nothing you paste leaves your browser. The connect-src allowlist makes that a browser guarantee rather than a promise. Check it yourself
An array of objects rendered as a table you can actually read, with every column discovered across every row rather than sampled from the first one.
That last point is the whole difference. A converter that reads the keys of element zero silently drops every field that only appears later, and you find out downstream when a column is missing.
How rows and columns are decided
- An array of objects
- One row per element. The obvious case and the common one.
- A wrapper object
- A payload shaped like {"ok": true, "data": [...]} uses the array as the row source, and says so, because that is a guess rather than a rule.
- A single object
- One row.
- An array of scalars
- A single column named value.
- Columns
- The union of every path across every row, in the order each was first seen.
Nested values inside a cell
Nested objects become dotted columns: address.city rather than a cell containing JSON. Nested arrays are rendered as JSON inside the cell here, because a table with tags.0 through tags.47 as separate columns is not a table anyone can read.
If you want the index-column form, or one row per array element, use the JSON to CSV page where those policies are configurable.
How to do this in code
Producing a table from JSON in code.
py Python
import pandas as pd
df = pd.json_normalize(records)
print(df.to_markdown(index=False))
df.to_csv('out.csv', index=False) sh jq
The map(keys) | add | unique part is what makes this take the union rather than the first object.
# Header row from the union of all keys, then the rows
jq -r '(map(keys) | add | unique) as $cols
| $cols, (.[] | [.[$cols[]]])
| @csv' records.json js JavaScript
const columns = [...new Set(records.flatMap(Object.keys))];
const rows = records.map((r) => columns.map((c) => r[c] ?? ''));
console.table(records); // in a browser console or Node Questions
- Why is a column empty for some rows?
- Because that key is absent from those objects. The column exists because at least one row has it. An empty cell means the key was missing; a cell containing null means the key was present with a null value.
- Can I sort by a column?
- Not in this preview. Download the CSV and sort it in a spreadsheet, or query the document with JSONPath if you need a filtered subset.