online datavisualisatie
DESCRIPTION
De slides van een les die ik gaf aan de Mediacademie.TRANSCRIPT
![Page 1: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/1.jpg)
ONLINE DATAVISUALISATIE
Mediacademie
29 maart 2013
![Page 2: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/2.jpg)
MAARTEN LAMBRECHTS?
www.mo.be/maarten
maartenlambrechts.drupalgardens.com
@maartenzam
![Page 3: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/3.jpg)
POLLEKE
Html?
Al data gevisualiseerd?
Waarom deelname?
![Page 4: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/4.jpg)
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
![Page 5: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/5.jpg)
WAAR?
![Page 6: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/6.jpg)
![Page 7: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/7.jpg)
![Page 8: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/8.jpg)
![Page 9: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/9.jpg)
![Page 10: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/10.jpg)
![Page 11: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/11.jpg)
WAAROM NU?
Data
Meer
Open
Gratis
Licentie
Formaten
Tools gedemocratiseerd
![Page 12: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/12.jpg)
WAAROM NU?
Psychologie tijdens laatste decennia:
“Hersenen werken visueel”
Visuele cortex werkt snel en efficiënt
Klein „werkgeheugen‟
![Page 13: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/13.jpg)
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
![Page 14: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/14.jpg)
4.1%
2.1%
2.2%
2.6%
3.7%
4.3%
4.5%
6.4%
11.0%
27.1%
31.9%
0% 5% 10% 15% 20% 25% 30% 35%
Andere
Urogenitaal
Infectieziekten
Stofwisselingsstoornissen
Psychische stoornissen
Zenuwstelsel
Spijsvertering
Uitwendige oorzaken
Ademhalingsstelsel
Kanker
Hart- en vaatziekten
Sterfgevallen 2008
![Page 15: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/15.jpg)
Sterfgevallen 2008
Andere
Urogenitaal
Infectieziekten
Stofwisselingsstoornissen
Psychische stoornissen
Zenuwstelsel
Spijsvertering
Uitwendige oorzaken
Ademhalingsstelsel
Kanker
Hart- en vaatziekten
![Page 16: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/16.jpg)
DE 10 REGELS
VAN EDWARD TUFTE
![Page 17: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/17.jpg)
GOEDE VISUALISATIE IS
Functioneel als een hamer
Gelaagd als een ui
Elegant en waar als een wiskundige formule
Alberto Cairo
![Page 18: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/18.jpg)
![Page 19: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/19.jpg)
DATAVISUALISATIE IN DE
JOURNALISTIEK
Analyse van cijfers
Illustratie bij artikel
Op zichzelf staand
Interactief („news app‟)
![Page 20: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/20.jpg)
INTERACTIVITEIT
Statisch
Semi-statisch
hover
klikbaar
Interactief
filteren
sorteren
gebruikersinput
animatie
![Page 21: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/21.jpg)
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
![Page 22: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/22.jpg)
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)
![Page 23: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/23.jpg)
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)
![Page 24: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/24.jpg)
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?
![Page 25: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/25.jpg)
![Page 26: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/26.jpg)
TOOLS
![Page 27: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/27.jpg)
DATAWRAPPER
datawrapper.de
Snelle en eenvoudige grafieken
Embed: iframe
Vlaamse huurmarkt, Britse begroting (The
Guardian)
![Page 28: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/28.jpg)
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)
![Page 29: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/29.jpg)
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)
![Page 30: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/30.jpg)
MAPBOX
mapbox.com
Mooie kaartjes
Veel customizing mogelijk
Bruksel, Grondstoffenrace
![Page 31: Online datavisualisatie](https://reader033.vdocuments.mx/reader033/viewer/2022052910/559b35ec1a28ab34638b47f2/html5/thumbnails/31.jpg)
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