Gallery - zziuni/d3 GitHub Wiki
Wiki ▸ Gallery
Welcome to the D3 gallery. Feel free to add links to your work! More examples are available on bl.ocks.org/mbostock. If you want to share an example and don't have your own hosting, consider using Gist and bl.ocks.org.
- Visualization of Contribution in Wikipedia - H. Jung
- Popularity of Reddits with tooltips + zooming. - Tejen Shrestha
- [Commuting Scales, Lausanne Campus commuters] (http://choros.ch/cs/) - Boris Beaude and Luc Guillemot
- [Visualization of the Flask Source Code] (http://www.andreas-dewes.de/code_is_beautiful) - Andreas Dewes
- [Violence in Nepal] (http://nepal.icbl.org/data-ncbl-main) - Shirish Pandey
- Photography Stats Analysis (bottom of the page) - Remi Escola
- StockTwits Social Heatmap - StockTwits
- Social web use in 2009 - Nikhil Bobb
- Visualizing opinons around the world (zoomable world map and interactive pie chart) - Siamac Fazli, Bastian Venthur
- Running Away Balloons - simple game - Astek
- Visualizing word density in the Bible - Gary Lee
- [Election 2012 Social Dashboard (interactive Twitter visualization)] (http://events.current.com/social_dashboard) - Current TV
- Visualizing document similarity over time
- Drought during Month
- Mortgage Calculator - MortgageBloom
- Interactive Publication History - Ben Bederson
- Visualizing Networks with Hive Plots
- The Wealth & Health of Nations
- Bézier Curves, Collatz Graph, Word Cloud and many Mathematical Visualisations - Jason Davies
- Koalas to the Max! - Vadim Ogievetsky
- Urban Water Explorer - Jan Willem Tulp
- What Do You Work For? - Jeffrey Baumes
- Misc. Examples - Justin Palmer
- Collusion FireFox Addon - Atul Varma
- UK University Statistics - Keming Labs (Kevin Lynagh)
- Slopegraphs - Hamilton Ulmer
- Marmoset chimerism dotplot - David Rio Deiros
- UN Global Pulse 2010 Visualization - Eduardo Graells & Ruth Garcia
- U.S. Population Pyramid - Jeff Heer
- WindHistory.com: maps and charts - Nelson Minar
- Students' seating habits - Skyrill.com
- World Wide Women's Rights - Wimdows.nl
- Old Visualizations Made New Again - Jim Vallandingham
- Scatterize - Nate Vack
- Various visualisations especially with d3.geo - Lars Kotthoff
- Global Life Expectancy - Nathan Yau (FlowingData)
- Vegetable Nutrition w/ Parallel Coordinates - Kai Chang
- London Olympics Perceptions - Donuts to Chord Diagram Transition - Kyle Foreman, Peter Hamilton, Cristina Grigoruta
- Colony - Visualising Javascript projects and their dependencies - Hugh Kennedy
- Euro Debt Crisis
- Fuzzy Link-Bot - Entity co-occurrence in music news by Andrew Collins.
- Job Flow
- Visualizing a newborn's feeding and diaper activity - Jimmie Yoo
- Inequality in America - EJ Fox for Visual.ly
- Current Article Popularity Trends on Hacker News - Vadim Ogievetsky
- Hacker News statistics using PhantomJS
- AFL Brownlow Medalists, Summer Olympics Home Ground Advantage, Formula 1 Lap Chart, When is Easter? and David Foster Wallace's "Infinite Jest", and more... - Chris Pudney (VisLives!)
- Uber Rides by Neighborhood
- Les Misérables Co-occurrence
- US Elections 2012 / Twitter
- Major League Baseball Home Runs, 1995-2010 - Ken Cherven (Visual-Baseball.com)
- Color: a color matching game - Maria Munuera and Mark MacKay
- NCAA 2012 March Madness Power Rankings - Angi Chau
- iTunes Music Library Artist/Genre Graph - Christopher Martin
- [Data Story] (http://data-story.org) - Decio Battaglia, Kevin Mahoney and Xiaoying Riley
- A Race to Entitlement
- Visualising New Zealand's Stolen Vehicle Database Part1 and Part2 and source code
- Visualizing San Francisco Home Price Ranges
- Daily data return rates for seismic networks in the EarthScope USArray - Rob Newman, Array Network Facility, UCSD
- What Size Am I? Finding dresses that fit - Anna Powell-Smith
- Baseball 2012 Predictions based on past 6 years - Danny Hadley
- Last Chart! - See the Music
- Multiple visualization from the Société Typographique de Neuchâtel - Vincent Hiribarren
- Prime numbers pattern
- Interactive visual breakpoint detection on SegAnnDB - Toby Dylan Hocking
- Coordinated visualizations for Consumer Packaged Goods
- eCommerce API Wheel for eBay - Saranyan Vigraham
- The business of Bond
- Home energy consumption - Peter Cook
- Heatmap of gene expression with hierarchical clustering , [demo here] (http://blog.nextgenetics.net/demo/entry0044/) - Damian Kao
- [Graph diagram of gene ontology] (http://blog.nextgenetics.net/?e=19), [demo here] (http://blog.nextgenetics.net/demo/entry0019/demo.html) - Damian Kao
- [UMLS (Unified Medical Language System) Visualizer] (https://ncc.cchmc.org/prod/umls_visualizer/index.do)
- University of Washington Departments - Matthew Sorensen
- Baby Names in England & Wales - Anna Powell-Smith
- Realtime webserver stats - demo - (Github, Github) - Andrew Weeks
- TradeArc - Arc Diagram of Offseason NHL Trades, (Github) - Nathan Stehr
- Visualizing Swiss politicians on Twitter using D3.js - Ralph
- Close Votes - visualizing voting similarities for the Dutch 2012 national elections - Jan Willem Tulp
- Multiple Area charts and a brush tool - Tyler Craft
- Enumerating vertex induced connected subgraphs - Robert Kozikowski
- Startup Salary & Equity Compensation - Jared Jacobs (wealthfront.com)
- Pyramid charts: demographic transition in the US
- Floating bubble chart: De Maastricht au traité budgétaire : les oui et les non de 39 personnalités politiques
- Exploring d3.js with data from my runs to plot my heart rate
- Is Barack Obama the President? (Balloon charts)
- Audio Spectrum Analyzer - Ari Russo
- Browser usage plurality - Ali Almossawi
- Places in the Game of Thrones - Jérôme Cukier
- A Visit From The Goon Squad - Interactive Character Map - Filip Zembowicz
- Twitter Influencer Visualization - Erik Driessen
- Chicago Ward Remap Outlines - Christopher Manning
- Minute: record of all of my keystrokes - Tom MacWright
- Olympic Medal Rivalry - Makoto Inoue
- Visualizing U.S. Births and Deaths in Real-Time - Brad Flyon
- Vélib network visualization - Cyril Gantzer
- Events in the Game of Thrones - Jérôme Cukier
- Chart Wheel Visualization - Anil Omanwar
- Comparing the same surveys by different polling organizations (polish) and translated in english - smarterpoland
- Confidence interval in poll surveys and translated in english - smarterpoland
- Forecast of Mexican 2012 presidential election - Diego Valle-Jones
- Romanian parliamentarian bubble chart. In Romanian - Harta Politicii
- Linked Jazz network graph - Matt Miller
- Bibly v2: Visualizing word distribution within the KJV bible - GARY LEE & ANIRUDH VENKATESH
- A physics model of a physics model - Michiel van der Blonk
- OECD Health, Government Spending, and Obesity Rates (nvd3) - Amelia Mango
- The first thing that should be shown in any Trigonometry class
- How educated are world leaders? - Ali Almossawi
- Dynamic charts and dynamically populated charts - Marcello La Rocca
- Radial Line Chart and Chart Wheel - Anil Omanwar
- Indo-European concepts, cognates, and etymologies - Joseph Nudell
- Remix of the Century - Henrik Pettersson, David Vella, and Tom Hannen
- Displaying real-time data - Marcello La Rocca
- “Decide the Czech 2013 Presidential Election” interactive visualization - Vojtech Hyza, Karel Minarik, Josef Slerka (about, source)
- Mass Gun shootings in USA - Nanda Yadav
- Clock visualization Dashboard
- UK Rainfall 1910-2012 - Peter Cook
- Modal Logic Playground - Ross Kirsling
- [Slopegraph - 1 static & 1 with d3] (http://www.streamlinedataworks.com/example6.html) - Anna Mehrotra
- [Collection of 9 dynamical systems examples] (http://sigsystext.com) - interactive examples found under educational material - Sean Summers
- [Expected university tuition growth 2030] (http://rumachine.com/tuition/expectedgrowth.html) - Sean Summers
- Standings Slopegraph - Slopegraph of weekly NHL standings for 2012-13 season, (Github) - Nathan Stehr
- [Amsterdam Economic Performance 1995-2011] (http://www.iconomical.com/customers/Amsterdam-EZ/release/) - Iconomical
- The Facebook Offering: How It Compares - Jeremy Ashkenas et al.
- [Four Ways to Slice Obama’s 2013 Budget Proposal] (http://www.nytimes.com/interactive/2012/02/13/us/politics/2013-budget-proposal-graphic.html) - Shan Carter
- At the Democratic Convention, the Words Being Used
- How the Chicago Public School District Compares
- Drought and Deluge in the Lower 48
- All the Medalists: Men’s 100-Meter Freestyle
- The electoral map: building path to victory
- Who Voted for Rick Santorum and Mitt Romney
- Over the Decades, How States Have Shifted
- 512 Paths to the White House and design process
- At the National Conventions, the Words They Used
- Drought Extends, Crops Wither
- How Obama Won Re-election
http://www.jeromecukier.net/projects/models/models.html
- La Nuit Blanche
- Percolation model
- Markov processes
- Cellular automata
- Game of life
- The Polya process
- Schelling's segregation model
- Antipodes
- Quadratic Koch Island Simplification
- Random Points on a Sphere
- Topology-Preserving Geometry Simplification
- Detecting Duplicates in O(1) Space and O(n) Time
- Factorisation Diagrams
- Bubbles
- Set Partitions
- El Patrón de los Números Primos
- Infinite Plasma Fractal
- Random Arboretum
- Crayola Colour Chronology
- Parallel Sets
- Rhodonea Curve
- Tag Cloud
- Combinatorial Necklaces and Bracelets
- Biham-Middleton-Levine Traffic Model
- 9-Patch Quilt Generator
- The Music of Graphs
- Planarity
- Mobile Patent Lawsuits
- Sunflower Phyllotaxis
- Girko's Circular Law
- Calkin–Wilf Tree
- Bloom Filters
- Carotid-Kundalini Fractal Explorer
- Coffee Flavour Wheel
- Number of unique rectangle-free 4-colourings for an nxm grid
- Animated Quasicrystals
- Collatz Graph: All Numbers Lead to One
- Hamming Quilt
- Hilbert Stocks
- Hilbert Curve
- Gaussian Primes
- Wave
- Latest Earthquakes
- Phylogenetic Tree of Life
- Voronoi Boids: Voroboids
- Animated Bézier Curves
- Animated Trigonometry
- Apollonian Gasket
- Monte Carlo simulation of bifurcations in the logistic map
- Sorting Visualisations
- Complete Graphs
- Leibniz Spiral
- Morley's trisector theorem
- Poincaré Disc
- Proof of Pythagoras’ Theorem
- From Random Polygon to Ellipse
- Tübingen
- American Forces in Afghanistan and Iraq
- How to Make an Interactive Network Visualization
- Word Frequency Bubble Clouds
- Animated Bubble Chart of Gates Educational Donations
- Stowers Group Collaboration Network
- GSA-Leased Opportunity Dashboard
- Feltronifier
- We're In The Money: How Much Do The Movies We Love Make?
- Visualizing The Racial Divide
- Composition of Church Membership by State: 1890
- Proportion of Foreign Born in Large Cities: 1900
- http://vallandingham.me/vis/jobs_by_state.html
- License Usage Dashboard
http://www.healthmetricsandevaluation.org/tools/data-visualizations
- GBD Compare
- Mortality Visualization
- COD Visualization
- GBD Heatmap
- GBD Arrow Diagram
- GBD Uncertainty Visualization
- GBD Cause Patterns
- GBD 2010 healthy years lost vs life expectancy
- Life expectancy by county and sex (US) with country comparison
- Life expectancy by county and sex (US)
- Development assistance for health by health focus area
- Development assistance for health by channel of assistance
- Hierarchical Bar Chart
- Grouped Bar Chart (alternative example)
- Stacked Bar Chart
- Reorderable Stacked Bar Chart
- Dynamic Bar Charts
- Sortable bars: Foreign aid, corruption and internet use - Nikhil Sonnad
- Grouped and Stacked Bar Chart
- Reusable Interdependent Interactive Histograms (demo)
- Histogram Chart
- Fixed-width Histogram, Irwin–Hall distribution
- Fixed-width Histogram of Durations, log-normal distribution
- Variable-width Histogram
- Axis Component
- Small Multiples
- Sparklines
- Interactive Line Graph
- Dual scale line chart
- Horizon Chart
- Line Chart with tooltips
- Stacked layout with time axis
- Multiple Area Charts with D3.JS
- Multiple time-series with object constancy - Nikhil Sonnad
- Reusable Pie Charts (demo)
- Pie Multiples / Pie Multiples with Nesting
- Pie Chart Updating (Part 1) (Part 2)
- [Hierarchical Pie Chart] (http://bl.ocks.org/4710330/94a7c0aeb6f09d681dbfdd0e5150578e4935c6ae) - Andreas Dewes
- Scatterplot for K-Means clustering visualization
- Animated bubble charts for school data analysis
- Scatterplot and Heatmap
- Scatterplot: Social trust vs ease of doing business - Nikhil Sonnad
- Animated Sankey Diagram (alluvial)
- Sankey diagram with cycles
- Parallel Coordinates
- Parallel coordinates with fisheye distortion
- Parallel Sets
- Parallel Sets with reorderable heading
- Pair Contribution and Selection - Jesse Heitler
- Graphicbaseball: 2012 Batters and 2012 Pitchers - Will Turman
- Symbols
- Custom Forces
- Multiple Foci
- Multi Foci with Convex Hulls
- Images and Labels
- Drag and Drop Support to set nodes to fixed position when dropped
- Interactive Construction
- Collapsible Hierarchy
- From XML
- From Matrix Market format
- Directed Edges (Curves and Arrow Markers)
- Bounded Force Layout
- Force-Based Label Placement
- Groups and Labels showing relations of football players participating in Euro 2012
- Chicago Lobbyists
- Hacker News Visualisation
- Web performance
- Building a tree diagram
- Reveal animation on a tree with a clip path
- Collpase/expand nodes of a tree
- Pedigree Tree
- Animated
- Collapsible
- Collapsible, with Labels
- Indented Tree (Collapsible)
- Connections in time
- Voronoi Diagram with Force Directed Nodes and Delaunay Links
- Building Cubic Hamiltonian Graphs from LCF Notation
- Circular tree. Will your team win the NCAA Tournament?
- Bracket Layout
- SCION simulation environment
- Treemap Layout in SVG
- Circular tree of d3 src using burrow() for recursive nesting
- Circular tree comparing the src directory for three versions of d3
- Football passes
- Selecties EK 2012
- [Remittance flows] (http://www.torre.nl/remittances/)
- Dependencies Between Classes
- Uber Rides by Neighborhood
- Updating data
- Updating data
- Fade on Hover
- Fade on Hover
- Fade on Hover
- [Static] (http://bl.ocks.org/1046712)
- [Static] (http://bl.ocks.org/1308257)
- Chord Layout Transitions
- [Co-Authors Chords] (http://www.rjbaxley.com/p/publications.html)
- Click-to-Zoom with Albers Projection
- Google Maps
- Polymaps
- Polymaps with custom tiler
- Map from GeoJSON data with zoom/pan
- Maps and sound
- Choropleth classification systems
- Choropleth with interactive parameters for NYC data visualization, code
- Mercator and Albers to Orthographic Projection
- Non-Contiguous Cartogram
- Flows of refugees between the world countries in 2008
- [Interactive azimuthal projection simulating a 3D earth with stars] (http://marcneuwirth.com/blog/2012/06/24/creating-the-earth-with-d3-js/)
- Calculating quadtree bounding boxes, veronoi polygons, delaunay polygons and displaying them in leaflet
- Projection Transitions and Comparing Map Projections
- Composite Map Projection
- World Boundaries TopoJSON
- Mapbox: add vector features to your map with D3
- DataMaps: Interactive maps for data visualizations. - Mark DiMarco
- We ♥ France: transition between the Hexagon and a heart
- Cartogram.js: Continuous Area Cartograms - Shawn Allen
- Earthquakes in Chile since 1900 (Github) - Pablo Navarro
- Choropleth of White House Petition Signers - Adam Pearce
- Interactive choropleth of life excpectancy – Karel Minarik
- India population - Liji Jinaraj
- Hexbins in Leaflet
- [Interactive svg map using D3 circles and transitions] (http://www.incont.ro/infografice/judet-bogat-judet-sarac-unde-se-castiga-cei-mai-multi-bani-in-romania-si-in-ce-domeniu.html) - Vlad Moldoveanu
- ZipDecode - Nelson Minar (after Ben Fry)
- Venn Diagram using Clipping
- Venn Diagram using Opacity
- Marimekko Chart
- Gauge
- Chernoff faces and Chernoff faces example: happy planet index
- Swimlane Chart
- Pictograms
- Smoke charts and source code
- Sankey Diagram with Overlap
- Hierarchical Edge Bundling
- Spiral for John Hunter
- Superformula Explorer
- Superformula Tweening
- OMG Particles!
- Line Tension
- Segmented Lines and Slope Coloring
- Raindrops
- Weeknd3
- Explosions
- Linear Gradients
- Force Directed States of America
- Rounded Rectangles
- Spermatozoa
- Spline, Zoom and Pan
- Arc Tweens
- Show Reel
- VVVV viewer
- Merge Sort
- Epicyclic Gearing
- DOM-to-Canvas
- Transform Transitions
- Square Circle Spiral Illusion
- Adventures in D3
- Time Series
- Voronoi-based point picker
- Radar chart
- Drag rectangle
- Elastic collisions(http://bl.ocks.org/1706849)
- Collider - a d3.js game
- alpha-shapes aka concave hulls
- Conway's Game of life as a scrolling background
- Simple Dashboard Example
- Dataflow programming with D3 and Blockly
- XKCD-style plots
- Violin: Instrumenting JavaScript
- Rotating hypercube in orthogonal projection and parallel coordinates
- Webplatform dancing logo
- Metro Maps of the News
- Life expectancy: small multiples
- Semi-manual force layout of cablegate reference graphs
Charts using the reusable API
- Parallel Coordinates and repository
- Chernoff faces, Fisheye, Geodesic grid, Hive plot, Horizon chart, Sankey diagram,
- Parallel Sets
- Word Cloud
- NVD3
- MathJax label
- Simple table
- Legend
- Dc.js
- Simple Reusable Bar Chart
- Polygonal Lasso Selection
- Floor Plan Map
- Streamgraph an Interactive version
- Histogram
- Circular heat chart
- Word Tree
- Date Ticks
- Masking with external svg elements
- PJAX
- Table Sorting
- Automatically sizing text
- Templating ala Mustache, with Chernoff faces example
- Bay Area earthquake responses by zip code: loading external file through Yahoo Pipes
- Simple HTML data tables
- Responsive SVG resizing without re-rendering
- Automatic floating labels using d3 force-layout
- [Long Scroll] (http://bl.ocks.org/3689677)
- Custom Line Interpolation
- Export to SVG/PNG/PDF server-side using Perl
- Constraint relaxation 1and 2
- Custom Path and Area Generator
- Axis Examples
- Loading Adobe Photoshop ASE color palette
- Render sever-side using Phantomjs
- Reusable text rotation
- Bieber Fever Meter with HTML5′s Web Socket, d3.js and Pusher - Ollie Glass
- Reverse Geocoding Plug-in using an offline canvas
- Custom Multi Scale Time Format Axis - Mike Bostock
- IPython-Notebook with d3.js
- Plotting library for python based on d3
- Visualizing NetworkX graphs in the browser using D3
- Pushing d3 commands to the browser from iPython
- Dance.js: D3 with Backbone and Data.js
- Backbone-D3
- Viewing OpenLearn Mindmaps Using d3.js
- Splay Tree animation with dart, d3, and local storage
- Sankey diagrams from Excel - Bruce McPherson
- [Plotsk: A python/coffeescript/d3.js-based library for plotting data in a web browser] (https://github.com/davidcox/plotsk)
- Data visualization with D3.js and python
- d3.js force diagrams straight from Excel - Bruce McPherson
- Instant interactive visualization with d3 + ggplot2
- d3.js force diagrams with markers straight from Excel - Bruce McPherson
- Visualising a real-time DataSift feed with Node and D3.js
- Very limited, in-progress attempt to hook d3.js up to three.js
- SVG to Canvas to PNG using Canvg
- Canvas with d3 and Underscore
- Automatically sizing text
- SVG to Canvas
- d3 rendered with RaphaelJS for IE Compatibility
- d34raphael
- [D3 graphics in a Pergola SVG UI] (http://www.dotuscomus.com/pergola/pergola_1.4.0/ExamplesHTML/D3/multiD3.html)
- Visualising ConAir Data With Cubism.js (Arduino, TempoDB, Sinatra)
- Render Geographic Information in 3D With Three.js and D3.js
- D3 heatmap using Backbone.js and CoffeeScript - Nacho Caballero
- Visualizing a network with Cypher and d3.js
- ggplot2 + d3 = r2d3
- Using the D3.js Visualization Library with AngularJS - Brian Ford
- Zoomable Partition Charts directly from Excel - Bruce McPherson
- SHEETSEE.JS: Fill up Websites with Stuff from Google Spreasheet -Jessica Lord
- Web reporting with D3js and R using RStudio Shiny - klr @timelyportfolio
- Dex the Data Explorer - Patrick Martin
- Bar chart code generator and online editor
- Live coding based on Bret Victor's Inventing on Principle talk
- Tributary
- D3.js playground
- A CoffeeScript console for d3.js visualization
- CSSdeck: Repulsion example
- DropTask: Visual task management application using D3 for visuals
- Bitdeli: Custom analytics with Python and GitHub
- Cube: Time Series Data Collection & Analysis
- Fast Multidimensional Filtering for Coordinated Views
- Polychart: A browser-based platform for exploring data and creating charts
- Plot.io (swallowed by Platfora)
- Chart.io: The Easiest Business Dashboard You'll Ever Use
- Trisul Network Analytic
- Explore Analytics: cloud-based data analytics and visualization
- Meshu turns your places into beautiful objects.
- Reports for Simple
- Nodal is a fun way to view your GitHub network graph - Jesse Vogt, Matt Stockton, and Kris Gösser
- InfoCaptor Dashboards with D3 and canvas
- Cubism.js: Time Series Visualization
- Rickshaw: JavaScript toolkit for creating interactive real-time graphs
- Dynamic Visualization LEGO
- xCharts: a D3-based library for building custom charts and graphs
- VisualSedimentation.js: visualizing streaming data, inspired by the process of physical sedimentation
- Insights: Interactive Force Graph Component
- arc diagram
- gantt, other timelines and timing diagram
- candlestick or ohlc
- fibonacci scale
- data table (maybe the airline table at the bottom of the crossfilter example?)
- hypergraph