knitr::opts_chunk$set(
  collapse = TRUE,
  comment = "#>"
)

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

Our first step is to set up our environment:

library("altair")
library("tibble")
library("jsonlite")

vega_data <- import_vega_data()

Horizon Graph

Altair example

This shows how a Horizon Graph with two layers. See this reference for more details on Horizon Graphs.

Data

Definition

data <- fromJSON('[
  {"x": 1,  "y": 28}, {"x": 2,  "y": 55},
  {"x": 3,  "y": 43}, {"x": 4,  "y": 91},
  {"x": 5,  "y": 81}, {"x": 6,  "y": 53},
  {"x": 7,  "y": 19}, {"x": 8,  "y": 87},
  {"x": 9,  "y": 52}, {"x": 10, "y": 48},
  {"x": 11, "y": 24}, {"x": 12, "y": 49},
  {"x": 13, "y": 87}, {"x": 14, "y": 66},
  {"x": 15, "y": 17}, {"x": 16, "y": 27},
  {"x": 17, "y": 68}, {"x": 18, "y": 16},
  {"x": 19, "y": 49}, {"x": 20, "y": 15}
]')

glimpse(data)

Chart

area1 <- 
  alt$Chart(data)$
  mark_area(clip = TRUE, interpolate = "monotone")$
  encode(
    x = alt$X("x", scale = alt$Scale(zero = FALSE, nice = FALSE)),
    y = alt$Y(
      "y", 
      scale = alt$Scale(domain = list(0, 50)), 
      axis = alt$Axis(title = "y")
    ),
    opacity = alt$value(0.6)
  )$
  properties(
    width = 500,
    height = 75
  )

area2 <- 
  area1$
  encode(
    y = alt$Y("ny:Q", scale=alt$Scale(domain=list(0, 50)))
  )$
  transform_calculate("ny", "datum.y - 50")

chart <- (area1 + area2)

chart

Interval Selection Example

Altair example

This is an example of creating a stacked chart for which the domain of the top chart can be selected by interacting with the bottom chart.

Data

glimpse(vega_data$sp500())

Chart

brush <- alt$selection_interval(encodings = list("x"))

base <- 
  alt$
  Chart(vega_data$sp500$url, width=600, height=200)$
  mark_area()$
  encode(
    x = "date:T",
    y = "price:Q"
  )

upper <- 
  base$
  encode(
    alt$X('date:T')$scale(domain = brush)
  )

lower <- 
  base$
  properties(
    height=60
  )$
  add_params(brush)

chart <- alt$vconcat(upper, lower)

chart

Layered Area Chart

Altair example

Data

glimpse(vega_data$iowa_electricity())

Chart

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

chart

Normalized Stacked Area Chart

Altair example

Data

glimpse(vega_data$iowa_electricity())

Chart

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

chart

Streamgraph

Altair example

Data

glimpse(vega_data$unemployment_across_industries())

Chart

chart <- 
  alt$Chart(vega_data$unemployment_across_industries$url)$
  mark_area()$
  encode(
    x = alt$X(
      "date:T",
      timeUnit = "yearmonth",
      axis = alt$Axis(format = "%Y", domain = FALSE, tickSize = 0)
    ),
    y = alt$Y("sum(count):Q", stack = "center", axis = NULL),
    color = alt$Color("series:N", scale = alt$Scale(scheme = "category20b"))
  )$
  interactive()

chart

Trellis Area Chart

Altair example

Data

source <- vega_data$iowa_electricity()

glimpse(source)

Chart

chart <- 
  alt$Chart(source)$
  mark_area()$
  encode(
    x = "year:T",
    y = "net_generation:Q",
    color = "source:N",
    row = "source:N"
  )$
  properties(
    height = 100
  )

chart

Trellis Area Sort Chart

Altair example

Data

source <- vega_data$stocks()

glimpse(source)

Chart

chart <- 
  alt$Chart(source)$
  transform_filter("datum.symbol != 'GOOG'")$
  mark_area()$
  encode(
    x = "date:T", 
    y = "price:Q",
    color = "symbol:N",
    row = alt$Row("symbol:N", sort = c('MSFT', 'AAPL', 'IBM', 'AMZN')
    )
  )$
  properties(
    width = 400,
    height = 50
  )

chart


vegawidget/altair documentation built on Feb. 3, 2024, 7:47 p.m.