Come lavora D3.js
Gli step
I passaggi per creare una visualizzazione in 
si possono riassumere in 4 step:
1️⃣ Importare e manipolare i dati in formati compatibili con le visualizzazioni
2️⃣ Mappare i dati rispetto allo spazio della visualizzazione, ovvero rapportare i valori allo spazio sullo schermo in modo da poterli disegnare in modo proporzionato.
3️⃣ Associare il layout in base al tipo di visualizzazione prescelta.
4️⃣ Disegnare il grafico sullo schermo.
Le funzioni
è composta da 2 macro famiglie di funzioni:
i metodi per manipolare i dati
i metodi per visualizzare i dati
Una volta importata la libreria con l'approccio preferito (CDN, npm, ecc.)
<script src="https://d3js.org/d3.v7.min.js"></script>
si accede a queste funzioni utilizzando le API con questa sintassi:
d3.metodo()
Così, rispetto ai 4 step principali troviamo come funzioni corrispondenti per esempio:
1️⃣ Elaborare i dati -> d3.min(), d3.max(), d3.sum() che restituiscono i valori minimo, massimo e somma di un iterabile.
2️⃣ Mappare i dati nello spazio -> d3.scaleLinear(), d3.scaleOrdinal() e d3.scaleTime() come esempi di funzione necessarie per creare le scale.
3️⃣ Associare il layout -> d3.path() usata per definire i path negli svg e d3.treemap() per creare mappe ad albero.
4️⃣ Disegnare il grafico -> d3.select(), d3.selectAll(), d3.append() funzioni che lavorano con gli elementi del DOM.
Last updated