tags: R Shiny Visualization Report 資料視覺化

Shiny Dashboard介紹

Reference from Building Dashboards with shinydashboard.

View another note on ShinyApp.

Example

library(shinydashboard)

# create header, sidebar & body
header = dashboardHeader(...)
sidebar = dashboardSidebar(...)
body = dashboardBody(...)

ui = dashboardPage(header,sidebar,body)
server = function(input, output) {
    ...
}
shinyApp(ui, server)

1. UI

(1) Header

• Messages

dashboardHeader(
  dropdownMenu(
    type = "messages",
    messageItem(
        from = "Lucy",
        message = "You can view the International Space Station!",
        href = "https://spotthestation.nasa.gov/sightings/"
        ),
    messageItem(
        from = "Lucy",
        message = "Learn more about the International Space Station",
        href = "https://spotthestation.nasa.gov/faq.cfm"
        )
    )
)

• Notifications

dashboardHeader(
  dropdownMenu(
    type = 'notifications',
    notificationItem("The International Space Station is overhead!")
  )
)

• Tasks

dashboardHeader(
  dropdownMenu(
    type = 'tasks',
    taskItem("Mission Learn Shiny Dashboard", 10) # progress bar
    )
)

• Reactive Menu Items

output$task_menu <- renderMenu({
  tasks = apply(task_data, 1, function(row){
            taskItem(text = row[['text']],
                     value = row[['value']])
            })
  dropdownMenu(type = 'tasks', .list = tasks)

(2) Sidebar

View 'ShinyApp' note for the detail.

dashboardSidebar(
  sidebarMenu(
    menuItem(text = 'Dashboard', tabName = 'dashboard'),
    menuItem(text = 'Inputs', tabName = 'inputs')
  )
  selectInput(...) 
)

(3) Body

dashboardBody(
  tabItems(
    tabItem(
      tabName = "dashboard",
      tabBox(title = "International Space Station Fun Facts",
             tabPanel("Fun Fact 1"),
             tabPanel("Fun Fact 2")
      ),
    tabItem(tabName = "inputs")
    )
  )
)

• Row-based Layout
  • Status parameter
    • primary: Blue (sometimes dark blue)
    • success: Green
    • info: Blue
    • warning: Orange
    • danger: Red
  • Color argument

body <- dashboardBody(
  fluidRow(
  box(
      width = 12,
      title = 'Regular Box, Row 1',
      subtitle = 'Star Wars',
      color = 'yellow'
      ))
  )
)

• Column-based Layout

body <- dashboardBody(
  fluidRow(
    column(width = 6,
      infoBox(
        width = NULL,
        title = "Regular Box, Column 1",
        subtitle = "Gimme those Star Wars",
        status = 'danger'
        )
      )
  )
)

(4) Beautify

• Skin
  • blue, black, purple, green, red, yellow

ui <- dashboardPage(
  skin = 'purple',
  header = dashboardHeader(),
  sidebar = dashboardSidebar(),
  body = dashboardBody()
  )

• CSS
  • customize the CSS by using the tags()

body <- dashboardBody(
  tags$head(
    tags$style(HTML(
    'h3 {
    font-weight: bold;
    }'))
  )
)

• icon
  • more icons at: Font Awesome Website

icon = icon('rocket')

2. Server

• Read in real-time data
  • reactiveFileReader
  • reactivePoll

server = function(input, output, session) {
  reactive_starwars_data = reactiveFileReader(
         intervalMillis = 1000,
         session = session, 
         filePath = starwars_url,
         readFunc = function(filePath) { 
           read.csv(url(filePath))
         }
  )
  output$table = renderTable({
    reactive_starwars_data()
  })
}

• Reactive Boxes

sidebar = dashboardSidebar(
  actionButton("click", "Update click box")
) 

server = function(input, output) {
  output$click_box <- renderValueBox({
    valueBox(
      value = input$click, # increases in value each time the user clicks the action button.
      subtitle = 'Click Box'
    )
  })
}

body = dashboardBody(
      valueBoxOutput('click_box')
 )

• Optimization
  • You have a file that is static that you want your users to have access to.

# Each time a new user visits your application.
server <- function(input, output) { 
  storms <- read.csv("starwars.csv")
}

# Optimizational way:
# Once when the application is launched.
storms <- read.csv("starwars.csv")
server <- function(input, output) { 
}

3. Other Method: Using Rmd

• 一但將runtime改為Shiny後
• 會從靜態網頁變成動態網站
• 需要有一個Web Server才能使用