All examples By author By category About


Bullet Charts

Calendar View

New York Population Density

Google Maps + D3

Hierarchical Edge Bundling

Collision Detection

Multi-Series Line Chart

Grouped Bar Chart

Voronoi Tessellation

Collapsible Tree

OPHZ Zooming

Rotating Transverse Mercator

Chord Diagram

Force-Directed Graph

Zoomable Sunburst

Line Transition

Difference Chart

U.S. States TopoJSON

Hexagon Mesh

Zoomable Circle Packing

Collapsible Indented Tree

Epicyclic Gearing

Zoomable Geography


Bubble Chart

Radial Tidy Tree

World Tour

Waterman Butterfly

Map Zooming

Multi-Line Voronoi

Labeled Force Layout

Collapsible Force Layout

Polar Clock

Hierarchical Bar Chart

Geodesic Rainbow

Winkel Tripel

van Wijk Smooth Zooming

Stacked Bar Chart

Sunburst Partition

Cluster Dendrogram

Scatterplot Matrix Brushing

Gradient Along Stroke

Tidy Tree

Projected Choropleth

Hierarchical Edge Bundling

Modifying a Force Layout

D3 Show Reel

Automatic Text Sizing

Stacked Area via Nest

Stacked Area Chart

Stacked-to-Grouped Bars


Population Pyramid

Chord Diagram

Circle Packing

World Map


Brush Handles

Every ColorBrewer Scale

Vector Tiles

Bilevel Partition

Wrapping Long Labels

Voronoi Arc Map

Spiral Circle

Spiral Triangle III

Time of Day

Brush & Zoom

Stacked Bar Chart

Mobile Patent Suits

Pie Chart Update, II

click-to-zoom via transform

Equirectangular (Plate Carrée)

Satellite Projection

Bar Chart

Pie Chart

Box Plots

Zoomable Map Tiles

Radial Cluster Dendrogram

Closest Point on Path

County Bubbles

Percentage Change II

Zoomable Icicle

Multi-Foci Force Layout

OMG Particles!


mousewheel-zoom + click-to-center

Stacked Radial Area

Threshold Choropleth

Projection Transitions


Area Chart

Line Chart


Zoomable Area


U.S. Counties TopoJSON

Bivariate Hexbin Map

U.S. Airports Voronoi

Solar Terminator

Zoom to Bounding Box

Marey’s Trains

Vector Tiles

Dispatching Events

Page Swiping

Small Multiples II

OMG Particles II

Perspective Transformation

Tree of Life

Wilson’s Algorithm II

Build Your Own Graph!

Random Tree

Superformula Explorer

Multi-Foci Force Layout

Force-Directed Symbols

Force-Directed States of America

Chained Transitions

Rounded Rectangles

Axis Component

DOM-to-Canvas using D3

The Euro Debt Crisis

Parallel Coordinates

SVG feGaussianBlur

SVG foreignObject Example

Clustered Force Layout I

Multi-Foci Force Layout

Bar Chart with Negative Values

Fisheye Grid

Lab and HCL Color Spaces


Canvas Geometric Zooming

SVG Geometric Zooming


Sticky Force Layout

Spherical Mercator

General Update Pattern, III

Sortable Bar Chart

Normalized Stacked Bar Chart

Donut Chart

X-Value Mouseover

U.S. Counties TopoJSON Mesh

Clipped Map Tiles

Contour Plot

Hexagonal Binning (Color)

Raster Reprojection

Hierarchical Edge Bundling

Symbol Map

Spline Editor

Draggable Network II

Polar Plot

Curved Links


Kentucky Population Density

Raster & Vector II

Merging States

Gist API Latency


Bar Chart I

Bar Chart IIc

Clustered Force Layout III

Cluster Force Layout IV

Zoom to Bounding Box II

Perspective Transformation II

Digital Clock

Wilson’s Algorithm

Wilson’s Algorithm III

Prim’s Algorithm III


Solar Path

Radial Dendrogram

Nested Treemap

GeoJSON in Three.js

Radial Stacked Bar

Van Wijk & Nuij Zooming

Polymaps + D3, Part 2


Collapsible Force Layout

Bounded Force Layout

Pie Multiples with Nesting

Square Circle Spiral Illusion

Horizon Chart

Cost of Living - Parallel Coordinates

Mitchell’s Best-Candidate

Canvas Swarm

SVG Swarm

Margin Convention


Geodesic Grid

Scatterplot Matrix

Resizable Force Layout

SVG Semantic Zooming

Map Projection Distortions

Sortable Table with Bars

Albers Equal-Area Conic

Lambert Azimuthal Equal-Area

Azimuthal Equidistant


d3.geoPath + Canvas

General Update Pattern, I

Bivariate Area Chart

Donut Multiples

Chained Transitions

Threshold Encoding

Non-Contiguous Cartogram

Pseudo-Dorling Cartogram


Area Choropleth

Three-Axis Rotation

Delaunay Triangulation

Kernel Density Estimation

Donut Transitions

Craig Retroazimuthal

Concentric Circles Emanating

Rotating Voronoi

113th U.S. Congressional Districts

Iceland Topography

Transverse Mercator

Metropolitan Unemployment

Hello WebGL IV

Milky Way

California Population Density

Vector Tiles

AlbersUSA + PR

Stroke Dash Interpolation

Orthographic to Equirectangular

Snowden’s Route

Raster & Vector III

Great Arc

Mitchell’s Best-Candidate

Brush Snapping

Mitchell’s Best-Candidate

Plant Hardiness Zones

Drag Slider

Rotating Orthographic

See-Through Globe II

Parallel Coordinates

Dynamic Hexbin

Processing Fixed-Width Data

New York Census Tracts

Quadtree Search

Solar Oscillator

Coastal Graph Distance

Paint by Numbers

Swiss Cantons & Lakes

Prim’s Algorithm

Random Traversal II

Apollonius’ Problem II


Delaunay Circles III

Colorcomb II


Connected Particles III

This Is a Globe

This Is Not a Globe

Connected Particles

Delaunay Force Mesh II

Map Pan & Zoom IV

Poisson-Disc V

Prim’s Algorithm IV

Poisson-Disc IV

Mitchell’s Best-Candidate V

Prim’s Algorithm V

Poisson-Disc II

Poisson-Disc III

Mitchell’s Best-Candidate IV

Uniform Random II


Uniform Random III

Maze Hover

Maze Tree

Randomized Depth-First III

Randomized Depth-First II

Prim’s Algorithm II

Raster & Vector I

Wave Motion

Polar Clock III

Star Map

Rainbow Pack

Pan & Zoom Axes

Blocks Graph

Force-Directed Lattice

Collision Detection

Voronoi Spirals II

Voronoi Spirals III

Animated Quadtree

Radial Stacked Bar III

California Population Density II


Cellular automata

Pale Dawn

Minecraft Overviewer

Fancy Markers

Caravaggio’s Bacco (1597)

Protovis / Nelson Minar

Hover Markers

Fancy Markers (No Gradient)

Resizable Markers

Labeled points

Image Markers

Focusable Maps

Rainbow Voronoi

Moiré Patterns

Circular Layout

Circular Layout (Recursive)

Circular Layout (Arc)

Circular Layout (Raindrops)

Circular Layout (Slider)

Polymaps + D3

Line Tension

Arc Clock

Segmented Lines

Force-Directed Tree

Pixymaps (Dragging)

Pixymaps (Scrolling)

Force Layout with Tooltips

Multi-Foci Force Layout

Sunburst with Distortion

Point-Along-Path Interpolation

Case-Sensitivity and SVG-in-HTML

Transform Transitions

Pie Chart Update, I

Drag Multiples

Circle Packing Zero Values

Monday-based Calendar

Point-Along-Path Interpolation

Clustered Force Layout II

Force Layout Multiples (Independent)

"Elbow" Dendrogram

Text Along a Path

Force-Directed Graph with Mouseover

Force Layout & Matrix Market Format

W3C Validation Errors

Tree Layout from CSV

Rectilinear Grid

Orthographic Grid


Orthographic Clipping

Orthographic Shading

Twitter SVG Logo

Shape Tweening

Force Layout with Canvas

Collision Detection (Canvas)

Rainbows are Harmful

Letter Frequency

Aitoff Graticule

Winkel Tripel Graticule

Canvas Semantic Zooming


Kavrayskiy VII


Wagner VI



Equidistant Conic Projection

Eckert I


Lambert Conformal Conic

Eckert III

Eckert II

Eckert IV

Goode Homolosine

Eckert V


Eckert VI



Antimeridian Cutting

Satellite Projection Test

Interactive Orthographic

Adaptive Resampling

Van der Grinten I

Rotating Winkel Tripel



General Update Pattern, II

August Projection

Voronoi tests



Gradient Encoding

Color via Clipping


Custom Time Format

Rainbow Worm

Fuzzy Counties

County Circles

Swiss Cantons

Blocky Counties

Hexagonal Binning (Area)

Peirce Quincuncial


Q-Q Plots

Gringorten Equal-Area

Polar Azimuthal Equal-area

TopoJSON Points

Blocky Counties

Azimuthal Equidistant

Interrupted Goode Homolosine

Gnomonic Butterfly

Interrupted Sinusoidal

Hammer Retroazimuthal

Craig Retroazimuthal

Berghaus Star


Quartic Authalic

Wagner VII

Craster Parabolic

Flat-Polar Parabolic

Flat-Polar Sinusoidal

Baker Dinomic

Flat-Polar Quartic


Natural Earth

Tobler World-in-a-Square

Maurer No. 73

Hill Eucyclic

Interrupted Boggs Eumorphic

Boggs Eumorphic

Interrupted Sinu-Mollweide

Laskowski Tri-Optimal

Van der Grinten IV

Wagner IV

Interrupted Mollweide



Mollweide Hemispheres

Two Point Equidistant


Two Point Equidistant

Asia Lambert Conic Conformal

The Sun’s View of the Earth

Constrained Zoom

Gray Earth

EPSG:2163 Coordinates

Arc Tween

New Jersey State Plane


Rectangular Polyconic

Van der Grinten II

Cylindrical Stereographic

Van der Grinten III

Ginzburg V

Ginzburg VIII

Ginzburg IV

Ginzburg VI

Ginzburg IX

Ohio State Plane (N)

Lorenz System

Lorenz Toy

Kepler’s Tally

Merging States II

Albers Siberia

Marey’s Trains II

Albers USA

U.S. Rivers

Albers Tiles

US, CA, MX and PR

Airy’s Minimum Error

Airy’s Minimum Error

Chamberlin Trimetric

Tissot’s Indicatrix

Hierarchical Edge Bundling

Adaptive Resampling

TopoJSON Parallax

TopoJSON Layers

Rotating Orthographic

Transversing Equirectangular

Scale-Dependent Sampling

Line Simplification

Rotating Transverse

Resampling Comparison

Albers without Resampling

Albers with Resampling

Resampling Comparison

No Antimeridian Cutting

Kentucky Population Density

Extradition Treaties

Alaska Albers

New York Block Groups

Gradient Bump

U.S. Urban Areas

Brush Transitions

Custom Cartesian Projection

Mitchell’s Best-Candidate

Zoom Center

Brush Snapping II

Zoom Transitions

Dynamic Simplification II

Dynamic Simplification

Map Zooming II

Map Zooming III

Population Choropleth

Ring Extraction

Junction Finding

U.S. State Mesh

Ring Cutting

Arc Deduplication

Treemap Padding

Canvas Voronoi

Floating Landmasses

See-Through Globe

Delaunay Force Mesh

Snowflake Simplification

Virginia Counties

Dynamic Simplification IV

Cluster Dendrogram II

Closest Point on Path II

Solar Terminator (Waterman)

Neighboring Congressional Districts

Now + Solar Terminator


Radial Gradient

Raster & Vector IV

Multitouch Drag

Multitouch Drag II

County Topology

Coastal Graph Distance II

Border Distance

State Icons

Merging Counties III

Paint by Numbers II

Congressional District Topology

Random Search

Best-First Search

Random Search II

Random Traversal III

Best-First Search II

Phyllotaxis II

Cubehelix II

Nightly Show

Improved Circle Packing

Voronoi Circles

Delaunay Circles II

Delaunay Circles


Color Mesh II

Color Mesh

Quantile Choropleth

Connected Particles II

Cubehelix Color Space

Easing Functions III

Easing Functions II

HCL Color Space

Easing Functions

Rainbow Circle

Delaunay Force Mesh III

Spiral Triangle II

Spiral Triangle

Patterson Cylindrical

Solar Analemmas

Equirectangular Fisheye

Multiple Rotations

Back-facing Hemisphere

Merging States

Map Pan & Zoom II

Map Pan & Zoom I

Map Pan & Zoom III

Annulus Sampling II

Mitchell’s Best-Candidate III

Uniform Random

Quicksort VI

Mergesort IV

Annulus Sampling I

Mergesort III

Quicksort V

Quicksort II

Quicksort I

Randomized Depth-First

Better-Only Search

Random Traversal

Chained Transitions

Isometric III


Sized Donut Multiples

Isometric II

Inline Labels


Percentage Change


Diamonds II

Kernel Smoothing

Voronoi Topology

Polar Clock II

N-Body Problem II

Chained Transitions II

Click vs. Drag

Zoom vs. Click

Transform Transitions II

Constrained Zoom

Fixed Zoom

Treemap by Count

Streaming Shapefile

Interrupted Sinusoidal II

Peirce Equatorial

Stretched Treemap

Sleep Cycles

Pierce Tiles

Tile by Bounding Box

ColorBrewer Spline II

ColorBrewer Spline

Mona Lisa Histogram

Drag & Zoom

Drag & Zoom II

Pan & Zoom V

Pan & Zoom IV

Pan & Zoom III

Pan & Zoom II

Pan & Zoom I

Zoom Transitions

Force Dragging II

Circle Dragging IV

Example Authors

Force-Directed Tree

Hexagonal Binning

Nest Treemap


Rainbow Perceptual Distance


Tidy Tree vs. Dendrogram

Circle-Packing II

Voronoi Spirals

Rainbow Treemap

Cascaded Treemap

Density Contours II

Density Contours

Cloud Contours

Contour Plot III

Contour Plot II


Winding Order

Border Mesh

Circle Piano

Polygon Clipping III

Circle Wave

Radial Stacked Bar II

Radial Normalized Stacked Bar

Clipped Conic Conformal

D3 Source Treemap

Isolating Forces

Merged Choropleth

Branched Random Walk

Monochrome Mona Lisa

Marimekko Chart

Square Grid

Absolute-Positioned Tooltip

Linear Gradient

Small Multiples

Force Layout with Mouseover Labels

Spinny Globe

Pie Multiples

A Bar Chart

Spline Transition

Line Transition (Broken)

Hive Plot (Areas)

Hive Plot (Links)


Force Layout from CSV

Pedigree Tree

Area with Missing Data

Duration Histogram

Animated textPath

Tree Layout Orientations

Line Interpolation

Force-Directed Graph

Axis Styling

Cylindrical Equal-Area

Rotating Equirectangular

Progress Events

Interactive Stereographic


Pseudo-Demers Cartogram

Axis Styling II

The Amazing Pie

Graph Rollup

Brushable Network

Draggable Network

Brushable Network, II

Threshold Key

Project to Bounding Box

Pie Chart Update, III

DRY Bar Chart

Drag + Zoom

Bar Chart IIIc

Merging Counties

Accelerate, Then Coast III

Link Nodes by Name

Canvas Bar Chart

Cubehelix Color Picker

Line Drawing

Programmatic Pan+Zoom III

Pencil Sketch

Canvas Line

Line with Missing Data

N-Body Problem

Zoom to Domain

Brush Snapping III

Brush & Zoom II

Force Dragging III

Force Dragging I

Circle Dragging I


Force-Directed Web Worker

Stacked Negative Values

Versor Dragging

Modifying a Force Layout II


Sequential Tiles

Hilbert Tiles


Fill-Rule Evenodd

Banded Arcs

Radial Arc Diagram

Grouped Bar Chart

Force Layout from List

External SVG

Superformula Tweening

Venn Diagram with Clipping

Venn Diagram with Opacity

Date Ticks

Force-Directed Layout from XML


Array Subclassing Test

Force Layout from Adjacency List

Merge Sort

Poor Anti-Aliasing in SVG, #1

Poor Anti-Aliasing in SVG, #2

Log-Log Plot

Left-Aligned Ticks

Table of Progress

One Path for All Links


Transition Speed Test

Sortable Bar Chart

Irregular Histogram (Lollipop)

Circle Packing with Zero Values

Irregular Histogram

Static Force Layout

Asynchronous Queue

Month Axis

Histogram Chart

click-to-center via transform

SVG Path Cleaning

Albers Projection

Albers USA Projection

Orthographic Projection

Squares ↔ Hexagons

Manual Axis Interpolation





Cross-linked Mouseover

Mirrored Easing

Animated Clipped textPath

Transform Interpolation

Scatterplot with Multiple Series

Chrome Circle Precision Bug

Chrome Circle Precision Bug

Heatmap (2D Histogram, CSV)

Scatterplot with Shapes

Multi-Value Maps

d3.time.format localization

d3.time.scale nice

Monotone Interpolation

Pack Test

Pack Test

Circular Segment

Rotating Orthographic

Interactive Gnomonic SVG Logo

Programmatic Pan+Zoom

Update-Only Transition

Path Tween

Voronoi Test (N=2)

Sankey Interpolation

Lines with Rounded Turns

U.S. Land TopoJSON

Capturing Mousemove

Circle-Polygon Intersection

Voronoi Clipping

Closest Point to Segment

Convex Hull

ggplot2-Style Axis

Ordinal Brushing

Rotated Axis Labels

One-Way Markers


Concurrent Transitions

How selectAll Works

One System, Every Kepler Planet

Hello WebGL

Hello WebGL III

Hello WebGL II

Log Axis with Zero

Log Axis

Projected TopoJSON

Custom Projection

Pie Chart Update, V

Pie Chart Update, IV

Custom Easing

Exit, Update, Enter II

Exit, Update, Enter

Concurrent Transitions II

No Zoom on Context Menu

Left-Aligned Ticks

Dynamic Simplification III

Simple Junctions

Click-to-Recenter Brush II

Click-to-Recenter Brush

Smooth Slider

Subsecond Ticks

Superscript Format

Superscript Format II

Bar Chart II

Bar Chart IIa

Bar Chart IIb

Range Transition

Bar Chart IIIb

Bar Chart IIIa

Infinite Queue

Natural Log Scale

Rotating Icosahedron

Stretched Projection

Clone Templates

Small Multiples III

Animation Benchmark

Tick Format

Lambert Conformal Conic


Merging Counties II

Accelerate, Then Coast

Accelerate, Then Coast II

Interrupting Chained Transitions

Rainbow Luminance


Transition to Default

Animated D3 Logo

Smallest Enclosing Circle

Fitted Symbols

Revised D3 Logo

Apollonius’ Problem

Matplotlib Colormaps

HSL Color Picker

Lab Color Picker

Cubehelix Interpolation II

HCL Color Picker

Cubehelix Interpolation

HCL Interpolation

HCL Interpolation II

RGB Color Picker

State Grid

Programmatic Pan+Zoom II

Named Transitions II

Arc Piano

Extending Arcs

Arc Corners IV

Circle in Sector

Arc Corners III

Arc Corners II

Pie Padding II

Arc Corners

Pie Padding

Counterclockwise Arc

Rounded Corner

Tile Viewer

Named Transitions

Closest Line Segment


Line Segment Intersection

A Less-Angry Rainbow

Mitchell’s Best-Candidate II

Shuffle II

Shuffle I

Mergesort II

Quicksort III

Quicksort IV

Analyzing Spanning Trees

Mergesort I

Prim’s Algorithm IV

Random Traversal IV

Wilson’s Algorithm IV

Fitting Affine Projection

Randomized Depth-First IV

New Splines!

Bar Chart with Negative Values II


Arc Corners II

Arc Padding III

Arc Padding II

Donut Centroid

Arc Corners

Pie Centroid

Canvas Pie

Canvas Donut

D3 Outline Logo

Seven Symbols

Convex Hull

Pie Padding

T-minus Time

Arc Padding

Rounded Arc Test

Catmull–Rom Curves


Text Transition II

Text Transition I

Fit Extent

Eased Scale

Scatterplot Tour

Histogram II

Local Variables

D3 Custom Bundle II

Fetching CSV

Circle Dragging II

Circle Dragging III

Force-Directed Graph

Adjustable Link Strength

Antimeridian Cutting II

I Make Circles

Force-Directed Tree II

Polygon Clipping II

Polygon Clipping I

Versor Dragging II

Radial Force

Click to Select All

Smooth Scrolling

D3 Custom Bundle

CSS3 Modal Button


Image Processing


Hello, D3!

D3 and Custom Data Attributes


Expandable Menu


Input Value Interpolation

offsetX / offsetY

offsetX / offsetY

Zero Ticks

Extent Ticks

Ordinal Tick Filtering

Ordinal Axis

Custom Tweens

Rounded Rectangle

Hashing Points

Ordinal Tick Filtering

Non-Computed Style Tween




Immediate Transitions

Parent Data

XML Parsing

Municipalities of Mexico II

Municipalities of Mexico

GeoTIFF Contours II

GeoTIFF Contours

Localized Time Axis II

Localized Time Axis

Undersea Cables II