เริ่มต้นใช้งานเริ่มต้นใช้งานได้ฟรี

แสดงผลลัพธ์ต่าง ๆ บนแท็บที่แยกกัน

แท็บมีประโยชน์มากเมื่อมีเนื้อหาจำนวนมากและต้องการแบ่งออกเป็นส่วน ๆ การสร้างแท็บทำได้โดยการครอบ UI elements ไว้ในฟังก์ชัน tabPanel() และกำหนดชื่อแท็บโดยใช้อาร์กิวเมนต์ title

เพื่อให้แท็บปรากฏใน UI แท็บแพนเนลทั้งหมดจะต้องถูกจัดกลุ่มไว้ใน "container" ของ tabset โดยการครอบแท็บแพนเนลทั้งหมดไว้ในฟังก์ชัน tabsetPanel()

โจทย์ของคุณคือเพิ่มแท็บลงใน Shiny app โดยให้ inputs และปุ่มดาวน์โหลดอยู่ในแท็บหนึ่ง กราฟอยู่ในอีกแท็บหนึ่ง และตารางอยู่ในแท็บที่สาม เนื่องจากนี่เป็นการเปลี่ยนแปลงเชิงภาพเท่านั้น การแก้ไขโค้ดทั้งหมดจึงทำในส่วน UI เท่านั้น

แบบฝึกหัดนี้เป็นส่วนหนึ่งของหลักสูตร

กรณีศึกษา: การสร้างเว็บแอปพลิเคชันด้วย Shiny ใน R

ดูคอร์ส

คำแนะนำการฝึกหัด

  • ใช้ฟังก์ชัน tabsetPanel() เพื่อสร้าง container สำหรับแท็บแพนเนลสามแท็บ:
    • แท็บแรกสำหรับ inputs และตั้งชื่อแท็บว่า "Inputs"
    • แท็บที่สองสำหรับแสดงกราฟ และตั้งชื่อแท็บว่า "Plot" (บรรทัดที่ 16)
    • แท็บที่สามสำหรับแสดงตาราง และตั้งชื่อแท็บว่า "Table" (บรรทัดที่ 21)

แบบฝึกหัดเชิงโต้ตอบแบบลงมือทำ

ลองทำแบบฝึกหัดนี้โดยเติมโค้ดตัวอย่างนี้ให้สมบูรณ์

ui <- fluidPage(
    h1("Gapminder"),
    # Create a container for tab panels
    ___(
        # Create an "Inputs" tab
        tabPanel(
            title = ___,
            sliderInput(inputId = "life", label = "Life expectancy",
                        min = 0, max = 120,
                        value = c(30, 50)),
            selectInput("continent", "Continent",
                        choices = c("All", levels(gapminder$continent))),
            downloadButton("download_data")
        ),
        # Create a "Plot" tab
        ___(
            title = "Plot",
            plotOutput("plot")
        ),
        # Create "Table" tab
        ___(
            title = ___,
            DT::dataTableOutput("table")
        )
    )
)

server <- function(input, output) {
  filtered_data <- reactive({
    data <- gapminder
    data <- subset(
      data,
      lifeExp >= input$life[1] & lifeExp <= input$life[2]
    )
    if (input$continent != "All") {
      data <- subset(
        data,
        continent == input$continent
      )
    }
    data
  })
  
  output$table <- DT::renderDataTable({
    data <- filtered_data()
    data
  })

  output$download_data <- downloadHandler(
    filename = "gapminder_data.csv",
    content = function(file) {
      data <- filtered_data()
      write.csv(data, file, row.names = FALSE)
    }
  )

  output$plot <- renderPlot({
    data <- filtered_data()
    ggplot(data, aes(gdpPercap, lifeExp)) +
      geom_point() +
      scale_x_log10()
  })
}

shinyApp(ui, server)
แก้ไขและรันโค้ด