De slides van een les die ik gaf aan de Mediacademie.

1. ONLINE DATAVISUALISATIE
Mediacademie
29 maart 2013

2. MAARTEN LAMBRECHTS?
www.mo.be/maarten
maartenlambrechts.drupalgardens.com
@maartenzam

3. POLLEKE
Html?
Al data gevisualiseerd?
Waarom deelname?

4. WAT?
Datavisualisatie maakt verschijnselen en delen van de
werkelijkheid zichtbaar en begrijpbaar. Deze fenomenen
zijn in veel gevallen niet zichtbaar voor het blote oog of
niet eens van visuele aard. (Joan Costa)
Datavisualisatie moet vragen kunnen beantwoorden
door
Vergelijken
Rangschikken
Samenvatten

5. WAAR?

11. WAAROM NU?
Data
Meer
Open
Gratis
Licentie
Formaten
Tools gedemocratiseerd

12. WAAROM NU?
Psychologie tijdens laatste decennia:
“Hersenen werken visueel”
Visuele cortex werkt snel en efficiënt
Klein „werkgeheugen‟

13. Oorzaak Sterfgevallen 2008
Hart- en vaatziekten 33.142
Kanker 28.114
Ademhalingsstelsel 11.416
Uitwendige oorzaken 6.625
Spijsvertering 4.711
Zenuwstelsel 4.474
Psychische stoornissen 3.816
Stofwisselingsstoornissen 2.741
Infectieziekten 2.293
Urogenitaal 2.150
Andere 4.278
Totaal 103.760

14. Sterfgevallen 2008
Hart- en vaatziekten 31.9%
Kanker 27.1%
Ademhalingsstelsel 11.0%
Uitwendige oorzaken 6.4%
Spijsvertering 4.5%
Zenuwstelsel 4.3%
Psychische stoornissen 3.7%
Stofwisselingsstoornissen 2.6%
Infectieziekten 2.2%
Urogenitaal 2.1%
Andere 4.1%
0% 5% 10% 15% 20% 25% 30% 35%

15. Sterfgevallen 2008
Andere
Urogenitaal
Infectieziekten
Stofwisselingsstoornissen
Psychische stoornissen
Zenuwstelsel
Spijsvertering
Uitwendige oorzaken
Ademhalingsstelsel
Kanker
Hart- en vaatziekten

16. DE 10 REGELS
VAN EDWARD TUFTE

17. GOEDE VISUALISATIE IS
Functioneel als een hamer
Gelaagd als een ui
Elegant en waar als een wiskundige formule
Alberto Cairo

19. DATAVISUALISATIE IN DE
JOURNALISTIEK
Analyse van cijfers
Illustratie bij artikel
Op zichzelf staand
Interactief („news app‟)

20. INTERACTIVITEIT
Statisch
Semi-statisch
hover
klikbaar
Interactief
filteren
sorteren
gebruikersinput
animatie

21. ONLINE VS. PRINT
Beperkingen van papier zijn weg:
Interactiviteit
Animatie
Hoeveelheid data
Grote range in complexiteit
Eenvoudige tools, die regels van goede
visualisatie (meestal) volgen
Beperking zit in CMS

22. BEST OF THE BEST
Data journalism award winners
Methadone and the politics of pain (Seattle
Times)
Riot Rumours (The Guardian)
Every Death on Every Road (BBC)

23. BEST OF THE BEST
Malofiej 21 online winnaars:
All the medalists (New York Times)
512 paths to the White House (New York
Times)
Stateface (ProPublica)

24. VORMEN
Tabel
Grafiek
Scatterplot, bellendiagram
Lijngrafiek
Hellingsgrafiek
Staafgrafiek, gestapelde staafgrafiek
Taartdiagram
Stapeldiagram (geavanceerd)
Sparklines, meer sparklines
Kaart
Animatie
App: China vs US, Hoe ver woon ik van een
Sevesobedrijf?, What‟s your number?

26. TOOLS

27. DATAWRAPPER
datawrapper.de
Snelle en eenvoudige grafieken
Embed: iframe
Vlaamse huurmarkt, Britse begroting (The
Guardian)

28. GOOGLE DRIVE
drive.google.com
Vooral spreadsheet is interessant
Meer mogelijkheden, iets complexer
Embed: afbeelding of javascript
Crowdfundingmeter, Nieuwe
superrijken, Human Development Index (The
Guardian)

29. GOOGLE FUSION TABLES
„Advanced‟ Google spreadsheet
Vooral interessant voor kaartjes
Geocoding
Punten en polygonen
Coalities (Nieuwsblad, Achterliggende
gegevens), Kernkaart, Riots: suspects and
poverty mapped (Guardian)

30. MAPBOX
mapbox.com
Mooie kaartjes
Veel customizing mogelijk
Bruksel, Grondstoffenrace

31. D3
d3js.org
Javascript
Veel gebruikt
Combinatie met andere libraries, zeer veel
mogelijkheden
Olympische Stroom, Ontwikkeling van de
Wereld, Beursgang Facebook, Obama‟s
budget, Crisis in Europa

32. bit.ly/YJAR9x