Other Charts

Haley Jeppson

2019-06-20

This document is adapted from the Other Charts section of the Altair Example Gallery.

Our first step is to set up our environment:

# devtools::install_github("vegawidget/altair")
library("altair")
library("tibble")
library("dplyr")
#> 
#> Attaching package: 'dplyr'
#> The following objects are masked from 'package:stats':
#> 
#>     filter, lag
#> The following objects are masked from 'package:base':
#> 
#>     intersect, setdiff, setequal, union

vega_data <- import_vega_data()

Binned Movie Rating Heatmap

Altair Example

Data

glimpse(vega_data$movies())
#> Observations: 3,201
#> Variables: 16
#> $ Creative_Type          <list> [NULL, NULL, NULL, NULL, "Contemporary F…
#> $ Director               <list> [NULL, NULL, NULL, NULL, NULL, NULL, "Ch…
#> $ Distributor            <list> ["Gramercy", "Strand", "Lionsgate", "Fin…
#> $ IMDB_Rating            <dbl> 6.1, 6.9, 6.8, NaN, 3.4, NaN, 7.7, 3.8, 5…
#> $ IMDB_Votes             <dbl> 1071, 207, 865, NaN, 165, NaN, 15133, 353…
#> $ MPAA_Rating            <list> ["R", "R", NULL, NULL, "R", NULL, "R", "…
#> $ Major_Genre            <list> [NULL, "Drama", "Comedy", "Comedy", "Dra…
#> $ Production_Budget      <dbl> 8000000, 300000, 250000, 300000, 1000000,…
#> $ Release_Date           <chr> "Jun 12 1998", "Aug 07 1998", "Aug 28 199…
#> $ Rotten_Tomatoes_Rating <dbl> NaN, NaN, NaN, 13, 62, NaN, NaN, NaN, 25,…
#> $ Running_Time_min       <dbl> NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, N…
#> $ Source                 <list> [NULL, NULL, NULL, NULL, "Original Scree…
#> $ Title                  <list> ["The Land Girls", "First Love, Last Rit…
#> $ US_DVD_Sales           <dbl> NaN, NaN, NaN, NaN, NaN, NaN, NaN, NaN, N…
#> $ US_Gross               <dbl> 146083, 10876, 203134, 373615, 1009819, 2…
#> $ Worldwide_Gross        <dbl> 146083, 10876, 203134, 373615, 1087521, 2…

Chart

chart <- 
  alt$Chart(vega_data$movies())$
  mark_rect()$
  encode(
    x = alt$X("IMDB_Rating:Q", bin = alt$Bin(maxbins = 60)),
    y = alt$Y("Rotten_Tomatoes_Rating:Q", bin=alt$Bin(maxbins = 40)),
    color = alt$Color(
      "count(IMDB_Rating):Q", 
      scale = alt$Scale(scheme = "greenblue")
    )
  )

chart

Facetted Scatterplot with marginal histograms

Altair Example

There is a slight difference from the Altair example in the yscale, to get everything to line-up correctly.

Data

glimpse(vega_data$iris())
#> Observations: 150
#> Variables: 5
#> $ petalLength <dbl> 1.4, 1.4, 1.3, 1.5, 1.4, 1.7, 1.4, 1.5, 1.4, 1.5, 1.…
#> $ petalWidth  <dbl> 0.2, 0.2, 0.2, 0.2, 0.2, 0.4, 0.3, 0.2, 0.2, 0.1, 0.…
#> $ sepalLength <dbl> 5.1, 4.9, 4.7, 4.6, 5.0, 5.4, 4.6, 5.0, 4.4, 4.9, 5.…
#> $ sepalWidth  <dbl> 3.5, 3.0, 3.2, 3.1, 3.6, 3.9, 3.4, 3.4, 2.9, 3.1, 3.…
#> $ species     <chr> "setosa", "setosa", "setosa", "setosa", "setosa", "s…

Chart

iris <- vega_data$iris()

xscale <- alt$Scale(domain = list(4.0, 8.0))
yscale <- alt$Scale(domain = list(1.8, 4.6))

blank_axis <- alt$Axis(title = "")

points <- 
  alt$Chart(iris)$
  mark_circle()$
  encode(
    alt$X("sepalLength", scale = xscale),
    alt$Y("sepalWidth", scale = yscale),
    color = "species"
  )

top_hist <-
  alt$Chart(iris)$
  mark_area(opacity = 0.3, interpolate = "step")$
  encode(
    x = alt$X("sepalLength:Q",
          # when using bins, the axis scale is set through
          # the bin extent, so we do not specify the scale here
          # (which would be ignored anyway)
          bin = alt$Bin(maxbins = 20, extent = xscale$domain),
          stack = NULL,
          axis = blank_axis
        ),
    y = alt$Y("count(sepalLength)", stack = NULL, axis = blank_axis),
    color = alt$Color("species:N")
  )$
  properties(height=60)

right_hist <- 
  alt$Chart(iris)$
  mark_area(opacity= 0.3, interpolate= "step")$
  encode(
    x = alt$X("count(sepalWidth)", stack=NULL, axis=blank_axis),
    y = alt$Y(
      "sepalWidth:Q",
      bin = alt$Bin(maxbins = 20, extent = yscale$domain),
      stack = NULL,
      axis = blank_axis
    ),
    color = alt$Color("species:N")
  )$
  properties(width=60)

chart <- (top_hist & (points | right_hist))

chart
#> This vegaspec has class `vegaspec_vconcat`, which implies multiple views. Specifying the width or height of a vegaspec with multiple views has no effect on rendering.

Layering text over a heatmap

Altair Example

Data

glimpse(vega_data$cars())
#> Observations: 406
#> Variables: 9
#> $ Acceleration     <dbl> 12.0, 11.5, 11.0, 12.0, 10.5, 10.0, 9.0, 8.5, 1…
#> $ Cylinders        <dbl> 8, 8, 8, 8, 8, 8, 8, 8, 8, 8, 4, 8, 8, 8, 8, 8,…
#> $ Displacement     <dbl> 307, 350, 318, 304, 302, 429, 454, 440, 455, 39…
#> $ Horsepower       <dbl> 130, 165, 150, 150, 140, 198, 220, 215, 225, 19…
#> $ Miles_per_Gallon <dbl> 18, 15, 18, 16, 17, 15, 14, 14, 14, 15, NaN, Na…
#> $ Name             <chr> "chevrolet chevelle malibu", "buick skylark 320…
#> $ Origin           <chr> "USA", "USA", "USA", "USA", "USA", "USA", "USA"…
#> $ Weight_in_lbs    <dbl> 3504, 3693, 3436, 3433, 3449, 4341, 4354, 4312,…
#> $ Year             <dttm> 1970-01-01, 1970-01-01, 1970-01-01, 1970-01-01…

Chart

cars <- vega_data$cars()

heatmap <- 
  alt$Chart(cars)$
  mark_rect()$
  encode(
    x = alt$X("Cylinders:O", scale = alt$Scale(paddingInner = 0)),
    y = alt$Y("Origin:O", scale = alt$Scale(paddingInner = 0)),
    color= "count(Cylinders)"
  )

text <- 
  alt$Chart(cars)$
  mark_text(baseline="middle")$
  encode(
    x = "Cylinders:O",
    y = "Origin:O",
    text = "count(Cylinders)",
    color = alt$condition(
      "datum['count_*'] > 100",
      alt$value("black"),
      alt$value("white")
    )
  )

chart <- (heatmap + text)

chart

Multiple Marks

Altair Example

Data

glimpse(vega_data$stocks())
#> Observations: 560
#> Variables: 3
#> $ symbol <chr> "MSFT", "MSFT", "MSFT", "MSFT", "MSFT", "MSFT", "MSFT", "…
#> $ date   <dttm> 2000-01-01, 2000-02-01, 2000-03-01, 2000-04-01, 2000-05-…
#> $ price  <dbl> 39.81, 36.35, 43.22, 28.37, 25.45, 32.54, 28.40, 28.40, 2…

Chart

stocks <- vega_data$stocks()

chart <- 
  alt$LayerChart(stocks)$
  encode(
    x = "date:T",
    y = "price:Q",
    color = "symbol:N"
  )$add_layers(
    alt$Chart()$mark_point(),
    alt$Chart()$mark_line()
  )

chart

Ranged Dot Plot

Altair Example

This example shows a ranged dot plot that uses layer to convey changing life expectancy for the five most populous countries (between 1955 and 2000).

Data

Cannot get the Vega-Lite data-layer to work.

Definition

data <- 
  vega_data$countries() %>%
  select(-`_comment`) %>%
  filter(
    country %in% c("China", "India", "United States", "Indonesia", "Brazil"),
    year %in% c(1955, 2000)
  ) 

glimpse(data)
#> Observations: 10
#> Variables: 8
#> $ country       <chr> "Brazil", "Brazil", "China", "China", "India", "In…
#> $ fertility     <dbl> 6.1501, 2.3450, 5.5900, 1.7000, 5.8961, 3.1132, 5.…
#> $ life_expect   <dbl> 53.28500, 71.00600, 50.54896, 72.02800, 40.24900, …
#> $ n_fertility   <dbl> 6.1501, NaN, 5.7200, NaN, 5.8216, NaN, 5.6200, NaN…
#> $ n_life_expect <dbl> 55.66500, NaN, 44.50136, NaN, 43.60500, NaN, 42.51…
#> $ p_fertility   <dbl> NaN, 2.4500, NaN, 1.7810, NaN, 3.4551, NaN, 2.5500…
#> $ p_life_expect <dbl> NaN, 69.388, NaN, 70.426, NaN, 61.765, NaN, 66.041…
#> $ year          <dbl> 1955, 2000, 1955, 2000, 1955, 2000, 1955, 2000, 19…

Chart

# Line between life expectancy in 1955 & 2000
chart_line <-
  alt$Chart(data = vega_data$countries$url)$
  mark_line(color = "#db646f")$
  encode(
    x = "life_expect:Q",
    y = "country:N",
    detail = "country:N"
  )

# Points for life expectancy in 1955 & 2000
chart_point <- 
  alt$Chart(data = vega_data$countries$url)$
  mark_point(size = 100, opacity = 1, filled = TRUE)$
  encode(
    x = "life_expect:Q",
    y = "country:N",
    color = alt$Color(
      "year:O",
      scale = alt$Scale(
        domain = list("1955", "2000"), 
        range = list("#e6959c", "#911a24")
      )
    )
  )$interactive()

# Compose charts, add data and transformations
chart <- 
  (chart_line + chart_point)$
  transform_filter(
    filter = list(
      field = "country",
      oneOf = list("China", "India", "United States", "Indonesia", "Brazil")
    )
  )$
  transform_filter(
    filter = list(field = "year", oneOf = list(1955, 2000))
  )
  
chart

Steam and Leaf Plot

Altair Example

Data

Definition

data <- 
  tibble(
    sample = rnorm(100, 50, 15) %>% round() %>% as.integer(),
    stem = (sample / 10L) %>% as.integer(),
    leaf = sample %% 10L
  ) %>%
  arrange(sample) %>%
  group_by(stem) %>%
  mutate(position = seq_along(leaf)) %>%
  ungroup()

glimpse(data)
#> Observations: 100
#> Variables: 4
#> $ sample   <int> 1, 15, 18, 19, 21, 21, 24, 25, 28, 30, 30, 31, 31, 32, …
#> $ stem     <int> 0, 1, 1, 1, 2, 2, 2, 2, 2, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3…
#> $ leaf     <int> 1, 5, 8, 9, 1, 1, 4, 5, 8, 0, 0, 1, 1, 2, 3, 3, 4, 4, 6…
#> $ position <int> 1, 1, 2, 3, 1, 2, 3, 4, 5, 1, 2, 3, 4, 5, 6, 7, 8, 9, 1…

Chart

chart <- 
  alt$Chart(data)$
  mark_text(align = "left", baseline = "middle", dx = -5)$
  encode(
    x = alt$X(
      "position:Q",
      axis = alt$Axis(title="", ticks = FALSE, labels = FALSE, grid = FALSE)
    ),
    y = alt$Y("stem:N", axis = alt$Axis(title = "", tickSize = 0)),
    text = "leaf:N"
  )$
  configure_axis(labelFontSize = 20)$
  configure_text(fontSize = 20)

chart

Trail Marker

Altair Example

The trail marker is like the line marker, but it allows properties of the line (such as thickness) to vary along the length of the line. This shows a simple example of the trail mark using stock prices.

Data

glimpse(vega_data$stocks())
#> Observations: 560
#> Variables: 3
#> $ symbol <chr> "MSFT", "MSFT", "MSFT", "MSFT", "MSFT", "MSFT", "MSFT", "…
#> $ date   <dttm> 2000-01-01, 2000-02-01, 2000-03-01, 2000-04-01, 2000-05-…
#> $ price  <dbl> 39.81, 36.35, 43.22, 28.37, 25.45, 32.54, 28.40, 28.40, 2…

Chart

chart <-
  alt$Chart(stocks)$
  mark_trail()$
  encode(
    x = "date:T",
    y = "price:Q",
    size = "price:Q",
    color = "symbol:N"
  )

chart