Elementy interaktywne w shinydashboard

Tworzenie dashboardów z shinydashboard

Png Kee Seng

Researcher

Scenariusz

Pracujemy w biurze podróży w Londynie.
Turyści potrzebują noclegu.
Co możemy dla nich zrobić?

Grafika przedstawiająca Londyn

Liczba ofert w danym przedziale cenowym
Odsetek pokoi prywatnych
Średnie ceny
Wykresy
Tabela danych
Mapa Londynu

¹ Image by Freepik

Szkic dashboardu

Wstępny szkic dashboardu.

Budowanie dashboardu: Tworzenie szkieletu

Wireframing: tworzenie pustego shinydashboard z tytułem i przyciskami w sidebarze.

header <- dashboardHeader(
  title = "Home rental listings")
sidebar <- dashboardSidebar()
body <- dashboardBody()
ui <- dashboardPage(header, 
                    sidebar, 
                    body)

server <- function(input, output) {}

shinyApp(ui, server)

Budowanie dashboardu: Dodawanie ValueBox

Dodawanie valueboxów w ramach wireframingu.

W body:

fluidRow(
    valueBoxOutput(outputId = "count"),
    valueBoxOutput(outputId = "prop"),
    valueBoxOutput(outputId = "avg"))

W server:

output$count <- renderValueBox({
    valueBox(..., icon = ...)})
output$prop <- renderValueBox(...)
...

Budowanie dashboardu: Dodawanie kontrolek

Dodawanie kontrolek dla użytkowników.

W body:

box(
    side = "right", ...,
    sliderInput(inputId = "range",
        label = "Select price range:",
        min = 0,
        max = 25000,
        value = c(0,25000))
        ))

Aktualizacja server: użyj input$range[1] i input$range[2]

Budowanie dashboardu: Dodawanie interaktywnych wykresów

Dodawanie interaktywnych wykresów za pomocą plotly.

W body:

plotlyOutput("plots", 
    height = 500, 
    width = 600)

W server:

output$plots <- renderPlotly({
      ...
  })

Budowanie dashboardu: Dodawanie kolejnego wykresu

Dodawanie drugiego wykresu na tej samej stronie dashboardu, dostępnego przez menu rozwijane.

W body:

selectInput(inputId = "select", 
    label = "Select group:", 
    choices = c("Neighbourhood", 
            "Room Type"))

W server:

output$plots <- renderPlotly({
    if (input$select == ...){plot1}
    else if(input$select == ...){plot2}
  })

Budowanie dashboardu: Dodawanie opisu i zakładek

Dodawanie tekstu wyjaśniającego do dashboardu.

W body:

box(side = "right", ...,
    title = "Welcome to London!", 
    "...")

Aktualizacja w body:

tabBox(id = "tabset", ...,
    tabPanel("Charts", ...),
    tabPanel("Data table", ...)

Budowanie dashboardu: Dodawanie interaktywnych tabel

Dodawanie interaktywnych tabel za pomocą funkcji dataTable.

Można użyć funkcji shiny.

W body:

dataTableOutput("table")

W server:

output$table <- 
    renderDataTable(listings)

Budowanie dashboardu: Dodawanie interaktywnej mapy

Dodawanie mapy leaflet do dashboardu.

W sidebar:

sidebarMenu(
    menuItem("Charts", ...),
    menuItem("Map", ...))

W body:

leafletOutput("map",...)

W server:

output$map <- renderLeaflet(map)

Ćwiczmy!

Tworzenie dashboardów z shinydashboard