JSON in tabella
Mostra un array di oggetti come una tabella ordinabile e leggibile.
Nulla di ciò che incolli lascia il tuo browser. L’allowlist connect-src ne fa una garanzia del browser anziché una promessa. Verificalo tu stesso
Un array di oggetti reso come una tabella che si riesce davvero a leggere, con ogni colonna individuata su tutte le righe anziché campionata sulla prima.
È proprio quest’ultimo punto a fare la differenza. Un convertitore che legge le chiavi dell’elemento zero elimina in silenzio ogni campo che compare solo più avanti, e te ne accorgi a valle, quando manca una colonna.
Come vengono decise righe e colonne
- Un array di oggetti
- Una riga per elemento. Il caso ovvio e quello più frequente.
- Un oggetto contenitore
- Un payload nella forma {"ok": true, "data": [...]} usa l’array come sorgente delle righe, e lo dichiara, perché è un’ipotesi e non una regola.
- Un singolo oggetto
- Una riga.
- Un array di scalari
- Un’unica colonna chiamata value.
- Colonne
- L’unione di tutti i percorsi su tutte le righe, nell’ordine in cui ciascuno è comparso la prima volta.
Valori annidati dentro una cella
Gli oggetti annidati diventano colonne puntate: address.city anziché una cella che contiene JSON. Gli array annidati qui vengono resi come JSON dentro la cella, perché una tabella con tags.0 fino a tags.47 come colonne separate non è più una tabella leggibile.
Se vuoi la forma a colonne indicizzate, o una riga per elemento dell’array, usa la pagina JSON in CSV, dove quelle regole sono configurabili.
How to do this in code
Produrre una tabella dal JSON nel codice.
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
È la parte map(keys) | add | unique a far prendere l’unione anziché il primo oggetto.
# 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 Domande frequenti
- Perché una colonna è vuota su alcune righe?
- Perché quella chiave non è presente in quegli oggetti. La colonna esiste perché almeno una riga ce l’ha. Una cella vuota significa che la chiave mancava; una cella con null significa che la chiave c’era con valore null.
- Posso ordinare per colonna?
- In questa anteprima no. Scarica il CSV e ordinalo in un foglio di calcolo, oppure interroga il documento con JSONPath se ti serve un sottoinsieme filtrato.