Simple Charts

Haley Jeppson

2023-09-04

Source: vignettes/example-gallery-01-simple.Rmd

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

Our first step is to set up our environment:

Simple Bar Chart

Altair example

Data

Definition 
data <-  
  tibble(
    a= c("A", "B", "C", "D", "E", "F", "G", "H", "I"),
    b =c(28, 55, 43, 91, 81, 53, 19, 87, 52)
  )
glimpse(data)
#> Rows: 9
#> Columns: 2
#> $ a <chr> "A", "B", "C", "D", "E", "F", "G", "H", "I"
#> $ b <dbl> 28, 55, 43, 91, 81, 53, 19, 87, 52

Chart 

chart <- 
  alt$Chart(data)$
  mark_bar()$
  encode(
    x = "a",
    y = "b"
  )

chart

Simple Heatmap

Altair example

Data

Definition 
# Compute x^2 + y^2 across a 2D grid
data <- 
  crossing(x = seq(-5, 5), y = seq(-5, 5)) %>%
  mutate(z = x^2 + y^2)
glimpse(data)
#> Rows: 121
#> Columns: 3
#> $ x <int> -5, -5, -5, -5, -5, -5, -5, -5, -5, -5, -5, -4, -4, -4, -4, -4, -4, …
#> $ y <int> -5, -4, -3, -2, -1, 0, 1, 2, 3, 4, 5, -5, -4, -3, -2, -1, 0, 1, 2, 3…
#> $ z <dbl> 50, 41, 34, 29, 26, 25, 26, 29, 34, 41, 50, 41, 32, 25, 20, 17, 16, …

Chart 

chart <- 
  alt$Chart(data)$
  mark_rect()$
  encode(
    x = "x:O",
    y = "y:O",
    color = "z:Q"
  )

chart

Simple Histogram

Altair example

This example shows how to make a basic histogram, based on the vega-lite docs.

Data 

movies <- jsonlite::fromJSON("https://vega.github.io/vega-datasets/data/movies.json")
glimpse(movies)
#> Rows: 3,201
#> Columns: 16
#> $ Title                    <chr> "The Land Girls", "First Love, Last Rites", "…
#> $ `US Gross`               <int> 146083, 10876, 203134, 373615, 1009819, 24551…
#> $ `Worldwide Gross`        <dbl> 146083, 10876, 203134, 373615, 1087521, 26245…
#> $ `US DVD Sales`           <int> NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, N…
#> $ `Production Budget`      <int> 8000000, 300000, 250000, 300000, 1000000, 160…
#> $ `Release Date`           <chr> "Jun 12 1998", "Aug 07 1998", "Aug 28 1998", …
#> $ `MPAA Rating`            <chr> "R", "R", NA, NA, "R", NA, "R", "R", "R", NA,…
#> $ `Running Time min`       <int> NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, N…
#> $ Distributor              <chr> "Gramercy", "Strand", "Lionsgate", "Fine Line…
#> $ Source                   <chr> NA, NA, NA, NA, "Original Screenplay", NA, NA…
#> $ `Major Genre`            <chr> NA, "Drama", "Comedy", "Comedy", "Drama", NA,…
#> $ `Creative Type`          <chr> NA, NA, NA, NA, "Contemporary Fiction", NA, N…
#> $ Director                 <chr> NA, NA, NA, NA, NA, NA, "Christopher Nolan", …
#> $ `Rotten Tomatoes Rating` <int> NA, NA, NA, 13, 62, NA, NA, NA, 25, 86, 81, 8…
#> $ `IMDB Rating`            <dbl> 6.1, 6.9, 6.8, NA, 3.4, NA, 7.7, 3.8, 5.8, 7.…
#> $ `IMDB Votes`             <int> 1071, 207, 865, NA, 165, NA, 15133, 353, 3275…

Chart 

chart <- 
  alt$Chart(movies)$
  mark_bar()$
  encode(
    alt$X("IMDB Rating:Q", bin = TRUE), 
    y = "count()"
  )

chart

Simple Line Chart

Altair example

Data

Definition 
data <- 
  tibble(
    x = 0:100,
    sinx = sin(x / 5)
  ) 
glimpse(data)
#> Rows: 101
#> Columns: 2
#> $ x    <int> 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18,…
#> $ sinx <dbl> 0.00000000, 0.19866933, 0.38941834, 0.56464247, 0.71735609, 0.841…

Chart 

chart <- 
  alt$Chart(data)$
  mark_line()$
  encode(
    x = "x",
    y = "sinx"
  )

chart

Simple Scatter Plot

Altair example

Data 

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

Chart 

chart <- 
  alt$Chart(vega_data$cars())$
  mark_circle()$
  encode(
    x = "Horsepower",
    y = "Miles_per_Gallon",
    color = "Origin",
    tooltip = c("Name", "Horsepower", "Miles_per_Gallon", "Origin")
  )$
  interactive()

chart

Simple Stacked Area Chart

Altair example

Data 

glimpse(vega_data$iowa_electricity())
#> Rows: 51
#> Columns: 3
#> $ year           <dttm> 2001-01-01, 2002-01-01, 2003-01-01, 2004-01-01, 2005-0…
#> $ source         <chr> "Fossil Fuels", "Fossil Fuels", "Fossil Fuels", "Fossil…
#> $ net_generation <dbl> 35361, 35991, 36234, 36205, 36883, 37014, 41389, 42734,…

Chart 

chart <- 
  alt$Chart(vega_data$iowa_electricity())$
  mark_area()$
  encode(
    x = "year:T",
    y = "net_generation:Q",
    color = "source:N"
  )

chart

Strip Plot

Altair example

Data 

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

Chart 

chart <- 
  alt$Chart(vega_data$cars())$
  mark_tick()$
  encode(
    x = "Horsepower:Q",
    y = "Cylinders:O"
  )

chart