Aan de slagGa gratis aan de slag

Move Input to Chart Box

Let's move the user input to be in the chart it impacts.

Deze oefening maakt deel uit van de cursus

Building Dashboards with flexdashboard

Cursus bekijken

Oefeninstructies

  • Move the slider from the sidebar to the Trip Durations chart, above the plot.
  • Remove the sidebar from the dashboard.
  • Note the layout of the input slider and the plot in the chart and how it does (or does not) fill the box appropriately.

Praktische interactieve oefening

Probeer deze oefening eens door deze voorbeeldcode in te vullen.

{"my_document.Rmd":"---\ntitle: \"Bike Shares Daily\"\noutput: \n  flexdashboard::flex_dashboard:\n    orientation: columns\n    vertical_layout: fill\nruntime: shiny\n---\n\n```{r global, include=FALSE}\nlibrary(flexdashboard)\nlibrary(readr)\nlibrary(leaflet)\nlibrary(DT)\nlibrary(tidyverse)\nlibrary(lubridate)\nlibrary(plotly)\n\ntrips_df <- read_csv('https://assets.datacamp.com/production/repositories/1448/datasets/1f12031000b09ad096880bceb61f6ca2fd95e2eb/sanfran_bikeshare_joined_oneday.csv') %>%\n  mutate(duration_min = duration_sec / 60) %>%\n  filter(duration_min <= 8 * 60) # filtering out trips over 8 hours as suspicious\n\n```\n\nColumn {data-width=200 .sidebar}\n-----------------------------------------------------------------------\n\n```{r}\nsliderInput(\"duration_bin\", label = \"Select # of minutes to bin trip durations:\",\nmin = 1, max = 15, value = 5, step = 1)\n```\n\nColumn {data-width=450}\n-----------------------------------------------------------------------\n\n### Origins\n\n```{r}\n\nrenderLeaflet({\n  trips_df %>%\n    rename(latitude = start_latitude,\n           longitude = start_longitude) %>%\n    group_by(start_station_id, latitude, longitude) %>%\n    count() %>%\n    leaflet() %>%\n    addTiles() %>%\n    addCircles(radius = ~n)\n})\n\n```\n\nColumn {data-width=350}\n-----------------------------------------------------------------------\n\n### Total Trips\n\n```{r}\n\nrenderValueBox({\n  valueBox(prettyNum(trips_df %>%\n                       nrow(), big.mark = ','), \n           icon = 'fa-bicycle')\n})\n\n```\n\n### Trip Durations\n\n```{r}\n\nrenderPlot({trips_df %>%\n  mutate(`Trip Duration (min)` = duration_sec / 60) %>%\n  ggplot(aes(x = `Trip Duration (min)`)) +\n  theme_bw() +\n  geom_histogram(binwidth = input$duration_bin) +\n  ylab('# Trips')\n})\n\n\n```\n\n\n"}
Code bewerken en uitvoeren