Menu

Le coordinate dell'information design

Creare visualizzazioni interattive con D3.js

maggio 23, 2018 - Data Visualization
Creare visualizzazioni interattive con D3.js

Per rappresentare i dati in maniera efficace non basta solo conoscere le linee guida del Visual Design ma è importante saper anche mettere mano al linguaggio di programmazione sottostante. Questo si traduce in maggiore autonomia e nella possibilità di aggiungere livelli di interazione e significato a grafici e rappresentazioni inizialmente statici al fine di avvicinare un ampio pubblico a tematiche articolate e complesse.

Come fare? Nel ricco panorama di strumenti a disposizione sul web, il corso BIG DIVE into DataViz ha scelto di incentrare il suo programma di formazione sulla libreria D3.js.

Cos’è D3.js

D3.js (D3 = Data Driven Documents) è probabilmente la libreria software oggi maggiormente utilizzata per realizzare grafici e visualizzazioni interattive.
Nasce da un progetto del 2011 dell’Università di Stanford e già dalle prime versioni è stata rilasciata con licenza open, disponibile quindi gratuitamente e aperta a qualsiasi tipo di contributo.
Si tratta di una libreria JavaScript ideata per interagire facilmente con i dati (solitamente in formato JSON o CSV) e in grado di rappresentarli all’interno di pagine web, sfruttando le potenzialità degli SVG (elementi web vettoriali introdotti con l’HTML5).

Peculiarità della libreria

Efficace.
Ti permetterà di utilizzare script JavaScript standard per animare i canvas SVG ed aggiungere transizioni ed effetti d’animazione. Inoltre la perfetta interazione con il browser fa si che non si abbia la necessità di installare componenti aggiuntivi.

Una sintassi chiara per una versatilità totale.
L’approccio è del tipo “Scrivi il codice così come vuoi rappresentare gli oggetti”. D3 utilizza funzioni JavaScript per la selezione e la modellazione degli elementi: la selezione avviene tramite tag, elementi, classi, identificatori e attributi che potranno essere modellati a seconda della visualizzazione da te pensata.

Non si tratta di un software proprietario: è interamente open source.

La libreria è ben documentata con moltissime risorse e “snippet” di codice pre-confezionati. Attorno ad essa ruota infatti un’attiva e numerosa community con la quale potersi confrontare prendendo esempio da progetti già realizzati da altri.

Spazio alla creatività.
Non esistono vincoli imposti da dashboard o limitazioni in quello che potrete creare. Prendete ispirazione dai progetti già realizzati per sviluppare nuove idee!

Interessante, ma se non conosco Javascript?

Per imparare d3.js, non bisogna essere prettamente degli sviluppatori.
La mancanza di dashboard “Plug-and-Play” e GUI semplificate può rendere poco d’appeal a designer questo potente strumento, modificabile solo attraverso codice. Superato comunque il primo approccio, anche coloro che hanno conoscenze di base di HTML e CSS riusciranno a districarsi tra le righe di JavaScript.

Per guidarti in questo nuovo viaggio ti invitiamo a scoprire il programma di BIG DIVE Into DataViz che si terrà a Torino dall’11 al 15 giungo 2018. Cinque giornate tra lezioni frontali e tanta pratica per diventare master in D3.js e saper costruire da zero le tue future Data Visualization!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *