ÎncepețiÎncepe gratuit

Wireframing

Să revenim la exemplul anterior – un dashboard pentru rezultatele analizei unui turneu de fotbal. În exercițiile anterioare, ai configurat deja header-ul și sidebar-ul.

În mod specific, un buton din sidebar este definit prin menuItem() și este inclus în sidebarMenu(). Poate ai observat că aceste butoane nu fac nimic deocamdată. Acum vei lega aceste butoane din sidebar de o pagină diferită din corpul interfeței UI. Acesta este tot un pas din procesul de wireframing, în care decizi poziția fiecărui element. Fiecare pagină din corp este definită prin tabItem() și trebuie inclusă în tabItems.

Pachetele shiny și shinydashboard au fost deja încărcate. De asemenea, header-ul dashboard-ului a fost deja stocat ca header.

Acest exercițiu face parte din cursul

Crearea dashboardurilor cu shinydashboard

Vezi cursul

Exercițiu interactiv practic

Încearcă acest exercițiu completând acest cod de exemplu.

library(shiny)
library(shinydashboard)

header <- dashboardHeader(
  title = "Analysis results for global soccer tournament",
  titleWidth = 400,
  dropdownMenu(type = "messages",
               messageItem("Colleage", "Hello world!")),
  dropdownMenu(type = "notifications",
               notificationItem("Have you rested today?"),
               taskItem("Dashboard completion", value = 20)))

sidebar <- dashboardSidebar(
  sidebarMenu(
    width = 400,
    id = "pages",
    menuItem("Match details", tabName = "matches", icon = icon("futbol"),
             badgeLabel = "New content!", badgeColor = "green"),
    menuItem("Overall results", tabName = "overall", 
             menuSubItem("Charts", tabName = "charts"),
             menuSubItem("Data table", tabName = "datatable", icon=icon("file-excel"))),
    menuItem("A slider",  sliderInput("slider", "Number of goals", min=0, max=10, value = 2))
  )
)

body <- dashboardBody(
  # Link "matches" to an empty page in the body
  ___(
    ___(___, "Match information goes here")
  )
)
ui <- dashboardPage(header, sidebar, body)
server <- function(input, output){}
shinyApp(ui, server)
Editează și rulează codul