CommencezCommencez gratuitement

Ébauche (wireframing)

Reprenons l'exemple précédent du tableau de bord pour les résultats d'analyse d'un tournoi de soccer. Dans les exercices précédents, vous avez déjà configuré l'en-tête et la barre latérale.

En particulier, un bouton dans la barre latérale est défini par menuItem() et est contenu dans sidebarMenu(). Vous avez peut-être remarqué que ces boutons ne font encore rien. Vous allez maintenant lier ces boutons de la barre latérale à une page distincte dans le corps de l'interface utilisateur. Cela fait toujours partie du processus d'ébauche, où vous décidez encore de l'emplacement de chaque objet. Chaque page dans le corps est définie par tabItem() et doit être contenue dans tabItems.

Les paquetages shiny et shinydashboard ont déjà été chargés pour vous. De plus, l'en-tête du tableau de bord a déjà été enregistré sous header.

Cette activité fait partie du cours

Créer des tableaux de bord avec shinydashboard

Voir le cours

Exercice interactif pratique

Essayez cet exercice en complétant ce code d’exemple.

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)
Modifier et exécuter le code