Bắt đầu ngayBắt đầu miễn phí

Thiết lập màu sắc

Ngoài các thiết lập status được mã hóa theo màu, bạn còn có thể đặt thêm nhiều màu cho các đối tượng như valueBox()infoBox().

Available colors

Tiếp theo, bạn sẽ đặt các màu khác nhau trong phần thân của một shinydashboard, dù các đối tượng này cũng có thể được định nghĩa trong server() như bạn đã thấy ở ví dụ trước.

Trong bài tập này, các thư viện shinyshinydashboard đã được nạp sẵn. Ngoài ra, header và sidebar đã được lưu lần lượt là headersidebar, và server() là một hàm rỗng.

Bài tập này là một phần của khóa học

Xây dựng Dashboard với shinydashboard

Xem khóa học

Bài tập tương tác thực hành trực tiếp

Hãy thử làm bài tập này bằng cách hoàn thành đoạn mã mẫu này.

library(shiny)
library(shinydashboard)

header <- dashboardHeader(
  title = "Portfolio dashboard for Sally",
  titleWidth = 300,
  dropdownMenu(type = "notifications",
       notificationItem("Sell alert", status = "danger"),
       notificationItem("Buy alert", status = "success"))
)

sidebar <- dashboardSidebar(
  width = 300,
  sidebarMenu(
    id = "pages",
    menuItem("Historical trends",
             tabName = "historical"),
    menuItem("Profits and Losses (PnLs)", 
             tabName = "profit", 
             icon = icon("money-bill-alt"),
             badgeLabel = "+2.3%", badgeColor = "green")
  )
)

body <- dashboardBody(tabItems(
  tabItem(tabName = "historical",
          fluidRow(box(selectInput("stock", "Select stock symbol", 
                                   choices=c("AAPL", "DIS"))),
                   box("Stock name", 
                       title="Stock name title", 
                       width = 6, 
                       status = "info", solidHeader = TRUE)),
          # Set the color of each infoBox to black
          fluidRow(infoBox("Open", "value", width = 2, color = ___), 
                   infoBox("High", "value", width = 2,___),
                   infoBox("Low", "value", width = 2, ___),
                   infoBox("Close", "value", width = 2, ___),
                   # Set the color of the last infoBox to navy and set its width to 4
                   infoBox("Volume", "value", ___)),
          fluidRow(valueBox("Open (%)", "0%", width = 2), 
                   valueBox("High (%)", "+1%", width = 2),
                   valueBox("Low (%)", "-4%", width = 2),
                   valueBox("Close (%)", "-2%", width = 2),
                   valueBox("Volume (%)", "+30%", width = 2)),
          fluidRow(box("Candlestick chart", width = 12, height = 350)),
          fluidRow(box("Volume chart", width = 12, height = 200))),
  tabItem(tabName = "profit",
          fluidRow(box("valueBox", "Account balance", width = 3),
                   box("valueBox",  "Value at Risk (Var)", width = 3),
                   box("valueBox", "Returns", width = 3),
                   box("valueBox", "Profit-to-loss ratio", width = 3)),
          fluidRow(box("PnL chart", width = 12, height = 400)))
)
)

ui <- dashboardPage(header, sidebar, body)
server <- function(input, output){}
shinyApp(ui, server)
Chỉnh sửa và Chạy Mã