Lesson 4.6 - RMarkdown - Interactivity {#rmarkdowninteractive}

knitr::opts_chunk$set(echo = TRUE)

Aim of this lesson

This lesson is about building Shiny apps to create interactive visualizations, apps and dashbords. We will build a small Shiny app and Dashboard to get you started with {shiny}. Thirdly, we will also have a look at how to increase interactivity even more by creating interactive visualizations.

Resources

{flexdashboards}

{shiny}

shiny webinars

{shinydashboard}

Shiny

Adapted from: https://shiny.rstudio.com/tutorial/ Shiny is an R package that makes it easy to build interactive web applications (apps) straight from R. This lesson will get you started building Shiny apps, though a set of simple examples. Than you need to create a new shiny app from covid-19 case data that is supplied by the RIVM and reflects the covid-19 cases on the city level.

My first shiny

To get started with shiny you will need the {shiny} R package. The shiny package has a number of build-in isolated shiny apps as examples.

# install.packages("shiny")
library(shiny)
runExample("01_hello")

This will show a histogram of the famous 'faithful' dataset in a pop-up window. The slider can be used to generate multiple versions of this histogram with different number of bins. So a shiny app is in principle a reactive piece of R code that is run from the input the user specifies.

Exercise 4.5

Go over the following steps to complete this exercise

  1. Inspect the source code of the build-in shiny package example "01_hello" that we ran above.
  2. Copy the source code to an R script (call this file app.R) that you store in an app_example_01_hello folder in your portfolio project.
  3. Try running the app.R file from your portfolio project (open a new session in RStudio)
  4. Now examine the source code and try adjusting the number of bins that is diplayed in the app by default, try a number of different settings
  5. Which piece of code regulates this setting? In which part of the app (ui or server) is this managed?

Interactivity

The responsiveness of an R object inside a shiny app is a core feature of most shiny apps. This means that for example visualizations based on data are immediatly changed if the user packs a different setting in the UI. This reposiveness can be addedd to an app by using the reactive() function in the {shiny} package. By using a reactive dataframe for example the input data that is used for example for a table of a graph is updated as soon as the user picks a different setting in the app. Using reactive() can greatly speed up the performance of an app.

We can see the reactive() function in action in the following example

runExample("03_reactivity")

Look at the app source code to understand what the reactive() part of the code does in this case.

Exercise 4.5

Go over the following steps to complete this exercise

  1. Study the source code of the build in shiny app example called "04_mpg"
  2. Look at the overall app structure, what is the input and output? Explain in your own words
  3. Look at the reactive() part of the server code, what does it do?

Click for the answer

## to access the example needed for this exercise
library(shiny)
runExample("04_mpg")

Assignment

Complete the following steps to finish this assingment. Upload the resulting app.R file in your portfolio github project.

Go over the shiny Written tutorials lesson 1 to 7: https://shiny.rstudio.com/tutorial/. You will need the information in these lessons to complete this assignment.

These are the steps:

  1. Fork and clone [this Github repo] to your Rstudio environment.
  2. Study the source code of app.R file carefully
  3. Study the source code of the helpers.R files in the ./app/shiny folder
  4. Run the app locally, play around with the select input box and see what happens
  5. The app does not display data for the vaccination for some countries and continents, because this data is lacking from the input data. Look around on the internet to see if you can find data that has this information.
  6. How would you incorporate the new data source you found in the previous step?
  7. If you found a relevant data source: add a piece of code to the app that displays this new data. Update the app.R code
  8. If you did not find any relevant data to add: rewrite the app so that it displays a notification that "no data on vaccinations is available for the selected country"
  9. As you can see from the code, the current version of the app does not use the reactive() function. Rewrite part of the app so that the reactive() function is used to generate the input data.
  10. Once you are done, push your changes to your forked branch of the repo and create a pull request.
  11. Publish your version of the app.R (and helpers.R) scripts in your portfolio.

Creating dashboards with shiny

Once you master the basics of shiny, you probably want to be able to build more complicated apps. One way of achieving a more visually appealing app and extend its functionality is by building a dashboard. A dashboard usually has some data input and multiple categories of information displayed from this data input. These categories are usually defined by tabs in the dashboard. To learn more about how to build nice dashboards in R go over this tutorial:. You will need this information to complete the second assignment of this lesson.

Assignment 4.5

For this assignment you need to build and publish a shiny dashboard. You need to use data from your projecticum assignment. We will organize a moment in class where you can show what you build. Because some of the projecticum projects are confidential, we ask you not to publish this app somewhere. The demo you will need to give will be done by running the app in a local (or on the Rstudio Server if you want) Rstudio session.

For this assignment you will have to complete these steps:

  1. If you have not already done so, watch the video tutorial on shiny
  2. Go over the {shinydashboard} tutorial
  3. From the {shinydashboard} tutorial example build a small dashboard (with at least two tabs), using a dataset of your projecticum.
  4. Prepare for a short demo of your dashboard in the upcoming plenary class discussion. You will need to show your app and explain what it does and how your programmed it that way.

Interactive visualizations

Building a shiny app in which you or someone else can interact with the data ads a lot of interactivity to data. You can enable users to explore and visualize patters in the data and run multiple statistical models, without the need for a user to be able to program in R. Adding interactivity to a plot can also increase the user experience. One of the frameworks that is integrated with shiny is {ggiraph}. In our next assignment we will add some {ggiraph} elements to the dashboard you created for in the previous assignment.
The {ggiraph} package has a number of build-in examples. Just like the shiny examples you can run them using the run_girafe_example() {ggiraph} function. To list all examples run

library(ggiraph)
?run_girafe_example

Let's look at a {ggiraph} + {shiny} example

run_girafe_example("crimes")

In this example you see how a 'normal' gg2plot is transformed into an interactive graph using the renderGirafe() function in the server part of the shiny app and the girafeOutput() function in the ui part of the app. Using these examples, you can easily incorporate an interactive {ggiraph} object in your own shiny dashboard. This is the aim of the next and final assingment of this lesson.

Assignment 4.5

Go over the following steps to complete this exercise:

  1. Go over the {ggiraph} tutorial here:
  2. Study the "Shiny usage" tutorial part here:
  3. In the shiny dashboard you created in the previous assignment, add a {ggiraph} interactive element to this dashboard
  4. Update the dashboard code and push it to your projecticum github repository

Th-th-that's all folks!



DataScienceILC/tlsc-dsfb26v-20_workflows documentation built on July 4, 2025, 5:49 a.m.