diff --git a/R/slide-things.R b/R/slide-things.R new file mode 100644 index 0000000..9bffde7 --- /dev/null +++ b/R/slide-things.R @@ -0,0 +1,49 @@ +slide_buttons <- function(slide_id) { + glue::glue('

View all slides in new window Download PDF of all slides

') +} + +slide_tabs <- function(slide_df, slide_url) { + slugify <- function(x) { + x <- stringr::str_replace_all(x, "[^[:alnum:] ]", "") + x <- stringr::str_replace_all(x, " ", "-") + x <- stringr::str_to_lower(x) + return(x) + } + + nav_li <- function(title, selected = FALSE) { + select_flag <- ifelse(selected, "true", "false") + active_flag <- ifelse(selected, " active", "") + out <- glue::glue('
  • \n', + '', + '{title}\n', + '
    • ') + return(out) + } + + tab_pane <- function(title, slide, active, url) { + select_flag <- ifelse(active, " show active", "") + out <- glue::glue('
    \n', + '
    \n', + '\n', + '
    \n
    ') + return(out) + } + + sections <- dplyr::mutate( + slide_df, + li = purrr::pmap_chr(list(title, active), nav_li), + pane = purrr::pmap_chr(list(title, slide, active, slide_url), tab_pane) + ) + + tabset <- paste('', + '
    ', + paste(sections$pane, collapse = "\n"), + '
    ', sep = "\n") + + cat(tabset) +} diff --git a/R/youtube-playlist.R b/R/youtube-playlist.R new file mode 100644 index 0000000..0c60546 --- /dev/null +++ b/R/youtube-playlist.R @@ -0,0 +1,27 @@ +youtube_list <- function(video_df, playlist_id, example = FALSE) { + if (example) { + intro_p <- glue::glue("There's a set of videos that walks through each section below. To make it easier for you to jump around the video examples, I cut the long video into smaller pieces and included them all in [one YouTube playlist](https://www.youtube.com/playlist?list={playlist_id}).") + } else { + intro_p <- glue::glue("Videos for each section of the lecture are [available at this YouTube playlist](https://www.youtube.com/playlist?list={playlist_id}).") + } + + videos_in_list <- dplyr::mutate( + video_df, + li = purrr::map2_chr( + title, youtube_id, ~{ + glue::glue("- [{.x}](https://www.youtube.com/watch?v={.y}&list={playlist_id})") + }) + ) + + video_embed <- glue::glue('
    + +
    ') + + final <- paste(intro_p, + paste(videos_in_list$li, collapse = "\n"), + "You can also watch the playlist (and skip around to different sections) here:", + video_embed, + sep = "\n\n") + + cat(final) +} diff --git a/_quarto.yml b/_quarto.yml index 2558774..3c24eb4 100644 --- a/_quarto.yml +++ b/_quarto.yml @@ -52,37 +52,41 @@ website: - section: "Overview" contents: - content/index.qmd - - section: "Capitalism, markets, and public policy" + - section: "Foundations" contents: - - text: "1: Capitalism and measurement" + - text: "1: Truth, beauty, and data + the tidyverse" file: content/01-content.qmd - - text: "2: Governments and institutions" + - text: "2: Graphic design" file: content/02-content.qmd - - text: "3: Social interactions and economic outcomes" + - text: "3: Mapping data to graphics" file: content/03-content.qmd - - text: "4: Fairness and efficiency" - file: content/04-content.qmd - - section: "Economic models" + - section: "Core types of graphics" contents: - - text: "5–6: Work, wellbeing, and scarcity" + - text: "4: Amounts and proportions" + file: content/04-content.qmd + - text: "5: Themes" file: content/05-content.qmd - - text: "7–8: The firm" + - text: "6: Uncertainty" + file: content/06-content.qmd + - text: "7: Relationships" file: content/07-content.qmd - - text: "9–10: Firms and markets" + - text: "8: Comparisons" + file: content/08-content.qmd + - text: "9: Annotations" file: content/09-content.qmd - - section: "Market failures and institutions" + - section: "Special applications" contents: - - text: "11: Institutions, power, and inequality" + - text: "10: Interactivity" + file: content/10-content.qmd + - text: "11: Time" file: content/11-content.qmd - - text: "12: Market failures" + - text: "12: Space" file: content/12-content.qmd - - text: "13: When governments go wrong" + - text: "13: Text" file: content/13-content.qmd - - text: "14: Institutional alternatives" + - text: "14: Enhancing graphics" file: content/14-content.qmd - - section: "Conclusions" - contents: - - text: "15: Markets, public policy, and public administration" + - text: "15: Truth, beauty, and data revisited" file: content/15-content.qmd - title: "Examples" diff --git a/content/01-content.qmd b/content/01-content.qmd new file mode 100755 index 0000000..9615027 --- /dev/null +++ b/content/01-content.qmd @@ -0,0 +1,61 @@ +--- +title: "Truth, beauty, and data + R and tidyverse" +date: "2022-06-06" +date_end: "2022-06-10" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sHom5NPjrZAeMTYS5orTl9c" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "tVcomh6jQ2Y", "Introduction", "1", TRUE, + "UbQ8IW3UI9E", "Facts, truth, and beauty", "facts-truth-beauty", FALSE, + "DldFVc08YY4", "Data, truth, and beauty", "data-truth-beauty", FALSE, + "6MTC9uGMNFg", "Beautiful visualizations", "beautiful-visualizations", FALSE, + "_TclSs8iLMY", "Class details", "class-details", FALSE +) +``` + +## Readings + +- The [syllabus](/syllabus/), [content](/content/), [lessons](/lesson/), [examples](/example/), and [assignments](/assigment/) pages for this class +- Tim Harford, ["Florence Nightingale: Data Viz Pioneer,"](https://99percentinvisible.org/episode/florence-nightingale-data-viz-pioneer/) *99% Invisible*, episode 433, March 2, 2021 (*this is a podcast; listen to it in your browser or use an app like [Overcast](https://overcast.fm/) or [Spotify](https://spotify.com/)*) +- [Chapter 1](http://socviz.co/lookatdata.html) in Kieran Healy, *Data Visualization* [@Healy:2018] +- Chapters 2 and 3 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] (*skim the introduction and chapter 1*) +- [Study: Charts change hearts and minds better than words do](https://www.washingtonpost.com/news/wonk/wp/2018/06/15/study-charts-change-hearts-and-minds-better-than-words-do/?utm_term=.4474599c0d5e) + + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- How do we know what is true? +- Are facts truth? +- Why do we visualize data? +- What makes a great visualization? +- How do you choose which kind of visualization to use? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/01-slides") +slide_tabs(slide_details, "/slides/01-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` diff --git a/content/02-content.qmd b/content/02-content.qmd new file mode 100755 index 0000000..6d923d5 --- /dev/null +++ b/content/02-content.qmd @@ -0,0 +1,59 @@ +--- +title: "Graphic design" +date: "2022-06-06" +date_end: "2022-06-10" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sEznTwka0EmWfkkphjncq7U" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "ny7HYqyVNp4", "Introduction", "1", TRUE, + "SXW0RtenLgk", "Truth, beauty, stories, design", "truth-beauty-design", FALSE, + "iuEwh2EnIcw", "Graphic design and CRAP", "design-crap", FALSE, + "j0aqBmRV66A", "Image types", "image-types", FALSE +) +``` + +## Readings + +- Chapter 5 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- [Chapter 4](https://clauswilke.com/dataviz/color-basics.html) and [Chapter 27](https://clauswilke.com/dataviz/image-file-formats.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- Cédric Scherer, ["Colors and emotions in data visualization"](https://blog.datawrapper.de/colors-for-data-vis-style-guides/) +- Lisa Charlotte Muth, ["A detailed guide to colors in data vis style guides"](https://www.storytellingwithdata.com/blog/2021/6/8/colors-and-emotions-in-data-visualization). You can skim this—this is a good resource for future you. +- [Summary of CRAP graphic design principles](http://www.presentationzen.com/chapter6_spread.pdf) from Garr Reynolds, *Presentation Zen* [@Reynolds:2008]. These principles are from Robin Williams' [*The Non-Designer's Design & Type Books*](https://www.amazon.com/Non-Designers-Design-Book-4th/dp/0133966151) [@Williams:2008], which you should really get if you're interested in doing anything design-related ever. Her stuff is life-changing. +- [Typography in ten minutes](https://practicaltypography.com/typography-in-ten-minutes.html). The rest of the *Practical Typography* book is phenomenal and you'd be remiss if you didn't read the whole thing and bookmark it for life, but for now just read this quick summary. +- ["What's the Difference Between JPG, PNG, and GIF?"](https://gizmodo.com/5656669/whats-the-difference-between-jpg-png-and-gif) +- ["File formats explained"](https://www.theglowstudio.com/file-formats-explained/) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- Why does graphic design matter when conveying truth? +- What makes something well designed (vs. poorly designed)? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/02-slides") +slide_tabs(slide_details, "/slides/02-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` diff --git a/content/03-content.qmd b/content/03-content.qmd new file mode 100755 index 0000000..3359b37 --- /dev/null +++ b/content/03-content.qmd @@ -0,0 +1,60 @@ +--- +title: "Mapping data to graphics" +date: "2022-06-13" +date_end: "2022-06-17" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sF-mpzuaQaDw5VoOgp359Z9" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "ukDGvD3XXHg", "Introduction", "1", TRUE, + "S56YAocj-hk", "Data, aesthetics, and the grammar of graphics", "grammar-of-graphics", FALSE, + "DVr8ubJ7JHk", "Grammatical layers", "grammatical-layers", FALSE, + "pfYkWZcTHAM", "Aesthetics in extra dimensions", "extra-dimensions", FALSE, + "KHpZ1oa_99g", "Tidy data", "tidy-data", FALSE +) +``` + +## Readings + +- Hans Rosling, ["200 Countries, 200 Years, 4 Minutes"](https://www.youtube.com/watch?v=jbkSRLYSojo) +- [Chapter 2](https://clauswilke.com/dataviz/aesthetic-mapping.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- [Chapter 3](http://socviz.co/makeplot.html) in Kieran Healy, *Data Visualization* [@Healy:2018] + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- Why is it important to visualize variables and data? +- What does it mean to map data to graph aesthetics? +- What data was mapped to which aesthetics in Rosling's video? + +## Other resources + +[This tutorial by Cédric Scherer](https://www.cedricscherer.com/2019/05/17/the-evolution-of-a-ggplot-ep.-1/) is an excellent demonstration of the grammar of graphics and the sequential nature of building up a plot layer-by-layer. + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/03-slides") +slide_tabs(slide_details, "/slides/03-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` diff --git a/content/04-content.qmd b/content/04-content.qmd new file mode 100755 index 0000000..83c590b --- /dev/null +++ b/content/04-content.qmd @@ -0,0 +1,108 @@ +--- +title: "Amounts and proportions" +date: "2022-06-13" +date_end: "2022-06-17" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sEdnMYtNP3U3C2AsQZycEyP" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "K8wELKhqgn0", "Introduction", "1", TRUE, + "pBpNaopKCVw", "Reproducibility", "reproducibility", FALSE, + "5riA81CcHOY", "Amounts", "amounts", FALSE, + "3rDH0BWeDIQ", "Proportions", "proportions", FALSE +) +``` + +## Readings + +- [Chapter 6](https://clauswilke.com/dataviz/visualizing-amounts.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- Chapter 6 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- [Chapter 10](https://clauswilke.com/dataviz/visualizing-proportions.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- [Engaging Readers with Square Pie/Waffle Charts](https://eagereyes.org/blog/2008/engaging-readers-with-square-pie-waffle-charts) +- [Understanding Pie Charts](https://eagereyes.org/techniques/pie-charts) +- [Square pie chart beats out the rest in perception study](https://flowingdata.com/2016/07/15/square-pie-chart-beats-out-the-rest-in-perception-study/) +- [Twitter thread](https://twitter.com/janinegibson/status/1244519429825802240) from John Burn-Murdoch on why the *Financial Times* uses log scales in their COVID-19 tracking charts +- [Tweet](https://twitter.com/jburnmurdoch/status/1238914490772701185) and [Twitter thread](https://twitter.com/jburnmurdoch/status/1242904596856614912) from John Burn-Murdoch on why the *Financial Times* doesn't use population-adjusted numbers in their COVID-19 tracking charts +- [Video from the *Financial Times* about the design decisions behind their COVID-19 tracking charts](https://twitter.com/janinegibson/status/1244519429825802240) + +### Recommended + +- [See how to create your own COVID-19 tracking chart with R](https://robjhyndman.com/hyndsight/logratios-covid19/) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- How do these types of visualizations help or hinder our search for truth in data? +- What do you think of the *Financial Times* explanations of their use of absolute numbers (not per capita numbers) and log scales (not regular scales)? How have these decisions affected your perception of the pandemic? How have they affected others' perceptions? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/04-slides") +slide_tabs(slide_details, "/slides/04-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sEdnMYtNP3U3C2AsQZycEyP + +https://youtu.be/K8wELKhqgn0 +PMAP 8921 • (4) Amounts and Proportions: (0) Introduction + +Introduction to the class session on amounts and proportions. + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/03-content/ + + +https://youtu.be/pBpNaopKCVw +PMAP 8921 • (4) Amounts and Proportions: (1) Reproducibility + +Discussion about the importance of reproducible data analysis practices. + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/03-content/ + + +https://youtu.be/5riA81CcHOY +PMAP 8921 • (4) Amounts and Proportions: (2) Amounts + +Discussion of best practices for visualizing amounts. + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/03-content/ + + +https://youtu.be/3rDH0BWeDIQ +PMAP 8921 • (4) Amounts and Proportions: (3) Proportions + +Discussion of best practices for visualizing proportions. + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/03-content/ + + +https://youtu.be/zrT-ThV6U6M +PMAP 8921 • (4) Amounts and Proportions: Example + +Complete walkthrough of how to visualize amounts and proportions with a bar chart, lollipop chart, strip plot, beeswarm plot, and heatmap using ggplot2 and R + +Access the data, code, and other materials at https://datavizm20.classes.andrewheiss.com/example/04-example/ +``` diff --git a/content/05-content.qmd b/content/05-content.qmd new file mode 100755 index 0000000..7a787da --- /dev/null +++ b/content/05-content.qmd @@ -0,0 +1,93 @@ +--- +title: "Themes" +date: "2022-06-20" +date_end: "2022-06-24" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sEsSJ16BKgXPNFcl3y6gjEv" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "s9YBf8Rf21s", "Introduction", "1", TRUE, + "BQ3wRMAMeBQ", "CRAP and ggplot", "crap-ggplot", FALSE, + "V0CzheP9yMc", "The anatomy of a ggplot theme", "anatomy", FALSE +) +``` + +## Readings + +- [Chapter 22](https://clauswilke.com/dataviz/figure-titles-captions.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- [Naomi Robbins, "Are Grid Lines Useful or Chartjunk?"](https://www.forbes.com/sites/naomirobbins/2012/02/22/are-grid-lines-useful-or-chartjunk/#3b49a4044283) +- [Stephen Few, "Grid Lines in Graphs are Rarely Useful"](http://www.perceptualedge.com/articles/dmreview/grid_lines.pdf) +- [Henry Wang, "ggplot2 Theme Elements Demonstration"](https://henrywang.nl/ggplot2-theme-elements-demonstration/) +- Glance through the documentation for ggplot's [complete themes](https://ggplot2.tidyverse.org/reference/ggtheme.html) and [`theme()`](https://ggplot2.tidyverse.org/reference/theme.html), especially the examples near the bottom + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- How do the principles of CRAP apply to graph design and other theme elements? +- Should plots use gridlines? Naomi Robbins says yes; Stephen Few says no—what do you say? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/05-slides") +slide_tabs(slide_details, "/slides/05-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sEsSJ16BKgXPNFcl3y6gjEv + +https://youtu.be/s9YBf8Rf21s +PMAP 8921 • (5) Themes: (0) Introduction + +Introduction to the class session on ggplot themes. + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/05-content/ + + +https://youtu.be/BQ3wRMAMeBQ +PMAP 8921 • (5) Themes: (1) CRAP and ggplot + +Brief discussion about the application of the principles of graphic design to data-based graphs + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/05-content/ + + +https://youtu.be/V0CzheP9yMc +PMAP 8921 • (5) Themes: (2) The anatomy of a ggplot theme + +Brief overview of the different parts of a ggplot plot and how to target those elements with specific theme functions + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/05-content/ + + +https://youtu.be/9ldrTCUSReM +PMAP 8921 • (5) Themes: Example + +Brief demonstration of how to use ggThemeAssist to modify elements of a ggplot theme + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/05-content/ + +See the documentation for ggThemeAssist: https://github.com/calligross/ggthemeassist +``` diff --git a/content/06-content.qmd b/content/06-content.qmd new file mode 100755 index 0000000..3cbb2ee --- /dev/null +++ b/content/06-content.qmd @@ -0,0 +1,96 @@ +--- +title: "Uncertainty" +date: "2022-06-20" +date_end: "2022-06-24" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sFmy596lUElQakCrKDSHUUU" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "eZTp8Hninv4", "Introduction", "1", TRUE, + "TCQwkwlj4kM", "Communicating uncertainty", "communicating", FALSE, + "X6zPEOPo-2M", "Visualizing uncertainty", "visualizing", FALSE +) +``` + +## Readings + +- [Chapter 7](https://clauswilke.com/dataviz/histograms-density-plots.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- Chapters 4, 7, and 11 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- [Why It's So Hard for Us to Visualize Uncertainty](https://hbr.org/2016/11/why-its-so-hard-for-us-to-visualize-uncertainty) +- [Amanda Cox's keynote address at the 2017 OpenVis Conf](https://www.youtube.com/watch?v=0L1tGo-DvD0) +- [Communicating Uncertainty When Lives Are on the Line](https://eagereyes.org/blog/2017/communicating-uncertainty-when-lives-are-on-the-line) +- [Showing uncertainty during the live election forecast](https://flowingdata.com/2016/11/15/showing-uncertainty-during-the-live-election-forecast/) & [Trolling the uncertainty dial](https://flowingdata.com/2017/06/27/trolling-the-uncertainty-dial/) +- Cédric Scherer, ["Visualizing distributions with raincloud plots with ggplot2"](https://www.cedricscherer.com/2021/06/06/visualizing-distributions-with-raincloud-plots-with-ggplot2/) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- Why is it important to deal with uncertainty in data? +- What was good or bad about the New York Times' 2016 live election guage? +- Why is it so hard to visualize uncertainty? +- Why is it so hard to communicate uncertainty to others? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/06-slides") +slide_tabs(slide_details, "/slides/06-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sFmy596lUElQakCrKDSHUUU + +https://youtu.be/eZTp8Hninv4 +PMAP 8921 • (6) Uncertainty: (0) Introduction + +Introduction to the class session on uncertainty. + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/06-content/ + + +https://youtu.be/TCQwkwlj4kM +PMAP 8921 • (6) Uncertainty: (1) Communicating uncertainty + +Discussion about why uncertainty is both important and difficult to communicate + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/06-content/ + + +https://youtu.be/X6zPEOPo-2M +PMAP 8921 • (6) Uncertainty: (2) Visualizing uncertainty + +Overview of different methods for visualizing uncertainty, including histograms, density plots, ridge plots, box plots, violin plots, and half-versions of all these plots + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/06-content/ + + +https://youtu.be/40dW63jTbsk +PMAP 8921 • (6) Uncertainty: Example + +Demonstration of how to create histograms, density plots, ridge plots, box plots, violin plots with ggplot2 and R + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/06-example/ + +``` diff --git a/content/07-content.qmd b/content/07-content.qmd new file mode 100755 index 0000000..4398ae9 --- /dev/null +++ b/content/07-content.qmd @@ -0,0 +1,107 @@ +--- +title: "Relationships" +date: "2022-06-27" +date_end: "2022-07-01" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sGarIxAwCcmheAoKaLRGy1j" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "GnsuXEI3KoI", "Introduction", "1", TRUE, + "fhlbFgo5UQU", "The dangers of dual y-axes", "dual-y-axes", FALSE, + "emMc3qtw3z0", "Visualizing correlations", "correlations", FALSE, + "FsnM8e6P71g", "Visualizing regressions", "regression", FALSE +) +``` + +## Readings + +- Chapter 9 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- Andrew Heiss, ["Marginalia"](https://www.andrewheiss.com/blog/2022/05/20/marginalia/) +- [Chapter 12](https://clauswilke.com/dataviz/visualizing-associations.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- Kieran Healy, ["Two y-axes"](https://kieranhealy.org/blog/archives/2016/01/16/two-y-axes/) +- [Two Alternatives to Using a Second Y-Axis](http://stephanieevergreen.com/two-alternatives-to-using-a-second-y-axis/) & [Illusion of success](http://junkcharts.typepad.com/junk_charts/2006/06/illusion_of_suc.html) & [Dissecting two axes](http://junkcharts.typepad.com/junk_charts/2006/01/dissecting_two_.html) +- [Dual-Scaled Axes in Graphs: Are They Ever the Best Solution?](http://www.perceptualedge.com/articles/visual_business_intelligence/dual-scaled_axes.pdf) [@Few:2008] + +### Recommended + +- ["A Study on Dual-Scale Data Charts"](https://www.lri.fr/~isenberg/publications/papers/Isenberg_2011_ASO.pdf) [@IsenbergBezerianosDragicevic:2011] + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- How can you correctly and honestly communicate relationships between variables? How can you communicate the uncertainty in those relationships? +- What are the dangers of visualizing two variables? +- When is it appropriate to use two y-axes? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/08-slides") +slide_tabs(slide_details, "/slides/08-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sGarIxAwCcmheAoKaLRGy1j + +https://youtu.be/GnsuXEI3KoI +PMAP 8921 • (7) Relationships: (0) Introduction + +Introduction to the class session on relationships + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/07-content/ + + +https://youtu.be/fhlbFgo5UQU +PMAP 8921 • (7) Relationships: (1) The dangers of dual y-axes + +Discussion about why dual y-axes are dangerous and how you can avoid them + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/07-content/ + + +https://youtu.be/emMc3qtw3z0 +PMAP 8921 • (7) Relationships: (2) Visualizing correlations + +Overview of different methods for visualizing correlations, including scatterplots, scatterplot matrices, and correlograms + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/07-content/ + + +https://youtu.be/FsnM8e6P71g +PMAP 8921 • (7) Relationships: (3) Visualizing regressions + +Overview of different methods for visualizing regresison results, including coefficient plots and marginal effects plots + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/07-content/ + + +https://youtu.be/zfEAmJzfbkE +PMAP 8921 • (7) Relationships: Example + +Demonstration of how to create dual y-axes, scatterplot matrices, coefficient plots, and marginal effects plots with ggplot2 and R + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/07-example/ + +``` diff --git a/content/08-content.qmd b/content/08-content.qmd new file mode 100755 index 0000000..2dc9eaa --- /dev/null +++ b/content/08-content.qmd @@ -0,0 +1,103 @@ +--- +title: "Comparisons" +date: "2022-06-27" +date_end: "2022-07-01" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sGAoxtYY1GgHm2ZRQmWeTiP" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "pwvPAnjEHKk", "Introduction", "1", TRUE, + "iJOPwPYxZZE", "Visualizing comparisons", "comparisons", FALSE, + "Gv1U8IPxiOY", "Reproducible examples", "reprex", FALSE +) +``` + +## Readings + +- [Chapter 9](https://clauswilke.com/dataviz/boxplots-violins.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- Mike Bostock, ["Methods of Comparison, Compared"](https://observablehq.com/@mbostock/methods-of-comparison-compared). Explanation of the differences between showing relative differences, absolute differences, and log ratios. +- [Sparkline theory and practice](https://www.edwardtufte.com/bboard/q-and-a-fetch-msg?msg_id=0001OR). This is a collection of posts by Edward Tufte about sparklines—scroll down a ways and check out his examples, analysis, and critiques. +- [Time series sparklines](https://flowingdata.com/2017/01/24/one-dataset-visualized-25-ways/02-time-series-sparklines-2/) +- [Comparisons with lollipop charts](https://uc-r.github.io/lollipop). If you're feeling adventurous (and you should!), do this tutorial as you read it. + +### Reproducible examples + +Reprexes (or reproducible examples) are the best way to (1) get help online and (2) fix issues on your own. + +Making a good reprex is tricky, but it's a very valuable skill to know (regardless of programming language!). Here are some helpful resources for making them: + +- [What's a reproducible example (`reprex`) and how do I do one?](https://community.rstudio.com/t/faq-whats-a-reproducible-example-reprex-and-how-do-i-do-one/5219) +- [So you've been asked to make a reprex](https://www.jessemaegan.com/post/so-you-ve-been-asked-to-make-a-reprex/) +- [The reprex package](https://reprex.tidyverse.org/index.html) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- These readings all show a ton of new ways to present comparisons. Which ones are your favorite? Which ones didn't quite click with you? In what situations are some more appropriate than others? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/08-slides") +slide_tabs(slide_details, "/slides/08-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sGAoxtYY1GgHm2ZRQmWeTiP + +https://youtu.be/pwvPAnjEHKk +PMAP 8921 • (8) Comparisons: (0) Introduction + +Introduction to the class session on comparisons + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/08-content/ + + +https://youtu.be/iJOPwPYxZZE +PMAP 8921 • (8) Comparisons: (1) The dangers of dual y-axes + +Overview of different methods for visualizing comparisons, including bar and lollipop charts, small multiples, sparklines, and bump plots + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/08-content/ + + +https://youtu.be/Gv1U8IPxiOY +PMAP 8921 • (8) Comparisons: (2) Reproducible examples + +Discussion of best practices for creating reproducible examples with R when debugging + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/08-content/ + +See also "What's a reproducible example and how do I do one?" (https://community.rstudio.com/t/faq-whats-a-reproducible-example-reprex-and-how-do-i-do-one/5219) and "So you've been asked to make a reprex" (https://www.jessemaegan.com/post/so-you-ve-been-asked-to-make-a-reprex/) + + +https://youtu.be/tCnfTLHtMs8 +PMAP 8921 • (8) Comparisons: Example + +Demonstration of how to create small multiples, sparklines, and slopegraphs with ggplot2 and R + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/08-example/ + +``` diff --git a/content/09-content.qmd b/content/09-content.qmd new file mode 100755 index 0000000..adcd730 --- /dev/null +++ b/content/09-content.qmd @@ -0,0 +1,92 @@ +--- +title: "Annotations" +date: "2022-07-05" +date_end: "2022-07-08" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sG4NCNqLqHhIE7khPgrdRJD" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "1c51k2tmjBI", "Introduction", "1", TRUE, + "6p4K5_6KU9k", "Fretting the little things", "little-things", FALSE, + "fdR78oXb_fI", "Text in plots", "text", FALSE, + "lV_Qak75E6I", "Seeds", "seeds", FALSE +) +``` + +## Readings + +- [Chapter 17](https://clauswilke.com/dataviz/redundant-coding.html), [Chapter 18](https://clauswilke.com/dataviz/multi-panel-figures.html), [Chapter 19](https://clauswilke.com/dataviz/figure-titles-captions.html), and [Chapter 21](https://clauswilke.com/dataviz/small-axis-labels.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- [Chapter 5](http://socviz.co/workgeoms.html) in Kieran Healy, *Data Visualization* [@Healy:2018] +- Cara Thompson, ["Level Up Your Labels: Tips and Tricks for Annotating Plots"](https://www.cararthompson.com/talks/user2022) + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/09-slides") +slide_tabs(slide_details, "/slides/09-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sG4NCNqLqHhIE7khPgrdRJD + +https://youtu.be/1c51k2tmjBI +PMAP 8921 • (9) Annotations: (0) Introduction + +Introduction to the class session on annotations + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/09-content/ + + +https://youtu.be/6p4K5_6KU9k +PMAP 8921 • (9) Annotations: (1) Fretting the little things + +Discussion of why it's important to fret about little details when designing plots and how little tweaks can enhance the accessibility and usability of your plots + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/09-content/ + + +https://youtu.be/fdR78oXb_fI +PMAP 8921 • (9) Annotations: (2) Text in plots + +Overview and examples of three main ways of adding text to ggplot plots in R + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/09-content/ + + +https://youtu.be/lV_Qak75E6I +PMAP 8921 • (9) Annotations: (3) Seeds + +Discussion of what seeds are and why they're important when dealing with pseudorandom numbers in R and ggplot2 + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/09-content/ + + +https://youtu.be/gMSMsOy7KF0 +PMAP 8921 • (9) Annotations: Example + +Demonstration of how to create add text, shape, and arrow annotations to a ggplot, as well as enhance minor graphical elements and use ggtext to style text + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/09-example/ + +``` diff --git a/content/10-content.qmd b/content/10-content.qmd new file mode 100755 index 0000000..a014bda --- /dev/null +++ b/content/10-content.qmd @@ -0,0 +1,93 @@ +--- +title: "Interactivity" +date: "2022-07-05" +date_end: "2022-07-08" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sHxE_PbXWE2RC0mpN6syYhe" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "L6BGy0-0X-w", "Introduction", "1", TRUE, + "gyVFhQNCp80", "Making interactive graphs", "interactive-graphs", FALSE, + "lubDKJhlx9g", "Sharing content", "sharing-content", FALSE +) +``` + +## Readings + +### Explorable explanations + +- Marcel Salathé and Nicky Case, ["What Happens Next: COVID-19 Futures, Explained with Playable Situations"](https://ncase.me/covid-19/) +- Brett Victor, ["Explorable Explanations"](http://worrydream.com/ExplorableExplanations/) +- Look at [some of the explorable explorations here](https://explorabl.es/) +- Dragicevic, Jansen, Sarma, Kay, and Chevalier, ["Explorable Multiverse Analyses"](https://explorablemultiverse.github.io/). Use Chrome, open Example 1, scroll to page 2, and click on some of the blue text to change the results of the paper *within the paper itself*. This is magical. R Markdown can't quite get *this* interactive in real-time, but you can knit different versions of a document with slightly different parameters and options. + +### Dashboards + +- Look at [some of these examples of Shiny apps](https://shiny.rstudio.com/gallery/) +- Stephanie Evergreen, ["How a Dashboard Changes the Conversation"](https://stephanieevergreen.com/dashboard-conversation/) +- Stephanie Evergreen, ["The Problem with Dashboards (and a Solution)"](https://stephanieevergreen.com/problem-with-dashboards/) +- Stephen Few, ["2012 Perceptual Edge Dashboard Design Competition: A Solution of My Own"](https://www.stephen-few.com/blog/2013/01/08/2012-perceptual-edge-dashboard-design-competition-a-solution-of-my-own/) +- Skim through Stephen Few's [presentation on Information Dashboard Design](http://blogs.ischool.berkeley.edu/i247s12/files/2012/01/Dashboard-Design-Overview-Presentation.pdf) +- Google "dashboard design" and skim through some of the thousands of articles about what makes a good (and bad) dashboard + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- How helpful (or unhelpful) are explorable explanations? +- Have you seen examples of good dashboards before this class? Bad dashboards? What makes them good or bad? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/10-slides") +slide_tabs(slide_details, "/slides/10-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sHxE_PbXWE2RC0mpN6syYhe + +https://youtu.be/L6BGy0-0X-w +PMAP 8921 • (10) Interactivity: (0) Introduction + +Introduction to the class session on interactivity + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/10-content/ + + +https://youtu.be/gyVFhQNCp80 +PMAP 8921 • (10) Interactivity: (1) Making interactive graphics + +Discussion of how to make interactive graphs in R with plotly (with ggplotly()), with flexdashboard, and with Shiny + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/10-content/ + + +https://youtu.be/lubDKJhlx9g +PMAP 8921 • (10) Interactivity: (2) Sharing content + +Discussion of how to share knitted R Markdown documents through RPubs and other online services + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/10-content/ +``` diff --git a/content/11-content.qmd b/content/11-content.qmd new file mode 100755 index 0000000..880deb1 --- /dev/null +++ b/content/11-content.qmd @@ -0,0 +1,113 @@ +--- +title: "Time" +date: "2022-07-11" +date_end: "2022-07-15" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sG0DXT1Bvx0-hQkHrWBABa1" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "nBVnR_bT8j0", "Introduction", "1", TRUE, + "yuBMJF0ncyI", "Axis issues", "axis-issues", FALSE, + "EGTUsCjpAQw", "Visualizing time", "visualizing-time", FALSE, + "xP6rvggkk9w", "Starting, ending, and decomposing time", "decomposing", FALSE +) +``` + +## Readings + +- Chapter 8 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- [The Nuclear Threat—The Shadow Peace, part 1](http://www.fallen.io/shadow-peace/1/) +- [11 Ways to Visualize Changes Over Time – A Guide](https://flowingdata.com/2010/01/07/11-ways-to-visualize-changes-over-time-a-guide/) +- A bunch of (really) short blog posts: + - [What a Hundred Million Calls to 311 Reveal About New York](https://www.wired.com/2010/11/ff_311_new_york/) (just look at the picture; you don't need to read this unless you're really curious about trends in 311 calls) + - [A century of ocean shipping animated](https://flowingdata.com/2012/04/12/a-century-of-ocean-shipping-animated/) + - [What is seasonal adjustment and why is it used?](http://junkcharts.typepad.com/junk_charts/2010/11/what-is-seasonal-adjustment-and-why-is-it-used.html) + - [The start-at-zero rule](http://junkcharts.typepad.com/junk_charts/2005/09/the_startatzero.html) + - [Keeping one's appetite after touring the sausage factory](http://junkcharts.typepad.com/numbersruleyourworld/2011/02/keeping-ones-appetite-after-touring-the-sausage-factory.html) + - [How Common is Your Birthday? This Visualization Might Surprise You](http://thedailyviz.com/2016/09/17/how-common-is-your-birthday-dailyviz/) + + +### Recommended + +- [The Fallen of World War II](http://www.fallen.io/ww2/) +- [Visualizing Statistical Mix Effects and Simpson's Paradox](https://static.googleusercontent.com/media/research.google.com/en//pubs/archive/42901.pdf) [@ArmstrongWattenberg:2014] +- [How To Fix a Toilet (And Other Things We Couldn't Do Without Search)](http://how-to-fix-a-toilet.com/) + + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- When is it okay (or not) to truncate the y-axis? +- It is remarkably easy to mislead people with many of these chart types. Why? How can you avoid the same mistakes? +- All these types of charts are good at communicating change over time, but some are more appropriate in different situations. When is it best to use these different types (e.g. line graphs vs. area graphs vs. horizon charts vs. heatmaps, etc.)? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/11-slides") +slide_tabs(slide_details, "/slides/11-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sG0DXT1Bvx0-hQkHrWBABa1 + +https://youtu.be/nBVnR_bT8j0 +PMAP 8921 • (11) Time: (0) Introduction + +Introduction to the class session on visualizing time + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/11-content/ + + +https://youtu.be/yuBMJF0ncyI +PMAP 8921 • (11) Time: (1) Axis issues + +Discussion of when it's okay and not okay to truncate axes + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/11-content/ + + +https://youtu.be/EGTUsCjpAQw +PMAP 8921 • (11) Time: (2) Visualizing time + +Discussion of different methods for visualizing trends in time + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/11-content/ + + +https://youtu.be/xP6rvggkk9w +PMAP 8921 • (11) Time: (3) Starting, ending, and decomposing time + +Discussion of the importance of choosing good start and end points when visualizing time + the need to watch out for seasonality and other underlying trends in your data + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/11-content/ + +https://youtu.be/ObnRqO4zTY8 +PMAP 8921 • (11) Time: Example + +Demonstration of how to use the tidyquant package in R to plot changes in time with ggplot2 using data from the US Federal Reserve + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/11-example/ +``` diff --git a/content/12-content.qmd b/content/12-content.qmd new file mode 100755 index 0000000..8b2993f --- /dev/null +++ b/content/12-content.qmd @@ -0,0 +1,115 @@ +--- +title: "Space" +date: "2022-07-11" +date_end: "2022-07-15" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sGd_PCE07nym2Df9120FW1U" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "fOpsbd6-PzU", "Introduction", "1", TRUE, + "acP8mwyLNt0", "Maps and truth", "maps-truth", FALSE, + "OqKdU0qzfjA", "Putting data on maps", "data-on-maps", FALSE, + "qbrnzSRPyb0", "GIS in R with sf", "gis-sf", FALSE +) +``` + +## Readings + +- Chapter 10 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- [Chapter 7](http://socviz.co/maps.html) in Kieran Healy, *Data Visualization* [@Healy:2018] + +It looks like this is a lot of reading, but lots of these are short videos or tweets or interactive websites, so don't worry! + +- [Why all world maps are wrong](https://www.youtube.com/watch?v=kIID5FDi2JQ) +- [The True Size Of…](https://thetruesize.com) +- [Projection comparison](https://observablehq.com/@d3/projection-comparison) +- [Map projections](https://xkcd.com/977/) (try comparing Robinson with Mercator to see how badly Mercator exaggerates the northern hemisphere) +- [Gall-Peters Projection](https://www.youtube.com/watch?v=vVX-PrBRtTY) +- ["When Maps Lie"](https://www.citylab.com/design/2015/06/when-maps-lie/396761/) +- [Animated Mercator distortion](https://twitter.com/neilrkaye/status/1050740679008296967) +- ["These Twisted Maps Prove That America Isn't a Red Country"](https://newrepublic.com/article/115550/cartograms-are-important-inforgraphic-tool) +- ["The next great fake news threat? Bot-designed maps"](https://www.fastcompany.com/90230916/the-next-great-fake-news-threat-bot-designed-maps) +- ["New World Map That Accurately Shows Earth in 2D Created by Scientists"](https://www.newsweek.com/equal-earth-map-continents-accurate-2d-1102404) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- How can you know if a map projection is truthful or misleading? +- What's wrong (or not wrong) with using points on maps? Choropleths? Lines? + +## Other resources + +Check out [this post where someone used **ggplot2** and **sf** to create fancy city map-based art that she printed for a friend](https://www.katiejolly.io/blog/2019-01-21/map-cutouts). You can do similar things after this session! + +In addition to the example for this session, you can [check out this tutorial on using the **sf** package to create maps](https://r-spatial.org//r/2018/10/25/ggplot2-sf.html). It shows how to include fancy map stuff like a north arrow and scale bar. + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/12-slides") +slide_tabs(slide_details, "/slides/12-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sGd_PCE07nym2Df9120FW1U + +https://youtu.be/fOpsbd6-PzU +PMAP 8921 • (12) Space: (0) Introduction + +Introduction to the class session on visualizing space and geography + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/12-content/ + + +https://youtu.be/acP8mwyLNt0 +PMAP 8921 • (12) Space: (1) Maps and truth + +Discussion of how not to lie with maps and different projections can distort or enhance the truth + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/12-content/ + + +https://youtu.be/OqKdU0qzfjA +PMAP 8921 • (12) Space: (2) Putting data on maps + +Discussion of different methods for visualizing data in maps + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/12-content/ + + +https://youtu.be/qbrnzSRPyb0 +PMAP 8921 • (12) Space: (3) GIS in R with sf + +Brief overview of key GIS concepts + how to use the sf package in R to make maps + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/12-content/ + +https://youtu.be/Opzwtegvuv4 +PMAP 8921 • (12) Time: Example + +Demonstration of how to use the sf and ggplot2 packages in R to plot shapefiles and make maps + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/12-example/ +``` diff --git a/content/13-content.qmd b/content/13-content.qmd new file mode 100755 index 0000000..3565e0b --- /dev/null +++ b/content/13-content.qmd @@ -0,0 +1,101 @@ +--- +title: "Text" +date: "2022-07-18" +date_end: "2022-07-22" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sG6yMnZ9sDFwMPusGHGtOYj" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "FEzCQ2k3zyI", "Introduction", "1", TRUE, + "o6I49HotNOc", "Qualitative text-based data", "text-data", FALSE, + "Pdo7G9keXRM", "Crash course in computational linguistics", "computational-linguistics", FALSE +) +``` + +## Readings + +- Look through some of the chapters in Julia Silge and David Robinson, [*Tidy Text Mining*](https://www.tidytextmining.com/) [@SilgeRobinson:2017] (but *definitely* don't read them all! You just need to get a taste of what modern text analysis looks like.) +- A bunch of (really) short things: + - Evangeline Reynolds, ["Federalist Papers"](https://evangelinereynolds.netlify.app/post/federalist-papers/) + - Julia Silge, ["She Giggles, He Gallops"](https://pudding.cool/2017/08/screen-direction/) + - Abby Ohlheiser, ["These are the words most associated with men and women, according to Facebook status updates"](https://www.washingtonpost.com/news/the-intersect/wp/2016/05/28/these-are-the-words-most-associated-with-men-and-women-according-to-facebook-status-updates/) + - [Six Ideas for Displaying Qualitative Data](http://annkemery.com/qual-dataviz/) + - [Word clouds considered harmful](http://www.niemanlab.org/2011/10/word-clouds-considered-harmful/) + - [Word clouds cause death… or something](https://flowingdata.com/2011/10/18/word-clouds-cause-death-or-something/) + - [When It's Ok to Use Word Clouds](https://www.vis4.net/blog/2015/01/when-its-ok-to-use-word-clouds/) + - [The Class of 2011](http://www.nytimes.com/interactive/2011/06/10/education/commencement-speeches-graphic.html) + - [Every time Ford and Kavanaugh dodged a question, in one chart](https://www.vox.com/policy-and-politics/2018/9/28/17914308/kavanaugh-ford-question-dodge-hearing-chart) + - [Tweet by \@s_soroka](https://twitter.com/s_soroka/status/907941270735278085) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- Why is qualitative data difficult to visualize? +- Why are word clouds so problematic? When is (not) okay to use them? + +## Other resources + +Check out [this slide show demonstrating a bunch of different ways to visualize text](https://bocoup.github.io/text-vis-ovc/24-text-vis-examples/slides.html), as well as [this collection of 400+ different text visualization techniques](https://textvis.lnu.se/) (!!) + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/13-slides") +slide_tabs(slide_details, "/slides/13-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sG6yMnZ9sDFwMPusGHGtOYj + +https://youtu.be/FEzCQ2k3zyI +PMAP 8921 • (13) Text: (0) Introduction + +Introduction to the class session on visualizing text + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/13-content/ + + +https://youtu.be/o6I49HotNOc +PMAP 8921 • (13) Text: (1) Qualitative text-based data + +Discussion of why it's hard to visualize text-based data and why word clouds aren't the greatest solution + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/13-content/ + + +https://youtu.be/Pdo7G9keXRM +PMAP 8921 • (13) Text: (2) Crash course in computational linguistics + +Overview of concepts in computational linguistics and other methods for analyzing large corpora of text + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/13-content/ + + +https://youtu.be/YeyZp8Dw55g +PMAP 8921 • (13) Text: Example + +Demonstration of how to use the tidytext and ggplot2 packages in R to visualize text + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/13-example/ +``` diff --git a/content/14-content.qmd b/content/14-content.qmd new file mode 100755 index 0000000..441d323 --- /dev/null +++ b/content/14-content.qmd @@ -0,0 +1,64 @@ +--- +title: "Enhancing graphics" +date: "2022-07-18" +date_end: "2022-07-22" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sFmumDMzu8ZXSo2zwLN5Q2H" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "ZnajGmnaC78", "Enhancing graphics", "1", TRUE +) +``` + +## Readings + +- [Chapter 14](https://clauswilke.com/dataviz/proportional-ink.html), [Chapter 15](https://clauswilke.com/dataviz/overlapping-points.html), [Chapter 16](https://clauswilke.com/dataviz/color-pitfalls.html), [Chapter 22](https://clauswilke.com/dataviz/avoid-line-drawings.html), and [Chapter 23](https://clauswilke.com/dataviz/no-3d.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- [Chapter 8](http://socviz.co/refineplots.html) in Kieran Healy, *Data Visualization* [@Healy:2018] +- Browse through recent visualizations at [The Pudding](https://pudding.cool/) ([like this one!](https://pudding.cool/2018/08/pockets/)), [FiveThirtyEight](https://fivethirtyeight.com/), [Vox](https://www.vox.com/), [Christopher Ingraham's articles at the Washington Post](https://www.washingtonpost.com/people/christopher-ingraham/?utm_term=.3bfc09eea703), [WSJ Graphics](https://graphics.wsj.com/), and the [New York Times's TheUpshot](https://www.nytimes.com/section/upshot). Most (if not all) of these graphics were made in R (or something similar) and exported for enhancement in Illustrator or [D3](https://d3js.org/). + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/14-slides") +slide_tabs(slide_details, "/slides/14-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sFmumDMzu8ZXSo2zwLN5Q2H + +https://youtu.be/ZnajGmnaC78 +PMAP 8921 • (14) Enhancing graphics + +Discussion of a typical statistics-to-publication-worthy-graphics workflow using R, ggplot, and Illustrator, and how recent R packages like patchwork and ggtext make it so you don't need Illustrator to make minor graphic design enhancements of your plots + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/14-content/ + + +https://youtu.be/L-tUSEMWrgE +PMAP 8921 • (14) Enhancing graphics: Example + +Demonstration of how to export a ggplot plot from R as a PDF or SVG and edit it in Illustrator or Gravit Designer + +Download the data and see the polished code at https://datavizm20.classes.andrewheiss.com/example/14-example/ +``` diff --git a/content/15-content.qmd b/content/15-content.qmd new file mode 100755 index 0000000..da52823 --- /dev/null +++ b/content/15-content.qmd @@ -0,0 +1,86 @@ +--- +title: "Truth, beauty, and data revisited" +date: "2022-07-25" +date_end: "2022-07-30" +--- + +```{r slides-videos, echo=FALSE, include=FALSE} +source(here::here("R", "slide-things.R")) +source(here::here("R", "youtube-playlist.R")) + +playlist_id <- "PLS6tnpTr39sFYqZMtanRbtB1dKRBN2Rzt" + +slide_details <- tibble::tribble( + ~youtube_id, ~title, ~slide, ~active, + "TDP_G1RiUmQ", "Introduction", "1", TRUE, + "UyVJlbZjwhY", "Telling stories with data", "telling-stories", FALSE, + "KHfF8zdxWzM", "Curiosity", "curiosity", FALSE +) +``` + +## Readings + +- Chapter 12 in Alberto Cairo, *The Truthful Art* [@Cairo:2016] +- [Chapter 26](https://clauswilke.com/dataviz/telling-a-story.html) in Claus Wilke, *Fundamentals of Data Visualization* [@Wilke:2018] +- Martin Krzywinski and Alberto Cairo, ["Storytelling"](https://www.nature.com/articles/nmeth.2571.pdf) +- Ben Wellington, ["Making data mean more through storytelling"](https://www.youtube.com/watch?v=6xsvGYIxJok) +- Jonathan Schwabish, ["Better Data Communication,"](https://vimeo.com/230757062) National Bureau of Economic Research +- [Why People Make Bad Charts (and What to Do When it Happens)](https://flowingdata.com/2018/06/28/why-people-make-bad-charts-and-what-to-do-when-it-happens/) + +### Questions to reflect on + +*(Remember, you don't need to answer all of these—or even any of them! These are just here to help guide your thinking.)* + +- Why are stories so powerful? +- How are stories related to truth? +- Is it ethical to emphasize certain aspects of the facts in data more than others? How do you decide which facts to use to convince audiences? +- When you're telling a story about data, you're inherently manipulating audience emotions. Is that okay? + + +## Slides + +The slides for today's lesson are available online as an HTML file. Use the buttons below to open the slides either as an interactive website or as a static PDF (for printing or storing for later). You can also click in the slides below and navigate through them with your left and right arrow keys. + +```{r show-slide-tabs, echo=FALSE, results="asis"} +slide_buttons("/slides/15-slides") +slide_tabs(slide_details, "/slides/15-slides.html") +``` + +:::{.callout-tip} +**Fun fact**: If you type ? (or shift + /) while going through the slides, you can see a list of special slide-specific commands. +::: + + +## Videos + +```{r show-youtube-list, echo=FALSE, results="asis"} +youtube_list(slide_details, playlist_id) +``` + + +```{cat include=FALSE, eval=FALSE} +https://www.youtube.com/playlist?list=PLS6tnpTr39sFYqZMtanRbtB1dKRBN2Rzt + +https://youtu.be/TDP_G1RiUmQ +PMAP 8921 • (15) Truth, beauty, and data revisited: (0) Introduction + +Introduction to the final class session + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/15-content/ + + +https://youtu.be/UyVJlbZjwhY +PMAP 8921 • (15) Truth, beauty, and data revisited: (1) Telling stories with data + +Discussion of why it's important to tell stories with data and how to avoid major pitfalls related to manipulation, misinterpretation, ethos, and equity + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/15-content/ + + +https://youtu.be/KHfF8zdxWzM +PMAP 8921 • (15) Truth, beauty, and data revisited: (2) Curiosity + +Discussion of how to continue to learn R by embracing your curiosity and working in public + +Access the slides, code, and other materials at the course website at https://datavizm20.classes.andrewheiss.com/content/15-content/ +``` diff --git a/content/_metadata.yml b/content/_metadata.yml new file mode 100644 index 0000000..8410ea3 --- /dev/null +++ b/content/_metadata.yml @@ -0,0 +1,10 @@ +date-heading: + content: "Content for" + class: "bg-content" +date-format: "full" + +format: + html: + filters: ["../filters/format_date_end.lua"] + template-partials: + - ../html/title-block.html diff --git a/content/index.qmd b/content/index.qmd new file mode 100644 index 0000000..28c93cc --- /dev/null +++ b/content/index.qmd @@ -0,0 +1,14 @@ +--- +title: Readings, lectures, and videos +--- + +Each class session has a set of required readings that you should complete ***before*** watching the lecture or working through the lesson. + +I've included a set of questions that might guide your reflection response. **You should not try to respond to all of these** (or any of them if you don't want to)—they'll just help you know what to look for and think about as you read. + +Every class session also has a YouTube playlist of short recorded videos for each of the lecture sections. The lecture slides are special HTML files made with the R package [**xaringan**](https://bookdown.org/yihui/rmarkdown/xaringan.html) (R can do so much!). On each class session page you'll buttons for opening the presentation in a new tab or for downloading a PDF of the slides in case you want to print them or store them on your computer: + +

    {{< fa arrow-up-right-from-square >}} View all slides in new window {{< fa file-pdf >}} Download PDF of all slides

    + +The slides are also embedded on each page. You can click in the slides and navigate through them with ← and →. If you type ? (or shift + /) while viewing the slides you can see a list of slide-specific commands (like f for fullscreen or p for presenter mode if you want to see my notes). + diff --git a/filters/format_date_end.lua b/filters/format_date_end.lua new file mode 100644 index 0000000..63c2c59 --- /dev/null +++ b/filters/format_date_end.lua @@ -0,0 +1,21 @@ +-- Adapted from https://github.com/iagoleal/iagoleal.github.io/blob/master/filters/date.lua + +--[[ Set the date if it is not already set + and properly format it +--]] +local function split(s, delimiter) + result = {} + for match in (s .. delimiter):gmatch("(.-)" .. delimiter) do + table.insert(result, match) + end + return result +end + +function Meta(m) + if m.date_end then + local date = pandoc.utils.normalize_date(pandoc.utils.stringify(m.date_end)) + local year, month, day = table.unpack(split(date, '-')) + m.date_end = os.date("%A, %B %d, %Y", os.time({ year = year, month = month, day = day })):gsub(" 0", " ") + end + return m +end diff --git a/html/title-block.html b/html/title-block.html new file mode 100644 index 0000000..6094d61 --- /dev/null +++ b/html/title-block.html @@ -0,0 +1,18 @@ +
    +

    $title$

    +$if(subtitle)$ +

    $subtitle$

    +$endif$ + +$if(date)$ +$if(date_end)$ +
    +

    $date-heading.content$ $date$–$date_end$

    +
    +$else$ +
    +

    $date-heading.content$ $date$

    +
    +$endif$ +$endif$ +