Layout con barra laterale

Le funzioni di layout permettono di organizzare visivamente input e risultati nella UI. Un layout ben scelto rende una app Shiny più gradevole esteticamente e migliora anche l’esperienza d’uso.

In questo esercizio modificherai il layout di una app Shiny che consente di esplorare la popolarità dei nomi di tendenza. La tua app finale dovrebbe assomigliare visivamente a questa:

Un’app in cui il selettore del nome appare nella barra laterale a sinistra, mentre il grafico appare a destra nel pannello principale

Questo esercizio fa parte del corso

Creare applicazioni web con Shiny in R

Visualizza corso

Istruzioni dell'esercizio

Modifica il layout di questa app in modo che il selettore del nome appaia nella barra laterale e il grafico e la tabella compaiano a destra.

esercizio interattivo pratico

Prova questo esercizio completando questo codice di esempio.

ui <- fluidPage(
  # MODIFY CODE BELOW: Wrap in a sidebarLayout
    # MODIFY CODE BELOW: Wrap in a sidebarPanel
    selectInput('name', 'Select Name', top_trendy_names$name),
    # MODIFY CODE BELOW: Wrap in a mainPanel
    plotly::plotlyOutput('plot_trendy_names'),
    DT::DTOutput('table_trendy_names')
)

# DO NOT MODIFY
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)

Modifica ed esegui il codice