Statuses and completing the UI
One of the principles of good UI states that we ought to use colors intuitively. Luckily for us, shinydashboard
has an option to set statuses in some shinydashboard
elements. This is done by adding a status
argument to those appropriate elements, like box()
, notificationItem()
, dropdownMenu()
, although the latter two functions will not be covered in this course.
Setting status = "success"
results in a green coloration, status = "danger"
results in a red coloration, status = "warning"
is orange, and so on.
This exercise is part of the course
Building Dashboards with shinydashboard
Exercise instructions
- Change the status of the first box in the third row to "success".
- Refer to lines 28 to 33, where the values for
ValueBox()
s in the second row are specified, and do the same for those in the third row. - Define the output of the
plotly
object which was named "line" in the previous step. - Render the shinydashboard using the
ui
andserver
that you just defined.
Hands-on interactive exercise
Have a go at this exercise by completing this sample code.
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()
___