Layout e temi

Creare applicazioni web con Shiny in R

Kaelen Medeiros

Data Scientist

Layout predefinito di Shiny

ui <- fluidPage(
  titlePanel("Istogramma"),
  sliderInput('nb_bins', '# Bins', 5, 10, 5),
  plotOutput('hist')
)
server <- function(input, output, session){
  output$hist <- renderPlot({
    hist(faithful$waiting, 
         breaks = input$nb_bins, 
         col = 'steelblue')
  })
}
shinyApp(ui = ui, server = server)

Un'app che mostra un istogramma dei tempi di attesa e uno slider per il numero di bin

Layout con barra laterale

ui <- fluidPage(
  titlePanel("Istogramma"),
  sidebarLayout(
    sidebarPanel(sliderInput('nb_bins', 
                             '# Bins', 5, 10, 5)),
    mainPanel(plotOutput('hist'))
  )
)
server <- function(input, output, session){
  output$hist <- renderPlot({
    hist(faithful$waiting, breaks = input$nb_bins, 
         col = 'steelblue')
  })
}
shinyApp(ui = ui, server = server)

Un'app che mostra un istogramma dei tempi di attesa a destra e uno slider per il numero di bin, a sinistra

Layout a schede

Un'app che mostra un istogramma dei tempi di attesa a destra e uno slider per il numero di bin, a sinistra

Un'app che mostra un istogramma dei tempi di attesa a destra e uno slider per il numero di bin, a sinistra, con due schede

Layout a schede

ui <- fluidPage(
  titlePanel("Istogramma"),
  sidebarLayout(
    sidebarPanel(sliderInput('nb_bins', '# Bins', 
                             5, 10, 5)),
    mainPanel(

      tabsetPanel(
        tabPanel('Attese', 
                 plotOutput('hist_waiting')),
        tabPanel('Eruzioni',
                 plotOutput('hist_eruptions'))
      )

    )
  )
)

server <- function(input, output, session){
  output$hist_waiting <- renderPlot({
    hist(faithful$waiting, 
         breaks = input$nb_bins, 
         col = 'steelblue')
  })
  output$hist_eruptions <- renderPlot({
    hist(faithful$eruptions, 
         breaks = input$nb_bins, 
         col = 'steelblue')
  })
}
shinyApp(ui = ui, server = server)

Selettore di tema

ui <- fluidPage(
  titlePanel("Istogramma"),

  shinythemes::themeSelector(),

  sidebarLayout(
    sidebarPanel(sliderInput('nb_bins', '# Bins', 
                             5, 10, 5)),
    mainPanel(plotOutput('hist'))
  )
)
server <- function(input, output, session){
  output$hist <- renderPlot({
    hist(faithful$waiting, breaks = input$nb_bins, 
         col = 'steelblue')
  })
}
shinyApp(ui = ui, server = server)

Un'app che mostra un istogramma dei tempi di attesa a destra e uno slider per il numero di bin, più un selettore di tema flottante

Aggiungere un tema

ui <- fluidPage(
  titlePanel("Istogramma"),

  theme = shinythemes::shinytheme('superhero'),

  sidebarLayout(
    sidebarPanel(sliderInput('nb_bins', '# Bins', 
                             5, 10, 5)),
    mainPanel(plotOutput('hist'))
  )
)
server <- function(input, output, session){
  output$hist <- renderPlot({
    hist(faithful$waiting, breaks = input$nb_bins, 
         col = 'steelblue')
  })
}
shinyApp(ui = ui, server = server)

Un'app che mostra un istogramma dei tempi di attesa a destra e uno slider per il numero di bin, a sinistra

¡Vamos a practicar!

Creare applicazioni web con Shiny in R