---
title: "First Flex Dashboard"
output: 
  flexdashboard::flex_dashboard:
    orientation: columns
    vertical_layout: fill
---

```{r setup, include=FALSE}
library(flexdashboard)
```

Column {data-width=650}
-----------------------------------------------------------------------

### Chart A

```{r}
library(leaflet)

m_csueb <- leaflet() %>%
  addTiles() %>%  # Add default OpenStreetMap map tiles
  addMarkers(lng=-122.053765, lat=37.656057, popup="Stat. 651 on the CSU East Bay campus.")  
m_csueb  # Print the map
```

Column {data-width=350}
-----------------------------------------------------------------------

### Chart B

```{r}
library(tidyverse)
library(plotly)
library(mdsr)
library(babynames)

Beatles <- babynames %>%
  filter(name %in% c("John", "Paul", "George", "Ringo") & sex == "M")

beatles_plot <- Beatles %>% ggplot(aes(x = year, y = n)) +
  geom_line(aes(color = name), size = 2)

ggplotly(beatles_plot)
```

### Chart C

```{r}
library(dygraphs)

Beatles %>% select(year, name, prop) %>%
  spread(key = name, value = prop) %>%
  dygraph(main = "Popularity of Beatles names over time") %>%
  dyRangeSelector(dateWindow = c("1940", "1980"))
```