Get startedGet started for free

Converting our flexdashboard to use Shiny

Let's make this dashboard shiny!

This exercise is part of the course

Building Dashboards with flexdashboard

View Course

Exercise instructions

  • Change the YAML header to make this an interactive RMarkdown document.
  • Generate the dashboard and try selecting different regions in the input sidebar. Observe the changes in the dashboard.

Hands-on interactive exercise

Have a go at this exercise by completing this sample code.

{"my_document.Rmd":"---\ntitle: \"Bike Shares Daily\"\noutput: \n  flexdashboard::flex_dashboard:\n    orientation: columns\n    vertical_layout: fill\n---\n\n```{r global, include=FALSE}\nlibrary(flexdashboard)\nlibrary(readr)\nlibrary(leaflet)\nlibrary(DT)\nlibrary(tidyverse)\nlibrary(lubridate)\nlibrary(plotly)\n\noptions(shiny.sanitize.errors = FALSE)\n\ntrips_df <- read_csv('https://assets.datacamp.com/production/course_6961/datasets/sanfran_bikeshare_joined_oneday.csv') %>%\n  mutate(duration_min = duration_sec / 60)\n\nsf_bbox <- c(-123.0137, 37.6040, -122.3549, 37.8324)\nsj_bbox <- c(-122.0457, 37.1255, -121.5891, 37.4692)\n\ntrips_df <- trips_df %>%\n  mutate(city = ifelse((start_latitude >= sf_bbox[2] & start_latitude <= sf_bbox[4]) &\n                         (start_longitude >= sf_bbox[1] & start_longitude <= sf_bbox[3]),\n                       'San Francisco', ifelse((start_latitude >= sj_bbox[2] & start_latitude <= sj_bbox[4]) &\n                                                 (start_longitude >= sj_bbox[1] & start_longitude <= sj_bbox[3]),\n                                               'San Jose', 'Other')))\n```\n\nColumn {data-width=200 .sidebar}\n-----------------------------------------------------------------------\n\n```{r}\n\nradioButtons(\"origin_location\", label = \"Select trip origin region to display:\", \n             choices = c('All' = 'all', 'San Francisco' = 'sf', 'San Jose' = 'sj'), \n             selected = c('all'))\n\ntrips <- reactive({\n\n  if(input$origin_location == 'sf') {\n    trips_df <- trips_df %>% filter(city == 'San Francisco')\n  } else if(input$origin_location == 'sj') {\n    trips_df <- trips_df %>% filter(city == 'San Jose')\n  }\n\n  trips_df\n\n})\n\n```\n\nColumn {data-width=450}\n-----------------------------------------------------------------------\n\n### Origins\n\n```{r}\n\nrenderLeaflet({\n  trips() %>%\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\nColumn {data-width=350}\n-----------------------------------------------------------------------\n\n### Total Trips\n\n```{r}\n\nrenderValueBox({\n  valueBox(prettyNum(trips() %>%\n                       nrow(), big.mark = ','), \n           icon = 'fa-bicycle')\n})\n\n\n# valueBox(prettyNum(nrow(trips_df), big.mark = ','), icon = 'fa-bicycle')\n```\n\n### Trips by Start Time\n\n```{r}\n\nrenderPlot({trips() %>%\n    mutate(hour = hour(start_date)) %>%\n    group_by(hour) %>%\n    summarize(`Trips Started` = n()) %>%\n    ggplot(aes(x = hour, y = `Trips Started`)) +\n    theme_bw() +\n    ylab('Trips Started \\n') +\n    geom_bar(stat = 'identity') \n})\n\n\n```\n\n\n"}
Edit and Run Code