r shiny interactive visualization · interactive visualization: r shiny weiai xu (wayne), phd...

22
Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: [email protected] curiositybits.cc

Upload: others

Post on 26-Jun-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Interactive visualization:R ShinyWeiai Xu (Wayne), PhD

Assistant ProfessorDepartment of Communication, UMass-Amherst

Email: [email protected]

Page 2: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Examples of R Shiny apps

https://curiositybits.shinyapps.io/PH_Tracker_dashboard/

Page 3: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Components in a R Shiny app

Sidebar Panel: contains one or multiple control widgets

Allow users to make selection or enter values

Page 4: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Components in a R Shiny app

https://shiny.rstudio.com/tutorial/written-tutorial/lesson3/

Basic widgets available in R Shiny

Page 5: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Components in a R Shiny app

Main Panel: contains visual outputs

Outputs change in response to user selection

Page 6: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

How does a R Shiny app work

When a user makes a selection in the Sidebar Panel, it creates an input value.

1

12

2 The input value is used to select cases for visualization

Page 7: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What files does a R Shiny app consist of

Each app has a stand-alone folder

app.R is the app script

Data files

Backend code for pre-processing data

Page 8: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Create an exampleBefore you create an app, make sure the shiny library is installed and loaded

Page 9: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Test example filesExample files are available on Moodle

Create a folder in your laptop and move app.R and associated data files to the folder. Then open app.R in RStudio.

Make sure the example app works on your laptop

Page 10: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The ui part and the server part

Page 11: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The ui part

title

Text

sidebar

Q: What should I do if I want to change the app name to Class Demo and add an introduction?

Page 12: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

When a user selects anger, the selection creates an input value. The value is the string anger, the input value is stored as input$type

What’s in app.R?The ui part

Default selection

A list of choices available to users

Page 13: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Every time a user sets on a number, it creates an input value. The input value is stored as input$slider1

What’s in app.R?The ui part

A slider bar

Page 14: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The ui part

What to visualize

Page 15: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The server part

Do you remember the two input values created from user selection?

input$typeinput$slider1

Page 16: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The server part: import data, process data, and create visualization

Import the two data files from your app folder.

Clean and standardize the data if necessary.

The part where you create a highchart showing sentiment trends.

Page 17: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The server part: import data, process data, and create visualization

Use input$type as the filtering criteria to select cases from senti_data

Page 18: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

What’s in app.R?The server part: import data, process data, and create visualization

Use input$slider1 as the filtering criteria to select cases from geocodes

Page 19: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

In-class practiceMake sure the example app works on your laptop See if you can add a new slider bar with the input value named “slider3” and the help text “min. Favorite count.”

Page 20: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Publish a R Shiny app

https://shiny.rstudio.com/articles/shinyapps.html

Page 21: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

More resources

https://shiny.rstudio.com/articles/basics.html

Page 22: R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD Assistant Professor Department of Communication, UMass-Amherst Email: weiaixu@umass.edu

Other visualization options

Using R Markdown: https://rmarkdown.rstudio.com/