Statusuri și finalizarea UI
Unul dintre principiile unui UI bun spune că ar trebui să folosim culorile în mod intuitiv. Din fericire, shinydashboard oferă posibilitatea de a seta statusuri pentru anumite elemente. Acest lucru se realizează adăugând un argument status elementelor corespunzătoare, cum ar fi box(), notificationItem(), dropdownMenu(), deși ultimele două funcții nu vor fi acoperite în acest curs.
Setarea status = "success" produce o colorare verde, status = "danger" produce o colorare roșie, status = "warning" produce portocaliu și tot așa.
Acest exercițiu face parte din cursul
Crearea dashboardurilor cu shinydashboard
Instrucțiuni pentru exercițiu
- Schimbă statusul primului box din rândul al treilea la "success".
- Consultă liniile 28-33, unde sunt specificate valorile pentru
ValueBox()-urile din rândul al doilea, și fă același lucru pentru cele din rândul al treilea. - Definește outputul obiectului
plotlycare a fost numit "line" în pasul anterior. - Randează shinydashboard-ul folosind
uișiserver-ul pe care tocmai le-ai definit.
Exercițiu interactiv practic
Încearcă acest exercițiu completând acest cod de exemplu.
header <- dashboardHeader(title = "Portfolio information")
sidebar <- dashboardSidebar(disable = TRUE)
body <- dashboardBody(
fluidRow(box(selectInput("stock", "Stock name", choices = c("AAPL", "DIS")))),
fluidRow(valueBoxOutput("name", width = 2),
valueBoxOutput("open", width = 2),
valueBoxOutput("close", width = 2),
valueBoxOutput("high", width = 2),
valueBoxOutput("low", width = 2),
valueBoxOutput("vol", width = 2)),
# Change status to "success"
fluidRow(box("This stock is in your portfolio", width = 2, status = "danger"),
valueBoxOutput("open_pct", width = 2),
valueBoxOutput("close_pct", width = 2),
valueBoxOutput("high_pct", width = 2),
valueBoxOutput("low_pct", width = 2),
valueBoxOutput("vol_pct", width = 2)),
fluidRow(box(plotlyOutput("line")),
box(radioButtons("feature", "Features",
choiceNames = c("Open", "Close", "High", "Low", "Volume"),
choiceValues = c("open", "close", "high", "low", "volume")) ) )
)
ui <- dashboardPage(header, sidebar, body)
server <- function(input, output) {
output$name <- renderValueBox(valueBox("Stock name", get_name(input$stock), color = "black"))
output$open <- renderValueBox(valueBox("Open price", most_recent(input$stock, "open"), color = "black"))
output$close <- renderValueBox(valueBox("Close price", most_recent(input$stock, "close"), color = "black"))
output$high <- renderValueBox(valueBox("High", most_recent(input$stock, "high"), color = "black"))
output$low <- renderValueBox(valueBox("Low", most_recent(input$stock, "low"), color = "black"))
output$vol <- renderValueBox(valueBox("Volume", most_recent(input$stock, "volume"), color = "black"))
# Specify the values for ValueBoxes in the third row
output$open_pct <- ___(valueBox("Change", paste0(most_recent_pct(input$stock, "open"),"%"), color = box_color(most_recent_pct(input$stock, "open"))))
___ <- ___(___("Change", paste0(most_recent_pct(input$stock, "close"),"%"), color = box_color(most_recent_pct(input$stock, "close"))))
___ <- ___(___("Change", paste0(most_recent_pct(input$stock, "high"),"%"), color = box_color(most_recent_pct(input$stock, "high"))))
___ <- ___(___("Change", paste0(most_recent_pct(input$stock, ___),"%"), color = box_color(most_recent_pct(input$stock, ___))))
___ <- ___(___("Change", paste0(most_recent_pct(___, ___),"%"), color = box_color(most_recent_pct(___, ___))))
# Plotly object in the fourth row
___ <- ___(plot_line(input$stock, input$feature))
}
# Render the dashboard using shinyApp()
___