Data Visualization and Exploration

Dashboards

What is a “dashboard”?

Essentially an data-driven web page.

On an interactive dashboard page, you may have opportunities to

  • filter a pre-loaded data set by certain values or properties,
  • change the visualization type, or
  • experiment with other pre-configured parameters.

Or, the content may be static.

Dashboard popularity

Despite origins in 1970s-1980s business, popularity of dashboards (and tools) has grown dramatically in recent years.

Public health dashboards during the peak of the COVID-pandemic made dashboards quite common.

The only real “downside” of this is that,

  • new tools seem to be under constant development, and
  • they are combined in ever-increasing ways.

Dashboard tools

Dashboards can be made with a variety of tools, including

  • GUI (proprietary)
    • Tableau
    • MS Power BI
  • scripted (open-source)
    • R
    • python
    • JavaScript
    • TensorFlow

as well as a variety of other tools or interfaces (e.g., datawrapper) developed by technology start-ups or open-source groups.

Examples

Explore the following (or other) dashboards:

Do you notice similarities, differences, problems, …?

Quarto dashboards

Dashboards can be prepared with a variety of language/tool combinations. By using format: dashboard in the .qmd header, you can run code written in R, python, or Observable JS.

Computational language is specified in code blocks and languages can use a variety of interactive components:

  • plotly (python, R)
  • Leaflet (maps)
  • *widgets
  • ggplot2 (R)
  • Shiny (R, python)

Styling dashboard with themes is pretty easy. See https://bootswatch.com/ for a gallery of choices.

Shinyapps.io

You can create a free https://shinyapps.io account to run a limited number of apps.

With a little configuration (connecting your RStudio installation to your account on the website via authentication tokens) you can begin publishing by hitting the “Publish the application or document” button or with command-line tools.

Using Shiny-based interactivity is generally much more flexible and capable than client-only interactivity, however requires a server for deployment.

https://quarto.org/docs/dashboards/interactivity/#overview

Traditional Shiny apps

Standalone shiny web apps can be written using a .app extension and be

  • published to the https://shinyapps.io server (account required for “deployment”), or
  • run locally (at least for testing, not so useful for sharing).

Anything we have done so far can be “plugged in” to a dashboard,

  • base R graphs and calculations,
  • ggplot graphs (and tidyverse calculations),
  • maps, and more.

These can be made with or without Quarto.

  • The easiest way to start a standalone Shiny App is “File > New File > Shiny Web App…”.
  • Shiny code can also be embedded in a quarto page.

Quarto dashboards content

We will look at three Quarto dashboards.

Layouts

Laying out content is relatively simple.

  • A single # heading identifies a named dashboard page tab.
  • A double ## heading identifies an unnamed dashboard row or column.
  • a triple ### heading identifies an unnamed row or column (within columns or rows, respectively).

The default organization is row-by-row, we will begin to experiment now.

You are welcome to use your own installation, but are encouraged to try Buddy.

Template file

Use the template .zip file to experiment with the dashboard page layouts in static-dashboard.qmd.

Experiment with ## Row, ## Column, and the size parameters.

You may need to paste the url from the “Background Jobs” tab into your browser if you get a 404 error.

Incorporating data

Since the purpose of a dashboard is to allow for interactive data visualization and exploration, using real data is the obvious next step.

Data can be loaded locally or drawn from websites.

  • The linked project contains two sample datasets, either can be read in and manipulated as we have all semester.
  • The datasets are also available online and can be loaded from trusted online sources.

Local data

Experiment with static-dashboard2.qmd (from the unzipped directory). You could

  • recreate the graphs using ggplot() (from the ggplot2 package), or
  • replace scatterplots with other graphs (e.g., a sensible boxplot or histograms).

Adapt the following code to add a relevant “valuebox”. Remove #| eval: false and replace each ... with relevant content.

```{r}
#| eval: false
#| content: valuebox
#| title: "something interesting"
list(icon = ..., color = ..., value = ...)
```
  • Choices of icon can be found by visiting https://icons.getbootstrap.com/.
  • Choices of color (aliases) include: primary, secondary, success, info, warning, danger, light, and dark.
  • The entry for value should be the result of some earlier calculation.

Online data

You can load online data into your dashboard by putting the using the url() command with any read*() function and its necessary options.

Paste a direct link to a .csv file into url(), with quotes around the name.

For example,

dat <- read.csv(url("https://raw.githubusercontent.com/seanteachesmath/data/refs/heads/main/inat-brief.csv"), header = TRUE, sep = ",")

Finally, experiment with shiny-dashboard.qmd (from the unzipped directory). You could experiment by

  • attempting to add a map layer,
  • adapting this to other species,
  • filtering by year (perhaps with facets), or
  • tabulating unique observers.

Troubleshooting

Initially I struggled to get consistent coloring of the points in the iNaturalist dashboard.

After lots of searching I found a solution that worked reliably.

Adding + lims(color = levels(dat$common_name)) to the graph ensured that the names printed, and consistently-colored points were added as the checkboxes were checked.

Comment out, or remove, that line and watch what happens. It’s quite irritating if you look closely.

Privacy, security, confidentiality

Though mere mention will have to do for now, concerns about dashboard design include the

  • access to underlying data or the transfer of data from source to user, and
  • whether or not the user has any file-upload privileges.
   data <- reactive({
     
     file <- input$Files   
     if( is.null (file) ){ return() }   
      else { read.csv (file =  file$datapath) }
 
   })
   
   output$data_table = renderDataTable({ data() })

The code above should allow the user to upload a file, but you might contemplate why they might want or need to do so.

Deployment

Deployment refers to the publishing of the dashboard.

When you attempt to publish (from the rendered app window), you will be prompted with instructions that are surprisingly clear.

  • Static dashboards can be deployed to any web server.
  • Interactive dashboards, which do reactive computing, must be published to a special web server.

Summary

Remember that there are a variety of other tools, specifically proprietary tools that you might encounter in the workforce.

Our approach makes the best use of our work done to date, but you may explore student or trial versions of software and try, as a hobby on your own time, to replicate some of our class tasks with other tools.