www.rquer.netlify.com

Friends: IMDB rating by Season

---
title: "Combining a table with multiple scatterplots"
author: "Rubén F. Bustillo"
output: 
  flexdashboard::flex_dashboard:
    storyboard: true
    orientation: columns
    source_code: embed
    vertical_layout: fill
    theme: paper
---

```{r setup, include=FALSE}

# PACKAGES / LIBRARIES:

library(flexdashboard)
library(tidyverse)
library(plotly)
library(reactable)
library(glue)
library(htmltools)
library(sparkline)

options(scipen=999)



# web: https://glin.github.io/reactable/articles/examples.html#sorting
# Thomas Mock example: https://gist.github.com/jthomasmock/77ee1220e6a2460dccd83d8919148239

```

[www.rquer.netlify.com](https://rquer.netlify.com/)

Friends: IMDB rating by Season
=========================================================================================


```{r, out.width="100%"}


friends_info <- readr::read_csv('https://raw.githubusercontent.com/rfordatascience/tidytuesday/master/data/2020/2020-09-08/friends_info.csv')



options(reactable.theme = reactableTheme(
  color = "white",
  backgroundColor = "#9c8cd4"
))




friends_info <- friends_info %>%
  rename(
    Season = season,
    Episode = episode,
    Title = title,
    "Directed by" = directed_by,
    "Written by" = written_by,
    "Air date" = air_date,
    Views = us_views_millions,
    Rating = imdb_rating 
  )




friends_df <- friends_info %>%
  group_by(Season) %>%
  summarize(imdb = list(Rating)) %>%
  mutate(
    Boxplot = NA,
    Sparkline = NA,
    color = c("deeppink", "green", "darkorange1", "#7D00FF", "#FF4238", "#FFDC00", "darkorchid4", "#9A0006", "darkgoldenrod4", "#00009E")
  )


friends_df %>% 
  reactable(
    columns = list(
      imdb = colDef(show = F),
      color = colDef(show = F),
      Boxplot = colDef(cell = function(value, index){
        sparkline(friends_df$imdb[[index]], type = "box")
      }),
      Sparkline = colDef(cell = function(value, index){
        sparkline(friends_df$imdb[[index]])
      })
    )
    ,
    details = function(index){
      match_season <- friends_df$Season[index]
      plots_data <- filter(friends_info, Season == match_season)
      plot_col <- filter(friends_df, Season == match_season) %>% pull(color)
      htmltools::div(style = "padding: 80px", {
        p1 <- ggplot(plots_data, aes(x = Rating, y = Views, 
                                     label = Title,
                                     label2 = Season, 
                                     label3 = Episode, 
                                     label4 = `Directed by`,
                                     label5 = `Written by`,
                                     label6 = `Air date`)) +
          geom_point(data = friends_info, color = "snow2", alpha = 0.8) +
          geom_point(color = plot_col, size = 2) +
          #theme_minimal() +
          theme(plot.background = element_rect(fill = "#9c8cd4"),
                panel.background = element_rect(fill = "#9c8cd4"),
                plot.title=element_text(size = 25, 
                                        hjust = 0.5),
                plot.subtitle = element_text(size = 20,
                                             hjust = 0.5),
                text = element_text(size = 12,
                                    colour = "#FFF580"),
                axis.line.x = element_line(size = 1.1, 
                                           colour = "white"),
                axis.line.y = element_line(size = 1.1, 
                                           colour = "white"),
                panel.grid.major = element_blank(),
                panel.grid.minor = element_blank(),
                axis.text.x=element_text(colour="white", 
                                         size = 12),
                axis.text.y=element_text(colour="white", 
                                         size = 10)) +
          labs(title = glue::glue("Friends: Season {match_season}."),
               subtitle = "US views VS. IMDB rating",
               x = "IMDB rating", 
               y = "US views (millions)")
        
        plotly::ggplotly(p1)
      }
      )
    }
  )

```