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

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

Our first step is to set up our environment:

library("altair")
library("tibble")
library("jsonlite")
library("dplyr")
library("readr")

vega_data <- import_vega_data()

Filled step chart

Altair example

Data

glimpse(vega_data$stocks())

Chart

chart <- 
  alt$Chart(vega_data$stocks())$
  mark_area(
    color = "lightblue",
    interpolate = "step-after",
    line = TRUE
  )$
  encode(
    x = "date",
    y = "price"
  )$
  transform_filter("datum.symbol == 'GOOG'")

chart

Line chart with Confidence Interval Band

Altair example

This example shows how to make a line chart with a bootstrapped 95% confidence interval band.

Data

glimpse(vega_data$cars())

Chart

cars <- vega_data$cars()

line <- 
  alt$Chart(cars)$
  mark_line()$
  encode(
    x = "Year",
    y = "mean(Miles_per_Gallon)"
  )

confidence_interval <- 
  alt$Chart(cars)$
  mark_area(opacity = 0.3)$
  encode(
    x = "Year",
    y = alt$Y(
      "ci0(Miles_per_Gallon)", 
      axis = alt$Axis(title = "Miles/Gallon")
    ),
    y2 = "ci1(Miles_per_Gallon)"
  )

chart <- (confidence_interval + line)

chart

Line Chart with Layered Aggregates

Altair example

This example shows how to make a multi series line chart of the daily closing stock prices for AAPL, AMZN, GOOG, IBM, and MSFT between 2000 and 2010, along with a layered rule showing the average values.

Data

glimpse(vega_data$stocks())

Chart

stocks <- vega_data$stocks()

base <- 
  alt$Chart(stocks)$
  properties(
    width = 550,
    title = "Daily closing prices with their aggregate prices"
  )

line <- 
  base$
  mark_line()$
  encode(
    x = "date",
    y = "price",
    color = "symbol"
  )

rule <- 
  base$
  mark_rule()$
  encode(
    y = alt$Y("average(price)"),
    color = "symbol",
    size = alt$value(2)
  )

chart <- (line + rule)

chart

Line Chart with Percent axis

Altair example

Data

jobs <- jsonlite::fromJSON(vega_data$jobs$url)

glimpse(jobs)

Chart

chart <- 
  alt$Chart(vega_data$jobs$url)$
  mark_line()$
  encode(
    x = "year:O",
    y = alt$Y("perc:Q", axis = alt$Axis(format = "%")),
    color = "sex:N"
  )$
  properties(title = "Percent of work-force working as Welders")$
  transform_filter("datum.job == 'Welder'")

chart

Line Chart with Points

Altair example

Data

source <- tibble(
  x = 1:100,
  `f(x)` = sin(x/5)
)

glimpse(source)

Chart

chart <- 
  alt$Chart(source)$
  mark_line(point = TRUE)$
  encode(
    x = "x",
    y = "f(x)"
  )

chart

Line Chart with Varying Size

Altair example

Data

glimpse(vega_data$wheat())

Chart

chart <- 
  alt$Chart(vega_data$wheat())$
  mark_trail()$
  encode(
    x = "year:T",
    y = "wheat:Q",
    size = "wheat:Q"
  )

chart

Multi Series Line Chart

Altair example

Data

glimpse(vega_data$stocks())

Chart

A difference from the Python example is that you have to make sure that you declare that the date variable is of type "temporal"

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

chart

Slope Graph

Altair example

Data

The year here is stored by pandas as an integer. When treating columns as dates, it is best to use either a string representation or a datetime representation.

barley <- vega_data$barley()
barley$year <- as.character(barley$year)

glimpse(barley)

Chart

chart <- 
  alt$Chart(barley)$
  mark_line()$
  encode(
    x = "year",
    y = "median(yield)",
    color = "site"
  )

chart

Step Chart

Altair example

This example shows Google's stock price over time. This uses the step-after interpolation scheme. The full list of interpolation options includes linear, linear-closed, step, step-before, step-after, basis, basis-open, basis-closed, cardinal, cardinal-open, cardinal-closed, bundle, and monotone.

Data

glimpse(vega_data$stocks())

Chart

chart <- 
  alt$Chart(vega_data$stocks())$
  mark_line(interpolate = "step-after")$
  encode(
    x = "date",
    y = "price"
  )$
  transform_filter(JS("datum.symbol == 'GOOG'"))

chart


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