Agencements avec onglets
Afficher plusieurs tableaux et graphiques sur la même page peut créer de l’encombrement visuel et distraire les utilisateurs de l’application. Dans ce cas, l’agencement avec onglets est très pratique, car il permet d’afficher différents résultats sous forme d’onglets.
Dans cet exercice, nous allons repartir de l’application Shiny avec disposition en barre latérale de l’exercice précédent et la modifier pour utiliser des onglets. Vous verrez ainsi très clairement qu’avec Shiny, il est très facile de changer l’agencement d’une application avec seulement quelques modifications du code.
Votre application finale devrait ressembler visuellement à ceci :
Cet exercice fait partie du cours
<cours>Créer des applications web avec Shiny en R</cours>Instructions de l’exercice
- Modifiez l’agencement de cette application pour que le sélecteur de nom apparaisse dans la barre latérale et que le graphique et le tableau apparaissent comme des onglets distincts à droite. N’oubliez pas d’ajouter des libellés aux onglets !
Exercice interactif pratique
Essayez cet exercice en complétant ce code d’exemple.
ui <- fluidPage(
sidebarLayout(
sidebarPanel(
selectInput('name', 'Select Name', top_trendy_names$name)
),
mainPanel(
# MODIFY CODE BLOCK BELOW: Wrap in a tabsetPanel
# MODIFY CODE BELOW: Wrap in a tabPanel providing an appropriate label
plotly::plotlyOutput('plot_trendy_names'),
# MODIFY CODE BELOW: Wrap in a tabPanel providing an appropriate label
DT::DTOutput('table_trendy_names')
)
)
)
server <- function(input, output, session){
# Function to plot trends in a name
plot_trends <- function(){
babynames %>%
filter(name == input$name) %>%
ggplot(aes(x = year, y = n)) +
geom_col()
}
output$plot_trendy_names <- plotly::renderPlotly({
plot_trends()
})
output$table_trendy_names <- DT::renderDT({
babynames %>%
filter(name == input$name)
})
}
shinyApp(ui = ui, server = server)