This website is for Vega-Lite v3. Go to the main Vega-Lite homepage for the latest release.

Example Gallery

This page shows example specifications for different types of graphics. To see example code for embedding visualizations in a webpage, please read the embed documentation.

Single-View Plots

Bar Charts & Histograms

Simple Bar Chart Aggregate Bar Chart Aggregate Bar Chart (Sorted) Histogram Histogram (from Binned Data) Log-scaled Histogram Grouped Bar Chart Stacked Bar Chart Horizontal Stacked Bar Chart Normalized (Percentage) Stacked Bar Chart Gantt Chart (Ranged Bar Marks) A bar chart encoding color names in the data Layered Bar Chart Diverging Stacked Bar Chart (Population Pyramid) Diverging Stacked Bar Chart (with Neutral Parts) Simple Bar Chart with Labels Wilkinson Dot Plot Isotype Bar Chart Isotype Bar Chart with Emoji

Scatter & Strip Plots

Scatterplot Dot Plot Strip Plot Colored Scatterplot Binned Scatterplot Bubble Plot Scatterplot with Null Values in Grey Scatterplot with Filled Circles Bubble Plot (Gapminder) Bubble Plot (Natural Disasters) Scatter Plot with Text Marks

Line Charts

Line Chart Line Chart with Point Markers Line Chart with Stroked Point Markers Multi Series Line Chart Slope Graph Step Chart Line Chart with Monotone Interpolation Connected Scatterplot (Lines with Custom Paths) Line Chart with Varying Size (using the trail mark) Line Chart with Markers and Invalid Values Carbon Dioxide in the Atmosphere Line Charts Showing Ranks Over Time Drawing Sine and Cosine Curves with the Sequence Generator

Area Charts & Streamgraphs

Area Chart Area Chart with Overlaying Lines and Point Markers Stacked Area Chart Normalized Stacked Area Chart Streamgraph Horizon Graph Mosaic Chart with Labels

Table-based Plots

Table Heatmap Annual Weather Heatmap Table Binned heatmap Table Bubble Plot (Github Punch Card) Layering text over heatmap

Advanced Calculations

Calculate Percentage of Total Calculate Difference from Average Calculate Difference from Annual Average Calculate Residuals Line Charts Showing Ranks Over Time Waterfall Chart of Monthly Profit and Loss Filtering top-K items Top-K plot with Others Using the lookup transform to combine data Cumulative Frequency Distribution Layered Histogram and Cumulative Histogram Parallel Coordinate Plot Bar Chart showing Argmax Value

Composite Mark

Error Bars & Error Bands

Error Bars showing Confidence Interval Error Bars showing Standard Deviation Line Chart with Confidence Interval Band Scatterplot with Mean and Standard Deviation Overlay

Box Plots

Box Plot with Min/Max Whiskers Tukey Box Plot (1.5 IQR)

Layered Plots

Labeling & Annotation

Simple Bar Chart with Labels Layering text over heatmap Carbon Dioxide in the Atmosphere Bar chart that highlights values beyond a threshold Mean overlay over precipitation chart Histogram with a Global Mean Overlay Line Chart with Highlighted Rectangles Layering mean values over raw values Layering rolling mean values over raw values Likert Scale Ratings Distributions and Medians

Other Layered Plots

Candlestick Chart Ranged Dot Plot Bullet Chart Layered Plot with Dual-Axis Horizon Graph Weekly Weather Plot Wheat and Wages Example

Multi-View Displays

Faceting (Trellis Plot / Small Multiples)

Trellis Bar Chart Trellis Stacked Bar Chart Trellis Scatter Plot Trellis Histograms Trellis Scatter Plot showing Anscombe’s Quartet Becker’s Barley Trellis Plot Trellis Area

Repeat & Concatenation

Repeat and layer to show different weather measures Vertically concatenated charts that show precipitation in Seattle Horizontally repeated charts Interactive Scatterplot Matrix Marginal Histograms Discretizing scales Nested View Concatenation Aligned with Axis minExtent Population Pyramid

Maps (Geographic Displays)

Choropleth of unemployment rate per county One dot per zipcode in the U.S One dot per airport in the US overlayed on geoshape Rules (line segments) connecting SEA to every airport reachable via direct flight Three choropleths representing disjoint data from the same table U.S. state capitals overlayed on a map of the U.S Line drawn between airports in the U.S. simulating a flight itinerary Income in the U.S. by state, faceted over income brackets London Tube Lines

Interactive

Interactive Charts

Bar chart with highlighting on hover and selection on click Scatterplot with External Links and Tooltips Rectangular Brush Area Chart with Rectangular Brush Paintbrush Highlight Scatterplot Pan & Zoom Query Widgets Interactive Average Multi Series Line Chart with Labels Multi Series Line Chart with Tooltip Isotype Grid Brushing Scatter Plot to show data on a table Selectable Heatmap Bar chart with a minimap

Interactive Multi-View Displays

Overview and Detail Crossfilter Interactive Scatterplot Matrix Interactive Dashboard with Cross Highlight Seattle Weather Exploration Connections among major U.S. airports.

Community Examples

Here we list great examples of Vega-Lite visualizations that were created by the community. Please help us expand this gallery by forking our example block and sending us a pull request with your example added to this list.