# 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
- Composite Marks
- Layered Plots
- Multi-View Displays
- Maps (Geographic Displays)
- Interactive
- Community Examples

## Single-View Plots

### Bar Charts

Simple Bar Chart Responsive Bar Chart Aggregate Bar Chart Aggregate Bar Chart (Sorted) Grouped Bar Chart Grouped Bar Chart (Multiple Measure with Repeat) Stacked Bar Chart Stacked Bar Chart with Rounded Corners Horizontal Stacked Bar Chart Normalized (Percentage) Stacked Bar Chart Normalized (Percentage) Stacked Bar Chart With Labels 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) Bar Chart with Labels Bar Chart with Label Overlays Bar Chart showing Initials of Month Names Bar Chart with bars center-aligned with time unit ticks Bar Chart with Negative Values and a Zero-Baseline Horizontal Bar Chart with Negative Values and Labels Bar Chart with a Spacing-Saving Y-Axis Heat Lane Chart

### Histograms, Density Plots, and Dot Plots

Histogram Histogram (from Binned Data) Log-scaled Histogram Non-linear Histogram Relative Frequency Histogram Density Plot Stacked Density Estimates 2D Histogram Scatterplot 2D Histogram Heatmap Cumulative Frequency Distribution Layered Histogram and Cumulative Histogram Wilkinson Dot Plot Isotype Dot Plot Isotype Dot Plot with Emoji Relative Bar Chart (Calculate Percentage of Total)

### Scatter & Strip Plots

Scatterplot 1D Strip Plot Strip Plot Colored Scatterplot 2D Histogram 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 Image-based Scatter Plot Strip plot with custom axis tick labels Dot Plot with Jittering

### Line Charts

Line Chart Line Chart with Point Markers Line Chart with Stroked Point Markers Multi Series Line Chart Multi Series Line Chart with Repeat Operator Multi Series Line Chart with Halo Stroke Slope Graph Step Chart Line Chart with Monotone Interpolation Line Chart with Conditional Axis Properties Connected Scatterplot (Lines with Custom Paths) Bump Chart Line Chart with Varying Size (using the trail mark) A comet chart showing changes between between two states 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 Line chart with varying stroke dash Line chart with a dashed part

### Area Charts & Streamgraphs

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

### Table-based Plots

Table Heatmap Annual Weather Heatmap 2D Histogram Heatmap Table Bubble Plot (Github Punch Card) Heatmap with Labels Lasagna Plot (Dense Time-Series Heatmap) Mosaic Chart with Labels Wind Vector Map

### Circular Plots

Pie Chart Pie Chart with percentage_tooltip Donut Chart Pie Chart with Labels Radial Plot Pyramid Pie Chart

### Advanced Calculations

Relative Bar Chart (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 Layering Averages over Raw Values Layering Rolling Averages over Raw Values Line Chart to Show Benchmarking Results Quantile-Quantile Plot (QQ Plot) Linear Regression Loess Regression

## Composite Marks

### 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) Box Plot with Pre-Calculated Summaries

## Layered Plots

### Labeling & Annotation

Simple Bar Chart with Labels Simple Bar Chart with Labels and Emojis Layering text over heatmap Carbon Dioxide in the Atmosphere Bar Chart Highlighting Values beyond a Threshold Mean overlay over precipitation chart Histogram with a Global Mean Overlay Line Chart with Highlighted Rectangles Layering Averages over Raw Values Layering Rolling Averages over Raw Values Distributions and Medians of Likert Scale Ratings Comparative Likert Scale Ratings

### 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 (wrapped) Trellis Histograms Trellis Scatter Plot Showing Anscombe’s Quartet Becker’s Barley Trellis Plot Trellis Area Trellis Area Plot Showing Annual Temperatures in Seattle Faceted Density Plot Compact Trellis Grid of Bar Charts

### Repeat & Concatenation

Repeat and Layer to Show Different Movie Measures
Vertical Concatenation
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 U.S. Overlayed on Geoshape Rules (line segments) Connecting SEA to every Airport Reachable via Direct Flights Three Choropleths Representing Disjoint Data from the Same Table U.S. State Capitals Overlayed on a Map of U.S. Line between Airports in the U.S. Income in the U.S. by State, Faceted over Income Brackets London Tube Lines Projection explorer Earthquakes Example

## Interactive

### Interactive Charts

Bar Chart with Highlighting on Hover and Selection on Click Histogram with Full-Height Hover Targets for Tooltip Interactive Legend 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 an Interactive Line Highlight Multi Series Line Chart with an Interactive Point Highlight Multi Series Line Chart with Labels Multi Series Line Chart with Tooltip 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 Index Chart Focus + Context - Smooth Histogram Zooming Dynamic Color Legend Search Input Change zorder on hover

### Interactive Multi-View Displays

Overview and Detail Crossfilter (Filter) Crossfilter (Highlight) Interactive Scatterplot Matrix Interactive Dashboard with Cross Highlight Seattle Weather Exploration Connections among Major U.S. Airports. An interactive scatter plot of global health statistics by country and year.

## 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.

- Many visualizations in the book Making Data Visual by Danyel Fisher and Miriah Meyer are made with Vega-Lite
- Grouped Bar Chart by @churtado
- Bar Chart with Negative Values by @digi0ps
- Multi Line Highlight by @amitkaps
- Slope graph by @g3o2
- Scatter Nearest Rule by @amitkaps
- Scatter Brush Rule by @amitkaps
- Unit Chart Rectangular by @amitkaps
- Unit Chart Stacked by @amitkaps
- Unit Chart Small Multiple by @amitkaps
- Dot-dash plot by @g3o2
- Cumulative Wikipedia Donations by @domoritz
- CO2 Concentration in the Atmosphere by @domoritz
- Horizontal Stacked Bar Chart with Labels by @pratapvardhan
- Interactive stacked time-series by @jakevdp
- Bicycle Count Time-series with Dynamic Scale by @jakevdp
- Vega-Lite downloads by @domoritz
- Waterfall Chart by @italo-batista
- Bar, Small Multiple, Heatmap, Gantt Charts: Exploring NYC Event Permits by @hydrosquall
- Image Pixel Render by @amitkaps
- Top-K Plot with Others by @manzt
- Trafford Data Lab’s Vega-Lite graphics companion by @trafforddatalab
- International Flight Map by @alhenry
- BBC Visual and Data Journalism cookbook port to Vega-Lite by @aezarebski
- Car Registrations in Portugal - 3 plots with cross-filtering by @jlborges
- An interactive Rank-Plot by @jlborges
- An interactive Dashboard by @jlborges
- Dashboard for the Effects of Labor Market Subsidies in Austria by @schmoigl
- Size of People around the World by @schmoigl