Інтерактивні елементи в shinydashboard

Створення панелей керування з shinydashboard

Png Kee Seng

Researcher

Сценарій

Ми працюємо в туристичній агенції в Лондоні.
Туристам потрібне житло.
Чим ми можемо допомогти?

Графічне зображення Лондона

Кількість оголошень у діапазоні цін
Частка приватних кімнат
Середні ціни
Деякі діаграми
Таблиця даних
Мапа Лондона

¹ Image by Freepik

Ескіз дашборду

Чернетка ескізу дашборду.

Створення дашборду: налаштування каркаса

Створіть wireframe: порожній shinydashboard із потрібною назвою та кнопками в сайдбарі.

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

server <- function(input, output) {}

shinyApp(ui, server)

Створення дашборду: додавання ValueBox

Додаємо valueBox як частину wireframe.

У 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