Online data visualisation (D3.js)

Eén van de meest krachtige manieren om verhalen online te vertellen is met een datavisualisatie. Geef je bij een statische datavisualisatie de gebruiker veelal inzicht in een complex verhaal; bij een online visualisatie kan de gebruiker zelf erdoor heen klikken en op zoek gaan naar onderdelen van het verhaal die voor hem of haar interessant zijn.

In deze training zetten we een aantal essentiële stappen op het gebied van programmeren. Het maken van een aansprekende online datavisualisatie vereist namelijk enige kennis en inzicht in programmeertalen zoals HTML, CSS en Javascript. Je leert in de training hoe je data interactief kunt maken en tot leven kan brengen in een visualisatie door gebruik te maken van D3.js. Enige kennis en ervaring met coderen (en dan met name Javascript) is vereist. Deelnemers dienen in elk geval kennis te hebben van Arrays en Objects, maps en filters.

Omschrijving training

We beginnen met het bekijken van de D3-documentatie, die grondig is maar nogal overweldigend kan zijn om te navigeren. D3.js is een krachtige JavaScript-bibliotheek voor het maken van dynamische en interactieve visualisaties.

We kijken hoe je het D3-ecosysteem in jouw voordeel kan gebruiken. Daarna duiken we rechtstreeks de code in, te beginnen met selections en data binding. Wanneer we een goed beeld hebben van deze concepten, gebruiken we enter-append om onze eerste staafdiagram te maken. We kijken naar scales en axes om grafieken te annoteren, bijwerken en samenvoegen.

Afhankelijk van de ervaring en snelheid van werken van de deelnemers, worden complexere visuele vormen en interactietechnieken aan het programma toegevoegd. Indien mogelijk verkennen we ook een aantal andere D3-modules.

Deze eendaagse training is een mix van uitleg, demonstratie en hands-on oefeningen. Aan het einde van de training heb je een beter begrip hoe je visueel aantrekkelijke en interactieve grafieken kunt maken met D3.js.

De volgende onderwerpen komen onder meer aan bod:

  • voorbeelden van online datavisualisaties;
  • kijkje aan de ‘achterkant’ van het webontwerp;
  • bekijken van de D3 documentatie;
  • de basis van D3 (selections, data binding, DOM elements);
  • scales en axes;
  • colors en shapes;
  • Enter and update; Exit and merge;
  • toevoegen van interactieve elementen in D3.js;

Trainer

peter

Shirley Wu is een freelance software-engineer gespecialiseerd in datavisualisatie. Ze combineert haar liefde voor kunst, wiskunde en programmeren in het maken van kleurrijke, interactieve datavisualisaties. Haar werk is te vinden op www,sxywu.com.

Prijs

De kosten van de training zijn € 369 exclusief BTW, inclusief koffie, thee en lunch.

Doelgroep

De training is bedoeld voor diegenen die onbekend zijn met D3.js of de tool wel al hebben bekeken maar nog geen eigen visualisatie hebben gemaakt. Het doel is om inzicht te krijgen in de kern van D3.js en richting te geven, om het vervolgens zelf verder te verkennen. De training is meer een diepe duik in specifieke kernmodules van D3 dan een uitgebreide introductie. Enige ervaring met Javascript is vereist.

Praktische informatie

20 mei 2019 (09.30 – 17.00 uur).
De training wordt in het Engels gegeven.
De training vindt plaats in Amsterdam (onder voorbehoud).

Schrijf je in