Datavisualisatie
30 november &
1 december 2020
@maartenzam
Statbel
valkuilen, BASISREGELS en tools
Programma
1. Datavisualisatie: introductie
2. Valkuilen in datavisualisatie
3. Oefening: de Datavisualisatie Checklist
4. Grafiektypes en "chart choosers"
5. Voorbij staven en lijnen
Maarten Lambrechts?
Datavisualisatie: introductie
I
Waarom datavisualisatie?
"As knowledge increases amongst mankind, and transactions multiply, it becomes more and more desirable to abbreviate and facilitate the modes of conveying information from one person to another, and from one individual to the many."
William Playfair, 1786
"Everything that can be expressed in numbers can be represented by lines."
John Playfair
Year | Imports | Exports |
---|---|---|
1700 | 71,1 | 32,8 |
1705 | 74,5 | 40,9 |
1710 | 82,6 | 59 |
1715 | 87,2 | 77,9 |
1720 | 96,8 | 75,2 |
1725 | 102,6 | 71,3 |
1730 | 96,4 | 64,7 |
1735 | 93,7 | 60,5 |
1740 | 92,9 | 65,1 |
1745 | 92,5 | 74,3 |
1750 | 90,1 | 77,4 |
1755 | 79,9 | 82,8 |
1760 | 76,6 | 117,5 |
1765 | 79,6 | 151,8 |
1770 | 83,8 | 163,8 |
1775 | 90,4 | 175,7 |
1780 | 92,7 | 185,4 |
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1063373/Playfair_TimeSeries-2.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2097765/1786_Playfair_-_Exports_and_Imports_of_Scotland_to_and_from_different_parts_for_one_Year_from_Christmas_1780_to_Christmas_1781.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2097768/Playfair-piechart.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2978708/Playfair_Plate2_Decline.gif)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2931310/create-line-chart.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1308816/anscombe_tabel.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6758693/anscombe_1.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6758701/anscombe_2.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6758703/anscombe_3.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6758706/anscombe_4.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6762319/explanatory-vs-exploratory_2x.png)
"Explanatory" datavisualisatie
"Exploratory" datavisualisatie
Het geheim
De vroege waarneming
Preattentive processing
868888609462834719714449648
122286651978794222484779908
939340243123007392183390116
351684124962334339709749742
868888609462834719714449648
122286651978794222484779908
939340243123007392183390116
351684124962334339709749742
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1318194/vroegewaarneming_kleur.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1318185/vroegewaarneming_grootte.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1318182/vroegewaarnemingrotatie.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1318180/vroegewaarneming_vorm.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1085414/vroegewaarneming_positie.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1318177/vroegewaarneming_ingeslotenheid.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864105/onlydots.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864107/onlyshapes.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864113/coloreddots.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864106/colorlines.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864114/verticallines.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864120/realchart.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/6864122/realchart_nodots.png)
Valkuilen in datavisualisatie
II
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/5786447/pies.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/5786449/bars.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2245281/cleveland_mcgill_cairo.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2095139/Pie-I-have-Eaten.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2114937/cairo.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2114938/vienna.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2114939/dubai.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2114940/mauritius.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3040190/japan-pie-chart.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3040140/nvagrafiek.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3040140/nvagrafiek.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3040149/crombezgrafiek.png)
2. Knip geen staven
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3040167/armoede_MFNgraph_TIJD_06102015_ipadgraph.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3040168/armoede_correctie2_MFNgraph_TIJD_061020151.jpg)
3. Knip geen tijdsassen
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067093/emery-labeling-line-graphs-1.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067094/emery-labeling-line-graphs-2.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067095/emery-labeling-line-graphs-3.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067096/emery-labeling-line-graphs-4.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067097/emery-labeling-line-graphs-5.png)
4. Label direct
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2983743/LinesDefault.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2983742/FillDefault.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4112103/excel-pie-default.png)
5. Gebruik kleuren bewust
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/1316846/rodekaartensporza.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/2114962/rodekaartensporza11.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/5786447/pies.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/5923824/DwX6-13X4AA0cBj.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113681/usefuljunk-monster.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113684/usefuljunk-costs.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113713/chart_junk_effective.jpg)
6. Vermijd chart junk
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113675/darkhorse_original.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101494/18_removetoimprove.gif)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101501/devourThePie3.gif)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101464/demorgencirkels.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101466/demorgencirkels_nooverlap.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101472/demorgencirkels_allcirkels.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101468/demorgencirkels_stralen.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101471/demorgencirkels_staven.jpg)
7. Schaal de oppervlakte van cirkels, niet de straal
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067149/rodekaartensporza10.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067152/rodekaartensporza131.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067147/nyt_edited.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067146/nyt_org.png)
8. Vertel het verhaal
9. Geen dubbele assen
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101321/chocolate_countries_large.jpg)
10. Correlatie is geen causaliteit
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101387/jobspie.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/maartenzam/images/1101390/applepie.png)
11. Doe geen 3D
Behalve als je de New York Times bent
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/3067957/obese-adult-population.png)
12. Sorteer op de data
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4385111/hudson_2006.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4717674/precipitation-map_bw.gif)
13. #Endrainbow
Kleuren: tools
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113790/whitehousemap.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113793/trumpmap.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113810/cartogram.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113811/elections2016_symbols.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113813/elections2016_populationdensity.png)
14. Gebruik relatieve cijfers op kaarten (per capita, ...)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113895/energiekaart.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113898/scatterplot.png)
15. Soms is de beste kaart geen kaart
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113930/economist_northkorea_cartofail.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113932/economist_northkorea_corrections.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/4113934/bbc_northkorea_ranges.gif)
16. Alle kaarten liegen
Oefening: de Datavisualization Checklist
III
Grafiektypes & "Chart choosers"
IV
chartType = f(dataTypes,
dataSize,
message,
audience)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7931860/spaghetti.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7940704/vrt-hospitalisations.png)
Chart choosers
Tool chooser
Voorbij staven en lijnen
V
Creatief met punten
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276172/image13.png)
Dot plot
Alternatief voor gegroepeerde staven
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276173/image14.png)
Dot plot
Datadichtheid kan hoog zijn
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276174/image15.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276175/image16.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276176/image17.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7978741/beeswarm-poverty.png)
Creatief met staven
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276188/image29.png)
Marimekko
Creatief met tijd
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276189/image31.png)
Slope chart
Vergelijk 2 momenten in de tijd
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276258/image32.jpg)
Slope chart
Vergelijk 2 momenten in de tijd
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276260/image33.png)
Slope chart
Vergelijk 2 momenten in de tijd
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276259/image34.png)
Horizon chart
Tijdreeksen met een hoge datadensiteit
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276262/image35.gif)
Horizon chart
Tijdreeksen met een hoge datadensiteit
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276261/image36.jpg)
Horizon chart
Tijdreeksen met een hoge datadensiteit
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276267/image41.png)
Connected scatter plot
Trends in 2 dimensies over tijd
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276263/image37.jpg)
Connected scatter plot
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7992643/rollingaverages-2020-12-01.png)
Hierarchie
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276298/image42.png)
Waterfall chart
Cumulatief effect van componenten
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276299/image43.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276300/image44.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/50474/images/7276347/sunburst.png)
Dank!
slides.com/maartenzam/statbel-nl
slides.com/maartenzam/statbel-fr
www.maartenlambrechts.COM
@maartenzam
Datavisualisatie Statbel
By maartenzam
Datavisualisatie Statbel
- 3,906