Altair Data Visualization

An interactive demonstration of Altair, a declarative statistical visualization library for Python. The examples below show the simple Python code and the powerful, interactive charts it produces.

What is Altair?

Altair is a Python library that allows you to create a wide range of statistical visualizations with a simple, declarative syntax. Instead of writing code to draw lines and points, you declare mappings from data columns to visual properties (encodings) like the x-axis, y-axis, color, and size.

Key Concepts:

  • The Data: Usually a Pandas DataFrame.
  • The Mark: The geometric object to draw (e.g., a point, bar, or line). You set this with .mark_point(), .mark_bar(), etc.
  • The Encoding: The mapping between data and visual properties, defined using .encode(). For example, alt.X('Horsepower') maps the 'Horsepower' data column to the x-axis.

Altair takes your Python code and compiles it into a JSON object based on the Vega-Lite specification. This JSON is then rendered by the Vega-Embed JavaScript library into an interactive SVG chart.

Python Code (Altair)

import altair as alt
from vega_datasets import data

source = data.cars()

chart = alt.Chart(source).mark_point().encode(
    x='Horsepower',
    y='Miles_per_Gallon',
    color='Origin',
    tooltip=['Name', 'Origin', 'Horsepower']
).interactive()

# chart.to_json() -> generates the spec

Interactive Chart

Hover over points for a tooltip. Click and drag to pan, scroll to zoom.

Python Code (Altair)

import altair as alt
from vega_datasets import data

source = data.cars()

chart = alt.Chart(source).mark_bar().encode(
    x='Origin',
    y='average(Miles_per_Gallon)',
    color='Origin',
    tooltip=['Origin', 'average(Miles_per_Gallon)']
)

Interactive Chart

Altair automatically computes the average for the y-encoding. Hover over bars for details.

Python Code (Altair)

import altair as alt
from vega_datasets import data

source = data.cars()

# Define an interval selection
brush = alt.selection_interval()

# Base chart
base = alt.Chart(source).mark_point().encode(
    y='Miles_per_Gallon',
    color=alt.condition(brush, 'Origin', alt.value('lightgray'))
).add_selection(
    brush
)

# Scatter plot
points = base.encode(x='Horsepower')

# Histogram
bars = base.encode(
    x='count()',
    y=alt.Y('Origin')
).transform_filter(
    brush
)

# Combine the charts
chart = points & bars

Interactive Linked Charts (Brushing & Linking)

Click and drag on the top chart to select a region. The bottom chart will update to show a histogram of only the selected points.

Scroll to Top