외계인 목격: 탭 레이아웃

현재 앱은 그래프가 표 위에 있어서 조금 복잡해 보여요. 대시보드라는 점을 고려하면, 두 결과물을 분리하는 편이 더 보기 좋겠죠.

대시보드 구축의 마지막 단계로, 이미 만든 plotOutput()과 tableOutput()에 탭 레이아웃을 추가하세요.

이 연습은 강의의 일부입니다

R로 Shiny 웹 애플리케이션 만들기

강의 보기

연습 안내

탭 패널 레이아웃과 두 개의 탭을 추가하세요. 첫 번째 탭에는 플롯을, 두 번째 탭에는 표를 넣으세요. 탭 이름은 상황에 맞게 자유롭게 정하셔도 됩니다!

실습형 인터랙티브 연습

이 예제를 이 샘플 코드를 완성하여 풀어보세요.

ui <- fluidPage(
  titlePanel("UFO Sightings"),
  sidebarPanel(
    selectInput("state", "Choose a U.S. state:", choices = unique(usa_ufo_sightings$state)),
    dateRangeInput("dates", "Choose a date range:",
      start = "1920-01-01",
      end = "1950-01-01"
    )
  ),
  # MODIFY CODE BELOW: Create a tab layout for the dashboard
  mainPanel(
    plotOutput("shapes"),
    tableOutput("duration_table")
  )
)

server <- function(input, output) {
  output$shapes <- renderPlot({
    usa_ufo_sightings %>%
      filter(
        state == input$state,
        date_sighted >= input$dates[1],
        date_sighted <= input$dates[2]
      ) %>%
      ggplot(aes(shape)) +
      geom_bar() +
      labs(
        x = "Shape",
        y = "# Sighted"
      )
  })

  output$duration_table <- renderTable({
    usa_ufo_sightings %>%
      filter(
        state == input$state,
        date_sighted >= input$dates[1],
        date_sighted <= input$dates[2]
      ) %>%
      group_by(shape) %>%
      summarize(
        nb_sighted = n(),
        avg_duration_min = mean(duration_sec) / 60,
        median_duration_min = median(duration_sec) / 60,
        min_duration_min = min(duration_sec) / 60,
        max_duration_min = max(duration_sec) / 60
      )
  })
}

shinyApp(ui, server)

코드 편집 및 실행