class: center, middle, inverse, title-slide # A minimal flipbook ## With flipbookr and xaringan ### You! --- --- background-image: url(images_for_lecture/ggplot_beautiful_examples.png) background-size: contain --- Function of Data Viz: "The simple graph has brought more information to the data analyst’s mind than any other device" --- # Use *visual channels* to communicated information - consumed "pre-attentive processing" (McGill and Cleveland) --- ## Key Aesthetics: ```r # knitr::include_graphics("images_for_lecture/common-aesthetics-1.png") ``` From Fundamentals of Data Visualization - Clause Wilke --- class: # A famous data visualization presentation https://www.youtube.com/embed/jbkSRLYSojo?list=PL6F8D7054D12E7C5A -- What are the variables that are represented in the data vizualization? -- What are the *aesthetics* (visual channels) are used to represent variables? -- What are the aesthetic mappings (variable <-> aesthetic pairings) -- --- # Hans Rosling <iframe width="767" height="431" src="https://www.youtube.com/embed/jbkSRLYSojo?list=PL6F8D7054D12E7C5A" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> https://www.youtube.com/embed/jbkSRLYSojo?list=PL6F8D7054D12E7C5A --- # definition of a data visualization... --- # A data visualization is made up of ... -- ### .left[... geometric objects ...] -- ### .center[...that take on aesthetics (color, line width, x-position) ...] -- ### .center[...which represent variables ...] -- ### .right[...from a dataset (dataframe)] --- # The "Grammar of Graphics" - 1999 ```r # knitr::include_graphics("images_for_lecture/wilkinson_grammar_of_graphics.png") ``` --- ## Elements of the Grammar of Graphics (choices) ```r # knitr::include_graphics("images_for_lecture/wilkinson_layers_grammar_of_graphics.png") ``` --- ### A series of choices: - choose data -- - choose aesthetic mapping (what aesthetics will represent what variables) -- - choose geometric objects -- - make decision to facet or not -- - make choice to summarize data or not (statistics) -- - choose a coordinate system -- - make thematic choices --- # Implementations # Tableau Polaris -> Tableau - Acquired for 15.7 Billion dollars (salesforce) -- # Vega Lite... (dynamic, interactive data visualizations in web browsers) -- # ggplot2 (in R) --- count: false # Old faithful .panel1-faithful-auto[ ```r *library(tidyverse) ``` ] .panel2-faithful-auto[ ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) *faithful ``` ] .panel2-faithful-auto[ ``` eruptions waiting 1 3.600 79 2 1.800 54 3 3.333 74 4 2.283 62 5 4.533 85 6 2.883 55 7 4.700 88 8 3.600 85 9 1.950 51 10 4.350 85 11 1.833 54 12 3.917 84 13 4.200 78 14 1.750 47 15 4.700 83 16 2.167 52 17 1.750 62 18 4.800 84 19 1.600 52 20 4.250 79 21 1.800 51 22 1.750 47 23 3.450 78 24 3.067 69 25 4.533 74 26 3.600 83 27 1.967 55 28 4.083 76 29 3.850 78 30 4.433 79 31 4.300 73 32 4.467 77 33 3.367 66 34 4.033 80 35 3.833 74 36 2.017 52 37 1.867 48 38 4.833 80 39 1.833 59 40 4.783 90 41 4.350 80 42 1.883 58 43 4.567 84 44 1.750 58 45 4.533 73 46 3.317 83 47 3.833 64 48 2.100 53 49 4.633 82 50 2.000 59 51 4.800 75 52 4.716 90 53 1.833 54 54 4.833 80 55 1.733 54 56 4.883 83 57 3.717 71 58 1.667 64 59 4.567 77 60 4.317 81 61 2.233 59 62 4.500 84 63 1.750 48 64 4.800 82 65 1.817 60 66 4.400 92 67 4.167 78 68 4.700 78 69 2.067 65 70 4.700 73 71 4.033 82 72 1.967 56 73 4.500 79 74 4.000 71 75 1.983 62 76 5.067 76 77 2.017 60 78 4.567 78 79 3.883 76 80 3.600 83 81 4.133 75 82 4.333 82 83 4.100 70 84 2.633 65 85 4.067 73 86 4.933 88 87 3.950 76 88 4.517 80 89 2.167 48 90 4.000 86 91 2.200 60 92 4.333 90 93 1.867 50 94 4.817 78 95 1.833 63 96 4.300 72 97 4.667 84 98 3.750 75 99 1.867 51 100 4.900 82 101 2.483 62 102 4.367 88 103 2.100 49 104 4.500 83 105 4.050 81 106 1.867 47 107 4.700 84 108 1.783 52 109 4.850 86 110 3.683 81 111 4.733 75 112 2.300 59 113 4.900 89 114 4.417 79 115 1.700 59 116 4.633 81 117 2.317 50 118 4.600 85 119 1.817 59 120 4.417 87 121 2.617 53 122 4.067 69 123 4.250 77 124 1.967 56 125 4.600 88 126 3.767 81 127 1.917 45 128 4.500 82 129 2.267 55 130 4.650 90 131 1.867 45 132 4.167 83 133 2.800 56 134 4.333 89 135 1.833 46 136 4.383 82 137 1.883 51 138 4.933 86 139 2.033 53 140 3.733 79 141 4.233 81 142 2.233 60 143 4.533 82 144 4.817 77 145 4.333 76 146 1.983 59 147 4.633 80 148 2.017 49 149 5.100 96 150 1.800 53 151 5.033 77 152 4.000 77 153 2.400 65 154 4.600 81 155 3.567 71 156 4.000 70 157 4.500 81 158 4.083 93 159 1.800 53 160 3.967 89 161 2.200 45 162 4.150 86 163 2.000 58 164 3.833 78 165 3.500 66 166 4.583 76 167 2.367 63 168 5.000 88 169 1.933 52 170 4.617 93 171 1.917 49 172 2.083 57 173 4.583 77 174 3.333 68 175 4.167 81 176 4.333 81 177 4.500 73 178 2.417 50 179 4.000 85 180 4.167 74 181 1.883 55 182 4.583 77 183 4.250 83 184 3.767 83 185 2.033 51 186 4.433 78 187 4.083 84 188 1.833 46 189 4.417 83 190 2.183 55 191 4.800 81 192 1.833 57 193 4.800 76 194 4.100 84 195 3.966 77 196 4.233 81 197 3.500 87 198 4.366 77 199 2.250 51 200 4.667 78 201 2.100 60 202 4.350 82 203 4.133 91 204 1.867 53 205 4.600 78 206 1.783 46 207 4.367 77 208 3.850 84 209 1.933 49 210 4.500 83 211 2.383 71 212 4.700 80 213 1.867 49 214 3.833 75 215 3.417 64 216 4.233 76 217 2.400 53 218 4.800 94 219 2.000 55 220 4.150 76 221 1.867 50 222 4.267 82 223 1.750 54 224 4.483 75 225 4.000 78 226 4.117 79 227 4.083 78 228 4.267 78 229 3.917 70 230 4.550 79 231 4.083 70 232 2.417 54 233 4.183 86 234 2.217 50 235 4.450 90 236 1.883 54 237 1.850 54 238 4.283 77 239 3.950 79 240 2.333 64 241 4.150 75 242 2.350 47 243 4.933 86 244 2.900 63 245 4.583 85 246 3.833 82 247 2.083 57 248 4.367 82 249 2.133 67 250 4.350 74 251 2.200 54 252 4.450 83 253 3.567 73 254 4.500 73 255 4.150 88 256 3.817 80 257 3.917 71 258 4.450 83 259 2.000 56 260 4.283 79 261 4.767 78 262 4.533 84 263 1.850 58 264 4.250 83 265 1.983 43 266 2.250 60 267 4.750 75 268 4.117 81 269 2.150 46 270 4.417 90 271 1.817 46 272 4.467 74 ``` ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) faithful %>% * mutate(long_eruption = * eruptions >= 3) ``` ] .panel2-faithful-auto[ ``` eruptions waiting long_eruption 1 3.600 79 TRUE 2 1.800 54 FALSE 3 3.333 74 TRUE 4 2.283 62 FALSE 5 4.533 85 TRUE 6 2.883 55 FALSE 7 4.700 88 TRUE 8 3.600 85 TRUE 9 1.950 51 FALSE 10 4.350 85 TRUE 11 1.833 54 FALSE 12 3.917 84 TRUE 13 4.200 78 TRUE 14 1.750 47 FALSE 15 4.700 83 TRUE 16 2.167 52 FALSE 17 1.750 62 FALSE 18 4.800 84 TRUE 19 1.600 52 FALSE 20 4.250 79 TRUE 21 1.800 51 FALSE 22 1.750 47 FALSE 23 3.450 78 TRUE 24 3.067 69 TRUE 25 4.533 74 TRUE 26 3.600 83 TRUE 27 1.967 55 FALSE 28 4.083 76 TRUE 29 3.850 78 TRUE 30 4.433 79 TRUE 31 4.300 73 TRUE 32 4.467 77 TRUE 33 3.367 66 TRUE 34 4.033 80 TRUE 35 3.833 74 TRUE 36 2.017 52 FALSE 37 1.867 48 FALSE 38 4.833 80 TRUE 39 1.833 59 FALSE 40 4.783 90 TRUE 41 4.350 80 TRUE 42 1.883 58 FALSE 43 4.567 84 TRUE 44 1.750 58 FALSE 45 4.533 73 TRUE 46 3.317 83 TRUE 47 3.833 64 TRUE 48 2.100 53 FALSE 49 4.633 82 TRUE 50 2.000 59 FALSE 51 4.800 75 TRUE 52 4.716 90 TRUE 53 1.833 54 FALSE 54 4.833 80 TRUE 55 1.733 54 FALSE 56 4.883 83 TRUE 57 3.717 71 TRUE 58 1.667 64 FALSE 59 4.567 77 TRUE 60 4.317 81 TRUE 61 2.233 59 FALSE 62 4.500 84 TRUE 63 1.750 48 FALSE 64 4.800 82 TRUE 65 1.817 60 FALSE 66 4.400 92 TRUE 67 4.167 78 TRUE 68 4.700 78 TRUE 69 2.067 65 FALSE 70 4.700 73 TRUE 71 4.033 82 TRUE 72 1.967 56 FALSE 73 4.500 79 TRUE 74 4.000 71 TRUE 75 1.983 62 FALSE 76 5.067 76 TRUE 77 2.017 60 FALSE 78 4.567 78 TRUE 79 3.883 76 TRUE 80 3.600 83 TRUE 81 4.133 75 TRUE 82 4.333 82 TRUE 83 4.100 70 TRUE 84 2.633 65 FALSE 85 4.067 73 TRUE 86 4.933 88 TRUE 87 3.950 76 TRUE 88 4.517 80 TRUE 89 2.167 48 FALSE 90 4.000 86 TRUE 91 2.200 60 FALSE 92 4.333 90 TRUE 93 1.867 50 FALSE 94 4.817 78 TRUE 95 1.833 63 FALSE 96 4.300 72 TRUE 97 4.667 84 TRUE 98 3.750 75 TRUE 99 1.867 51 FALSE 100 4.900 82 TRUE 101 2.483 62 FALSE 102 4.367 88 TRUE 103 2.100 49 FALSE 104 4.500 83 TRUE 105 4.050 81 TRUE 106 1.867 47 FALSE 107 4.700 84 TRUE 108 1.783 52 FALSE 109 4.850 86 TRUE 110 3.683 81 TRUE 111 4.733 75 TRUE 112 2.300 59 FALSE 113 4.900 89 TRUE 114 4.417 79 TRUE 115 1.700 59 FALSE 116 4.633 81 TRUE 117 2.317 50 FALSE 118 4.600 85 TRUE 119 1.817 59 FALSE 120 4.417 87 TRUE 121 2.617 53 FALSE 122 4.067 69 TRUE 123 4.250 77 TRUE 124 1.967 56 FALSE 125 4.600 88 TRUE 126 3.767 81 TRUE 127 1.917 45 FALSE 128 4.500 82 TRUE 129 2.267 55 FALSE 130 4.650 90 TRUE 131 1.867 45 FALSE 132 4.167 83 TRUE 133 2.800 56 FALSE 134 4.333 89 TRUE 135 1.833 46 FALSE 136 4.383 82 TRUE 137 1.883 51 FALSE 138 4.933 86 TRUE 139 2.033 53 FALSE 140 3.733 79 TRUE 141 4.233 81 TRUE 142 2.233 60 FALSE 143 4.533 82 TRUE 144 4.817 77 TRUE 145 4.333 76 TRUE 146 1.983 59 FALSE 147 4.633 80 TRUE 148 2.017 49 FALSE 149 5.100 96 TRUE 150 1.800 53 FALSE 151 5.033 77 TRUE 152 4.000 77 TRUE 153 2.400 65 FALSE 154 4.600 81 TRUE 155 3.567 71 TRUE 156 4.000 70 TRUE 157 4.500 81 TRUE 158 4.083 93 TRUE 159 1.800 53 FALSE 160 3.967 89 TRUE 161 2.200 45 FALSE 162 4.150 86 TRUE 163 2.000 58 FALSE 164 3.833 78 TRUE 165 3.500 66 TRUE 166 4.583 76 TRUE 167 2.367 63 FALSE 168 5.000 88 TRUE 169 1.933 52 FALSE 170 4.617 93 TRUE 171 1.917 49 FALSE 172 2.083 57 FALSE 173 4.583 77 TRUE 174 3.333 68 TRUE 175 4.167 81 TRUE 176 4.333 81 TRUE 177 4.500 73 TRUE 178 2.417 50 FALSE 179 4.000 85 TRUE 180 4.167 74 TRUE 181 1.883 55 FALSE 182 4.583 77 TRUE 183 4.250 83 TRUE 184 3.767 83 TRUE 185 2.033 51 FALSE 186 4.433 78 TRUE 187 4.083 84 TRUE 188 1.833 46 FALSE 189 4.417 83 TRUE 190 2.183 55 FALSE 191 4.800 81 TRUE 192 1.833 57 FALSE 193 4.800 76 TRUE 194 4.100 84 TRUE 195 3.966 77 TRUE 196 4.233 81 TRUE 197 3.500 87 TRUE 198 4.366 77 TRUE 199 2.250 51 FALSE 200 4.667 78 TRUE 201 2.100 60 FALSE 202 4.350 82 TRUE 203 4.133 91 TRUE 204 1.867 53 FALSE 205 4.600 78 TRUE 206 1.783 46 FALSE 207 4.367 77 TRUE 208 3.850 84 TRUE 209 1.933 49 FALSE 210 4.500 83 TRUE 211 2.383 71 FALSE 212 4.700 80 TRUE 213 1.867 49 FALSE 214 3.833 75 TRUE 215 3.417 64 TRUE 216 4.233 76 TRUE 217 2.400 53 FALSE 218 4.800 94 TRUE 219 2.000 55 FALSE 220 4.150 76 TRUE 221 1.867 50 FALSE 222 4.267 82 TRUE 223 1.750 54 FALSE 224 4.483 75 TRUE 225 4.000 78 TRUE 226 4.117 79 TRUE 227 4.083 78 TRUE 228 4.267 78 TRUE 229 3.917 70 TRUE 230 4.550 79 TRUE 231 4.083 70 TRUE 232 2.417 54 FALSE 233 4.183 86 TRUE 234 2.217 50 FALSE 235 4.450 90 TRUE 236 1.883 54 FALSE 237 1.850 54 FALSE 238 4.283 77 TRUE 239 3.950 79 TRUE 240 2.333 64 FALSE 241 4.150 75 TRUE 242 2.350 47 FALSE 243 4.933 86 TRUE 244 2.900 63 FALSE 245 4.583 85 TRUE 246 3.833 82 TRUE 247 2.083 57 FALSE 248 4.367 82 TRUE 249 2.133 67 FALSE 250 4.350 74 TRUE 251 2.200 54 FALSE 252 4.450 83 TRUE 253 3.567 73 TRUE 254 4.500 73 TRUE 255 4.150 88 TRUE 256 3.817 80 TRUE 257 3.917 71 TRUE 258 4.450 83 TRUE 259 2.000 56 FALSE 260 4.283 79 TRUE 261 4.767 78 TRUE 262 4.533 84 TRUE 263 1.850 58 FALSE 264 4.250 83 TRUE 265 1.983 43 FALSE 266 2.250 60 FALSE 267 4.750 75 TRUE 268 4.117 81 TRUE 269 2.150 46 FALSE 270 4.417 90 TRUE 271 1.817 46 FALSE 272 4.467 74 TRUE ``` ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) faithful %>% mutate(long_eruption = eruptions >= 3) %>% * ggplot() ``` ] .panel2-faithful-auto[ <!-- --> ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) faithful %>% mutate(long_eruption = eruptions >= 3) %>% ggplot() + * aes(x = waiting) ``` ] .panel2-faithful-auto[ <!-- --> ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) faithful %>% mutate(long_eruption = eruptions >= 3) %>% ggplot() + aes(x = waiting) + * geom_dotplot(binwidth = 1) ``` ] .panel2-faithful-auto[ <!-- --> ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) faithful %>% mutate(long_eruption = eruptions >= 3) %>% ggplot() + aes(x = waiting) + geom_dotplot(binwidth = 1) + * aes(fill = long_eruption) ``` ] .panel2-faithful-auto[ <!-- --> ] --- count: false # Old faithful .panel1-faithful-auto[ ```r library(tidyverse) faithful %>% mutate(long_eruption = eruptions >= 3) %>% ggplot() + aes(x = waiting) + geom_dotplot(binwidth = 1) + aes(fill = long_eruption) + * facet_grid(rows = vars(long_eruption)) ``` ] .panel2-faithful-auto[ <!-- --> ] <style> .panel1-faithful-auto { color: black; width: 38.6060606060606%; hight: 32%; float: left; padding-left: 1%; font-size: 80% } .panel2-faithful-auto { color: black; width: 59.3939393939394%; hight: 32%; float: left; padding-left: 1%; font-size: 80% } .panel3-faithful-auto { color: black; width: NA%; hight: 33%; float: left; padding-left: 1%; font-size: 80% } </style>