class: monash-bg-blue center middle hide-slide-number <div class="bg-black white" style="width:45%;right:0;bottom:0;padding-left:5px;border: solid 4px white;margin: auto;"> <i class="fas fa-exclamation-circle"></i> These slides are viewed best by Chrome and occasionally need to be refreshed if elements did not load properly. See here for <a href=part2-session3.pdf>PDF <i class="fas fa-file-pdf"></i></a>. </div> <br> .white[Push the **right arrow key** to see the next slide.] --- count: false background-image: url(images/d2bg4.jpg) background-size: cover class: hide-slide-number title-slide <div class="grid-row" style="grid: 1fr / 2fr;"> .item.center[ # <span style="text-shadow: 2px 2px 30px white;">Data Visualization with R <br> Workshop Part 2</span> <!-- ## <span style="color:yellow;text-shadow: 2px 2px 30px black;">Getting your plots <br> to talk back</span> --> ] .center.shade_black.animated.bounceInUp.slower[ <br><br> ## Getting your plots <br> to talk back <br> Presented by Di Cook Department of Econometrics and Business Statistics <img src="images/monash-one-line-reversed.png" style="width:500px"><br>
<i class="fas fa-envelope faa-float animated "></i>
dicook@monash.edu
<i class="fab fa-twitter faa-float animated faa-fast "></i>
@statsgen .bottom_abs.width100.bg-black[ 6th Dec 2021 @ Statistical Society of Australia NSW Branch | Zoom ] ] </div> --- # Applying interactivity and animation .top10-color-box[The purpose of interactivity is to display more than can be achieved with persistent plot elements, and to invite the reader to engage with the plot.] -- <br><br><br><br> .pull-left[ - .monash-orange2[Mouse-over] labels .monash-blue2[de-clutters] a plot - .monash-orange2[Pan/zoom] allows .monash-blue2[re-focusing] attention - .monash-orange2[Selection] allows .monash-blue2[focusing] attention - .monash-orange2[Linking] .monash-blue2[connects elements] from multiple plots ] -- .pull-right[ .monash-orange2[Animation] allows more information to be displayed, but .monash-blue2[developer keeps control]. Beware that it is easy to .monash-orange2[forget] what was just displayed, so keeping some elements persistent, maybe faint, can be useful for the reader. ] --- class: transition middle # Interactive maps --- # Leaflet .font_small[ ```r load(here::here("data/platypus.rda")) platypus <- platypus %>% filter(year(eventDate) > 2018) platypus %>% leaflet() %>% * addTiles() %>% * addCircleMarkers( * radius = 1, opacity = 0.5, color = "orange", label = ~eventDate, * lat = ~Latitude, lng = ~Longitude) ``` ] ---
--- class: transition middle # Reflection on leaflet <br> <br> .pull-left[ ## Advantages fast, scalable, reliable many map formats ] -- .pull-right[ ## Disadvantages specialist syntax limited capabilities ] --- # Building on ggplot with `plotly` .font_small[ ```r load(here::here("data/oz_map.rda")) p <- ggmap(oz_map) + geom_point(data = platypus, aes(x = Longitude, y = Latitude, label=eventDate), alpha = 0.5, colour = "orange") + theme_map() *ggplotly(p, tooltip = "label") ``` ] --- <center>
</center> --- .font_small[ ] .font_small[ ```r p1 <- ggplot(tb_oz, aes(x = year, y = count, fill = sex)) + * geom_bar(stat = "identity", position = "fill") + facet_wrap(~age_group, ncol = 6) + scale_fill_brewer(name = "Sex", palette = "Dark2") ggplotly(p1) ``` ] <br> <br>
--- # Modifying plotly `plotly` uses elements of `crosstalk` to provide additional interactivity, such as linked highlighting. It only runs in a shiny environment, eg RStudio plot window, so copy the block of code into your R window. .font_small[ ```r *tb_action <- highlight_key(tb_oz, ~age_group) *p2 <- ggplot(tb_action, aes(x = year, y = count)) + geom_line(aes(group = age_group)) + geom_smooth() + facet_wrap(~sex) gg <- ggplotly(p2, height = 300, width = 600) %>% layout(title = "Click on a line to highlight an age group") *highlight(gg) ``` ] --- <img src="images/tb_crosstalk.png" width="95%"> --- # Animations - `gganimate` (Lin-Pederson) allows to make and save animations (also `plotly` can too) - Animations are different from interactive graphics in that the viewer does not have any control - useful for different important stages of a visualization (e.g. time) and to keep track of how different visualizations are related -- - .monash-orange2[makes slides come alive in talks.] --- # An example animation <img src="images/day2-session3/gapminder-1.gif" width="60%" style="display: block; margin: auto;" /> Countries are colored manually by `country_colors` (hue shows continent, saturation is individual country) --- # How does `gganimate` work? #### Start with a ggplot2 specification -- #### Add layers with graphical primitives (geoms) -- #### Add formatting specifications -- #### Add animation specifications --- # A simple example - thanks to Mitch O'Hara Wild for the [example](https://slides.mitchelloharawild.com/wombat-gganimate/#1) #### 1. Start by passing the data to ggplot .left-code[ ```r *ggplot(economics) ``` ] .right-plot[ <img src="images/day2-session3/output1-1.png" width="100%" style="display: block; margin: auto;" /> ] --- # A simple example - thanks to Mitch O'Hara Wild for the [example](https://slides.mitchelloharawild.com/wombat-gganimate/#1) #### 2. add the mapping .left-code[ ```r ggplot(economics) + * aes(date, unemploy) ``` ] .right-plot[ <img src="images/day2-session3/output2-1.png" width="100%" style="display: block; margin: auto;" /> ] --- # A simple example - thanks to Mitch O'Hara Wild for the [example](https://slides.mitchelloharawild.com/wombat-gganimate/#1) #### 3.add a graphical primitive, let's do a line .left-code[ ```r ggplot(economics) + aes(date, unemploy) + * geom_line() ``` ] .right-plot[ <img src="images/day2-session3/output3-1.png" width="100%" style="display: block; margin: auto;" /> ] --- # A simple example - thanks to Mitch O'Hara Wild for the [example](https://slides.mitchelloharawild.com/wombat-gganimate/#1) #### 4. Just one extra line turns this into an animation! .left-code[ ```r ggplot(economics) + aes(date, unemploy) + geom_line() + * transition_reveal(date) ``` ] .right-plot[ <img src="images/day2-session3/output5-anim-1.gif" width="100%" style="display: block; margin: auto;" /> ] --- class: font_smaller2 # Controlling an animation We control plot movement with (a grammar of animation): - Transitions: `transition_*()` define how the data should be spread out and how it relates to itself across time. -- - Views: `view_*()` defines how the positional scales should change along the animation. -- - Shadows: `shadow_*()` defines how data from other points in time should be presented in the given point in time. -- - Entrances/Exits: `enter_*()` and `exit_*()` define how new data should appear and how old data should disappear during the course of the animation. -- - Easing: `ease_aes()` defines how different aesthetics should be eased during transitions. --- .font-smaller[ ```r ggplot(gapminder, aes(gdpPercap, lifeExp, size = pop, colour = country)) + geom_point(alpha = 0.7) + scale_colour_manual(values = country_colors, guide=FALSE) + scale_size("Population size", range = c(2, 12), breaks=c(1*10^8, 2*10^8, 5*10^8, 10^9, 2*20^9)) + scale_x_log10() + facet_wrap(~continent) + theme(legend.position = "none") + # Here comes the gganimate specific bits * labs(title = 'Year: {frame_time}', * x = 'GDP per capita', * y = 'life expectancy') + * gganimate::transition_time(year) + * gganimate::ease_aes('linear') ``` ] --- ## A not-so-simple example, the datasaurus dozen Again, we first pass in the dataset to ggplot .left-code[ .font_small[ ```r library(datasauRus) *ggplot(datasaurus_dozen) ``` ]] .right-plot[ <img src="images/day2-session3/output5-1.png" width="100%" style="display: block; margin: auto;" /> ] --- # What's in the data?
--- ## A not-so-simple example, the datasaurus dozen For each dataset we have x and y values, in addition we can map dataset to color .left-code[ .font_small[ ```r ggplot(datasaurus_dozen) + * aes(x, y, color = dataset) ``` ]] .right-plot[ <img src="images/day2-session3/output6-1.png" width="100%" style="display: block; margin: auto;" /> ] --- ## A not-so-simple example, the datasaurus dozen Trying a simple scatter plot first, but there is too much information .left-code[ .font_small[ ```r ggplot(datasaurus_dozen) + aes(x, y, color = dataset) + * geom_point() + theme(aspect.ratio = 1) ``` ]] .right-plot[ <img src="images/day2-session3/output7-1.png" width="100%" style="display: block; margin: auto;" /> ] --- ## A not-so-simple example, the datasaurus dozen We can use facets to split up by dataset, revealing the different distributions .left-code[ .font_small[ ```r ggplot(datasaurus_dozen) + aes(x, y, color = dataset) + geom_point() + * facet_wrap(~dataset) + theme(aspect.ratio = 1) ``` ]] .right-plot[ <img src="images/day2-session3/output8-1.png" width="100%" style="display: block; margin: auto;" /> ] --- ## A not-so-simple example, the datasaurus dozen We can just as easily turn it into an animation, transitioning between dataset states! .left-code[ .font_small[ ```r ggplot(datasaurus_dozen) + aes(x, y) + geom_point() + * transition_states(dataset, 3, 1) + * labs(title = "Dataset: {closest_state}") + theme(aspect.ratio = 1) ``` ]] .right-plot[ <img src="images/day2-session3/output9-1.gif" width="100%" style="display: block; margin: auto;" /> ] --- # Resources - Carson Sievert [Interactive web-based data visualization with R, plotly, and shiny](https://plotly-r.com) - website for [gganimate](https://gganimate.com/) - Mitch O'Hara-Wild's [tutorial on gganimate](https://github.com/numbats/gganimate-workshop) --- class: exercise middle hide-slide-number <i class="fas fa-users"></i> # <i class="fas fa-code"></i> Open `part2-exercise-03.Rmd` <center>
15
:
00
</center> --- class: font_smaller background-color: #e5e5e5 # Session Information .scroll-350[ ```r devtools::session_info() ``` ``` ## ─ Session info ─────────────────────────────────────────────────────────────── ## setting value ## version R version 4.1.0 (2021-05-18) ## os macOS Big Sur 10.16 ## system x86_64, darwin17.0 ## ui X11 ## language (EN) ## collate en_AU.UTF-8 ## ctype en_AU.UTF-8 ## tz Australia/Melbourne ## date 2021-11-30 ## ## ─ Packages ─────────────────────────────────────────────────────────────────── ## package * version date lib source ## anicon 0.1.0 2021-07-14 [1] Github (emitanaka/anicon@0b756df) ## assertthat 0.2.1 2019-03-21 [1] CRAN (R 4.1.0) ## backports 1.2.1 2020-12-09 [1] CRAN (R 4.1.0) ## base64enc 0.1-3 2015-07-28 [1] CRAN (R 4.1.0) ## bit 4.0.4 2020-08-04 [1] CRAN (R 4.1.0) ## bit64 4.0.5 2020-08-30 [1] CRAN (R 4.1.0) ## bitops 1.0-7 2021-04-24 [1] CRAN (R 4.1.0) ## broom 0.7.9 2021-07-27 [1] CRAN (R 4.1.0) ## bslib 0.3.1 2021-10-06 [1] CRAN (R 4.1.0) ## cachem 1.0.6 2021-08-19 [1] CRAN (R 4.1.0) ## callr 3.7.0 2021-04-20 [1] CRAN (R 4.1.0) ## cellranger 1.1.0 2016-07-27 [1] CRAN (R 4.1.0) ## cli 3.1.0 2021-10-27 [1] CRAN (R 4.1.0) ## codetools 0.2-18 2020-11-04 [1] CRAN (R 4.1.0) ## colorspace 2.0-2 2021-06-24 [1] CRAN (R 4.1.0) ## countdown 0.3.5 2021-07-14 [1] Github (gadenbuie/countdown@a544fa4) ## crayon 1.4.2 2021-10-29 [1] CRAN (R 4.1.0) ## crosstalk 1.2.0 2021-11-04 [1] CRAN (R 4.1.0) ## data.table 1.14.2 2021-09-27 [1] CRAN (R 4.1.0) ## datasauRus * 0.1.4 2018-09-20 [1] CRAN (R 4.1.0) ## DBI 1.1.1 2021-01-15 [1] CRAN (R 4.1.0) ## dbplyr 2.1.1 2021-04-06 [1] CRAN (R 4.1.0) ## desc 1.4.0 2021-09-28 [1] CRAN (R 4.1.0) ## devtools 2.4.2 2021-06-07 [1] CRAN (R 4.1.0) ## digest 0.6.28 2021-09-23 [1] CRAN (R 4.1.0) ## dplyr * 1.0.7.9000 2021-11-30 [1] Github (tidyverse/dplyr@3d61d99) ## DT 0.20 2021-11-15 [1] CRAN (R 4.1.0) ## ellipsis 0.3.2 2021-04-29 [1] CRAN (R 4.1.0) ## evaluate 0.14 2019-05-28 [1] CRAN (R 4.1.0) ## fansi 0.5.0 2021-05-25 [1] CRAN (R 4.1.0) ## farver 2.1.0 2021-02-28 [1] CRAN (R 4.1.0) ## fastmap 1.1.0 2021-01-25 [1] CRAN (R 4.1.0) ## forcats * 0.5.1 2021-01-27 [1] CRAN (R 4.1.0) ## fs 1.5.0 2020-07-31 [1] CRAN (R 4.1.0) ## gapminder * 0.3.0 2017-10-31 [1] CRAN (R 4.1.0) ## generics 0.1.1 2021-10-25 [1] CRAN (R 4.1.0) ## gganimate * 1.0.7 2020-10-15 [1] CRAN (R 4.1.0) ## ggmap * 3.0.0 2019-02-05 [1] CRAN (R 4.1.0) ## ggplot2 * 3.3.5 2021-06-25 [1] CRAN (R 4.1.0) ## ggthemes * 4.2.4 2021-01-20 [1] CRAN (R 4.1.0) ## gifski 1.4.3-1 2021-05-02 [1] CRAN (R 4.1.0) ## glue 1.5.0 2021-11-07 [1] CRAN (R 4.1.0) ## gridExtra 2.3 2017-09-09 [1] CRAN (R 4.1.0) ## gtable 0.3.0 2019-03-25 [1] CRAN (R 4.1.0) ## haven 2.4.1 2021-04-23 [1] CRAN (R 4.1.0) ## here 1.0.1 2020-12-13 [1] CRAN (R 4.1.0) ## highr 0.9 2021-04-16 [1] CRAN (R 4.1.0) ## hms 1.1.1 2021-09-26 [1] CRAN (R 4.1.0) ## htmltools 0.5.2 2021-08-25 [1] CRAN (R 4.1.0) ## htmlwidgets 1.5.4 2021-09-08 [1] CRAN (R 4.1.0) ## httr 1.4.2 2020-07-20 [1] CRAN (R 4.1.0) ## icon 0.1.0 2021-07-14 [1] Github (emitanaka/icon@8458546) ## jpeg 0.1-9 2021-07-24 [1] CRAN (R 4.1.0) ## jquerylib 0.1.4 2021-04-26 [1] CRAN (R 4.1.0) ## jsonlite 1.7.2 2020-12-09 [1] CRAN (R 4.1.0) ## knitr 1.36 2021-09-29 [1] CRAN (R 4.1.0) ## labeling 0.4.2 2020-10-20 [1] CRAN (R 4.1.0) ## lattice 0.20-44 2021-05-02 [1] CRAN (R 4.1.0) ## lazyeval 0.2.2 2019-03-15 [1] CRAN (R 4.1.0) ## leaflet * 2.0.4.1 2021-01-07 [1] CRAN (R 4.1.0) ## lifecycle 1.0.1 2021-09-24 [1] CRAN (R 4.1.0) ## lubridate * 1.8.0 2021-10-07 [1] CRAN (R 4.1.0) ## magrittr 2.0.1 2020-11-17 [1] CRAN (R 4.1.0) ## memoise 2.0.0 2021-01-26 [1] CRAN (R 4.1.0) ## modelr 0.1.8 2020-05-19 [1] CRAN (R 4.1.0) ## munsell 0.5.0 2018-06-12 [1] CRAN (R 4.1.0) ## pillar 1.6.4 2021-10-18 [1] CRAN (R 4.1.0) ## pkgbuild 1.2.0 2020-12-15 [1] CRAN (R 4.1.0) ## pkgconfig 2.0.3 2019-09-22 [1] CRAN (R 4.1.0) ## pkgload 1.2.1 2021-04-06 [1] CRAN (R 4.1.0) ## plotly * 4.10.0 2021-10-09 [1] CRAN (R 4.1.0) ## plyr 1.8.6 2020-03-03 [1] CRAN (R 4.1.0) ## png 0.1-7 2013-12-03 [1] CRAN (R 4.1.0) ## prettyunits 1.1.1 2020-01-24 [1] CRAN (R 4.1.0) ## processx 3.5.2 2021-04-30 [1] CRAN (R 4.1.0) ## progress 1.2.2 2019-05-16 [1] CRAN (R 4.1.0) ## ps 1.6.0 2021-02-28 [1] CRAN (R 4.1.0) ## purrr * 0.3.4 2020-04-17 [1] CRAN (R 4.1.0) ## R6 2.5.1 2021-08-19 [1] CRAN (R 4.1.0) ## RColorBrewer 1.1-2 2014-12-07 [1] CRAN (R 4.1.0) ## Rcpp 1.0.7 2021-07-07 [1] CRAN (R 4.1.0) ## readr * 2.1.0 2021-11-11 [1] CRAN (R 4.1.0) ## readxl 1.3.1 2019-03-13 [1] CRAN (R 4.1.0) ## remotes 2.4.0 2021-06-02 [1] CRAN (R 4.1.0) ## reprex 2.0.0 2021-04-02 [1] CRAN (R 4.1.0) ## RgoogleMaps 1.4.5.3 2020-02-12 [1] CRAN (R 4.1.0) ## rjson 0.2.20 2018-06-08 [1] CRAN (R 4.1.0) ## rlang 0.99.0.9001 2021-11-30 [1] Github (r-lib/rlang@5aefc4a) ## rmarkdown 2.11.3 2021-10-18 [1] Github (rstudio/rmarkdown@ebf0d09) ## rprojroot 2.0.2 2020-11-15 [1] CRAN (R 4.1.0) ## rstudioapi 0.13 2020-11-12 [1] CRAN (R 4.1.0) ## rvest 1.0.1 2021-07-26 [1] CRAN (R 4.1.0) ## sass 0.4.0 2021-05-12 [1] CRAN (R 4.1.0) ## scales 1.1.1 2020-05-11 [1] CRAN (R 4.1.0) ## sessioninfo 1.1.1 2018-11-05 [1] CRAN (R 4.1.0) ## sp 1.4-6 2021-11-14 [1] CRAN (R 4.1.0) ## stringi 1.7.5 2021-10-04 [1] CRAN (R 4.1.0) ## stringr * 1.4.0 2019-02-10 [1] CRAN (R 4.1.0) ## testthat 3.0.4 2021-07-01 [1] CRAN (R 4.1.0) ## tibble * 3.1.6 2021-11-07 [1] CRAN (R 4.1.0) ## tidyr * 1.1.4 2021-09-27 [1] CRAN (R 4.1.0) ## tidyselect 1.1.1 2021-04-30 [1] CRAN (R 4.1.0) ## tidyverse * 1.3.1 2021-04-15 [1] CRAN (R 4.1.0) ## tweenr 1.0.2 2021-03-23 [1] CRAN (R 4.1.0) ## tzdb 0.2.0 2021-10-27 [1] CRAN (R 4.1.0) ## usethis 2.1.0 2021-10-16 [1] CRAN (R 4.1.0) ## utf8 1.2.2 2021-07-24 [1] CRAN (R 4.1.0) ## vctrs 0.3.8 2021-04-29 [1] CRAN (R 4.1.0) ## viridis * 0.6.1 2021-05-11 [1] CRAN (R 4.1.0) ## viridisLite * 0.4.0 2021-04-13 [1] CRAN (R 4.1.0) ## vroom 1.5.6 2021-11-10 [1] CRAN (R 4.1.0) ## whisker 0.4 2019-08-28 [1] CRAN (R 4.1.0) ## withr 2.4.2 2021-04-18 [1] CRAN (R 4.1.0) ## xaringan 0.22 2021-06-23 [1] CRAN (R 4.1.0) ## xfun 0.28 2021-11-04 [1] CRAN (R 4.1.0) ## xml2 1.3.2 2020-04-23 [1] CRAN (R 4.1.0) ## yaml 2.2.1 2020-02-01 [1] CRAN (R 4.1.0) ## ## [1] /Library/Frameworks/R.framework/Versions/4.1/Resources/library ``` ] These slides are licensed under <br><center><a href="https://creativecommons.org/licenses/by-sa/3.0/au/"><img src="images/cc.svg" style="height:2em;"/><img src="images/by.svg" style="height:2em;"/><img src="images/sa.svg" style="height:2em;"/></a></center>