Интерактивные элементы в shinydashboard

Создание дашбордов с помощью shinydashboard

Png Kee Seng

Researcher

Сценарий

Мы работаем в туристическом агентстве в Лондоне.
Туристам нужно жильё.
Как мы можем им помочь?

Графическое изображение Лондона

Количество объявлений в заданном ценовом диапазоне
Доля частных комнат
Средние цены
Несколько графиков
Таблица данных
Карта Лондона

¹ Изображение: Freepik

Эскиз дашборда

Предварительный эскиз дашборда.

Создание дашборда: настройка каркаса

Создание каркаса: пустой shinydashboard с заголовком и кнопками на боковой панели.

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

server <- function(input, output) {}

shinyApp(ui, server)

Создание дашборда: добавление ValueBox

Добавление valueboxes в рамках создания каркаса.

В body:

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

В server:

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

Создание дашборда: добавление элементов управления

Добавление элементов управления для пользователей.

В body:

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

Обновите server, используя input$range[1] и input$range[2]

Создание дашборда: добавление интерактивных графиков

Добавление интерактивных графиков с помощью plotly.

В body:

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

В server:

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

Создание дашборда: добавление ещё одного графика

Добавление второго графика на ту же страницу дашборда с доступом через выпадающее меню.

В body:

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

В server:

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

Создание дашборда: добавление описания и вкладок

Добавление поясняющего текста для дашборда.

В body:

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

Обновление body:

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

Создание дашборда: добавление интерактивных таблиц

Добавление интерактивных таблиц с помощью функций dataTable.

Можно использовать функции shiny.

В body:

dataTableOutput("table")

В server:

output$table <- 
    renderDataTable(listings)

Создание дашборда: добавление интерактивной карты

Добавление карты leaflet в дашборд.

В sidebar:

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

В body:

leafletOutput("map",...)

В server:

output$map <- renderLeaflet(map)

Давайте потренируемся!

Создание дашбордов с помощью shinydashboard