R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD...
Transcript of R Shiny Interactive visualization · Interactive visualization: R Shiny Weiai Xu (Wayne), PhD...
![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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/1.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/2.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/3.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/4.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/5.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/6.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/7.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/8.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/9.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/10.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/11.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/12.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/13.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/14.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/15.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/16.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/17.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/18.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/19.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/20.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/21.jpg)
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](https://reader035.fdocuments.in/reader035/viewer/2022081402/5f0eb36d7e708231d44082fd/html5/thumbnails/22.jpg)
Other visualization options
Using R Markdown: https://rmarkdown.rstudio.com/