Skip to content


Mike Bostock edited this page Mar 6, 2020 · 1295 revisions
Clone this wiki locally


Please see the new D3 Gallery on Observable.

Many examples below are broken or use older versions of D3. We’re in the process of cleaning up this gallery, and writing new examples and tutorials. Thanks for your patience!

Welcome to the D3 gallery! More examples are available for forking on Observable; see D3’s profile and the visualization collection. Please share your work on Observable, or tweet us a link!

Visual Index

Box Plots
Bubble Chart
Bullet Charts
Calendar View
Non-contiguous Cartogram
Chord Diagram
Force-Directed Graph
Circle Packing
Population Pyramid
Stacked Bars
Node-Link Tree
Voronoi Diagram
Hierarchical Edge Bundling
Voronoi Diagram
Bubble Map
Parallel Coordinates
Scatterplot Matrix
Zoomable Pack Layout
Hierarchical Bars
Epicyclical Gears
Collision Detection
Collapsible Force Layout
Force-Directed States
Versor Dragging
Collapsible Tree Layout
Zoomable Treemap
Zoomable Icicle
Zoomable Area Chart
Drag and Drop Collapsible Tree Layout
Radial Cluster Layout
Sankey Diagram
Fisheye Distortion
Hive Plot
Co-occurrence Matrix
Motion Chart
Chord Diagram
Animated Béziers
Zoomable Sunburst
Collatz Graph
Parallel Sets
Word Cloud
Obama's Budget Proposal
Facebook IPO
US Trade Deficit
Sequences sunburst
NFL Predictions
Owls to the Max
Indented Tree
Rounded Rect
Euro Debt
Labeled Force Layout
Circle-Square Illusion
Voronoi Picking
Zoomable Map
Life Expectancy
Parallel Coordinates
NCAA Predictions
Wind History
Cubic Hamiltonian Graphs
Force-Directed Voronoi
Trulia Trends
Trulia Trends
Open Budget
Bederson Publications
Build Your Own Graph!
Force Layout Editor
Gene Expression
Concept network browser
Circular heat chart
Directed Graph Editor
Animated wind chart
What makes us happy?
Simple SOM Animation
Confusion Matrix
Binary tree with transitions
D3 JezzBall
Gantt Chart
Day/Hour Heatmap
Worldwide remittance flows
Language Network
Wimbledon 2013
Force directed tag/site explorer
Circos.js Airline data from Fusion Tables
Geographical hexbins
xkcd-style Comic Narrative Charts
GitHub Visualizer
WorldBank Contract Awards
Site or blog concept browser
Choropleth on canvas
Google calendar like visualization
Kagi Chart
Wikistalker - Wikipedia Visualization
Kent + Sussex river levels mapped
Interactive Bible contradictions & bar charts [source]
Force Edge Bundling For Graphs
[Source & Docs]
Bullet Charts
Arc Axis
Bar chart with tooltips
Tokyo Wind Map
Dependency Wheel
60 years of french first names
Hip Replacement by State
Compare time series with irregular interval
Table with Embedded Line Chart
Dual-scale Bar Chart
Animated Pie and Line Chart
Multivariate Data Exploration with Scatterplots
Live Power Outages In Maine
Relative Size Of The Planets
AWS EC2 Price Comparison Chart
Condegram Spiral Plot
Dot Matrix Chart
Reusable VIS Components(responsive)
Epidemic Game UK Temperature Graphs
Data Heatmap with Sorting Functions
3D Force Layout
Choropleth word map
word of the day
The Movie Network
Graceful Tree Conjecture
Top Scorers in 2013/14 Champions League - Breakdown analysis
Sankey: How a Georgia bill becomes law
A game based on d3
Viroscope - virus taxonomy viewer
Twitter & Reddit topics during week one of MH-370's disappearance
Elliptic Forces
Fund Visualization
Zoomable sunburst with updating data
US State Map
Simple Dashboard
Density and Quantile Graphs
Visualizing MBTA Data
Sum of First n Numbers
Animated Historical Weather Maps
Visualizing Walking with Smartphone Accelerometers
Cycloid Optical Illusion
Alternative Calendar View
US Choropleth Plus Bar Chart
Aster Plot
Smallest Convex Polygon
Sunburst for your skill map
Network of soccer passes
Choropleth with svg filter
Psychedelic British Isles
Days-Hours Heatmap
Trend Chart (Area + Line)
Node Focusable Tree
Tarot Card App made with D3 + Meteor framework
Ulam Spiral
Animated Chord Diagram
SOM Hexagonal Heatmap
Dataviz tree
UK Temperature 1910-2014
Simple Bubble Chart
Collapsible 2-Way Tree Layout
Exoplanets in Orbit
Worldcup'14 Drag & Drop Brackets
A Scatterplot as Bar chart
Conway's Game of Life
Editable tree mixing d3 & Angular
SFDC Training Videos
Editable Sankey with self-loops
England & Wales house price animation
Bi-directional Zoom and Drag D3 dependency tree
Interactive Force Directed Graph
Selectable / Zoomable / Centerable Force Directed Graph
F1 Timeline
Geocenter of F1 venues
Access Quandl aggregator
Religions in Romania on colorwheels
Sunburst bilevel partition with tooltips
Russian Budget: 1937 to 1950
Liquid Fill Gauge
Interactive Bubble Menu
Global center of higher education: university rankings
Linked Geographic and Tree Maps
Bi-directional Hierarchical Sankey
2 Interactive Colorwheels + Zoomable World Map
Radial Boxplot
Pazzla: Mosaics of Instagram Pictures
Pazzla: Mosaics of Instagram Pictures
Community Pop-Culture References Heatmap
Community Pop-Culture References Heatmap
Top baby names bump chart
Real time electric consumption in Spain
Electric consumption in Spain - latest 24h
Zoomable Unilevel Partition
Apps Script dependency analysis
Editable Tree
Automated Biography of a Nation
Star Wars Character Profiles
Global Refugee Flows - 2 Dynamic Chord Diagrams
Ontology Visualization

Vertical Sankey

Visualizing a genetic algorithm Rectangular Area Chart
Gaussian curve from random variable
UK Economy as a Network
Contouring Comparison

Force Directed Graph with search and subset view
A circular flow diagram (Sankey meets Chord diagram)
Re-usable Sankey
Compare Results with Waterfall Charts Small Multiple Circle Packing Nested Layouts

Radar Chart Redesign Volcano Plot with Voronoi Overlay Fitbit Bullet Charts What Kills Us
Cluster Purity Visualizer
Map with Latitude & Longitude
Higher education data explorer by parliamentary constituency
Clustergrammer: interactive clustergram/heatmap maker
Interactive Bar/line/scatter
Timeline Chart
Tree of Life
Change points in social networks
NFL and NBA Team Skills
Galaxy Chart
Configurable circular timer
Clock built with Configurable circular timer
traversable pie menu
Relationship Graph
Time Data Availability
University Program Transfers - Interactive
Sankey + Leaflet: Map of Migration in the 2014 Maldives Census
BiPartite Viz
Gauge Viz
Chord Viz
Bosnia and Herzegovina 2013 Census Visualization
3D Torus with Force Layout
3D Honeycomb Bar Chart
3D Bar Chart
Chord Viz
Russian State Duma
Visualization of Russian State Duma structure
Circular visualization of integer sequences from OEIS
Circular visualization of integer sequences from OEIS
Curve Comparison Tool
Useful tool for looking at the different curves offered by D3 v4.
Flight Visualization
Flight Visualization By D3 v4.x and Leaflet
D3.js v4.x Modules
D3.js v4.x Modules
Calendar View (v4, Commented)
Interactive Bubble Chart
US H1b Worker Salaries
H1b Salaries visualization with D3 v4
Correlation Matrix
Map and context with brushing
Bertifier - to visually encode and reorder data
Font co-usage Force-directed graph (v4)
Open Knowledge Festival
Motion Capture Data
Spot Matrix Chart
Tally Chart
share your mindmap
Higher education equality data explorer
Higher education equality entry rates data explorer
Interactive bubble chart combining Circle Pack and Force Layout
Interactive Force Directed Graph in D3v4
Grid systems for D3 charts mock-ups
Parabola Multiplication
Nonogram Game
Spinning Pie Chart
Deep Learning Snake Game
Ball of string
Force Directed Graph Labeled
Federal Contractors Sunburst with Panel and Icons
Government Spending Sankey with Panel
Fisheye Navigation and viewing for Google Sheets
Federal Accounts Dendrogram

Basic Charts

Area Chart
Line Chart
Bivariate Area Chart
Multi-Series Line Chart
Stacked Area Chart
Bar Chart
Stacked Bar Chart
Normalized Stacked Bar Chart
Grouped Bar Chart
Donut Chart
Pie Chart
Donut Multiples
Bar Chart with Negative Values
Animated Donut Chart with Labels
Stacked Bar Charts on time scale
Bar Chart Multiples
d3pie - pie chart generator and lib
3D Donut
Gradient Pie
Waterfall Chart
Diverging Stacked Bar Chart
World Map with heat color Example
Twitter stream geographical visualization
Dendrogram + Grouped Bar
Multiseries Floating Bar Chart
Interactive Gantt Chart
Scree Plot
Largest rectangle in histogram

Techniques, Interaction & Animation

General Update Pattern
Sortable Bar Chart
van Wijk Smooth Zooming
Progress Events
Margin Convention
Focus+Context via Brushing
Difference Chart
Pie Chart Update
Hexagonal Binning
Contour Plot
Build Your Own Graph
Modifying a Force Layout
Spline Interpolation
Dispatching Events
Better force layout selection
v45 web theme using SVG
Interactive force layout
EventDrops: Zoomable time series
Draggable scatterplot with motion trails
Horizontally grouped bar chart
Band Zoom
Item explorer
Image Map
Voronoi diagram second level
Firework ~ Night
DNA Electrophoresis Simulator
Atoms,Molecules and Chemistry
Interactive Bar Chart


US States
US States with Dropdown Selector
US States - Choropleth Bar
US States Map - Side by Side
UK Election choropleth
World rivers


Uniform distribution
Normal distribution
Linear regression



The New York Times visualizations

Jerome Cukier

Jason Davies

Jim Vallandingham

Institute for Health Metrics and Evaluation

Peter Cook

Charts and Chart Components

Bar Chart


Pareto Chart

Line and Area Chart

Pie Chart

Scatterplot and Bubble chart

Parallel Coordinates, Parallel sets and Sankey

Sunburst and Partition layout

Force Layout


Misc Trees and Graphs

Chord Layout (Circular Network)


Misc Charts

Miscellaneous visualizations

Charts using the reusable API

Useful snippets



Online Editors


Store Apps



Wish List

  • arc diagram
  • gantt chart, other timelines, and timing diagram
  • fibonacci scale
  • data table (maybe the airline table at the bottom of the crossfilter example?)
  • hypergraph