Skip to main content

Awesome D3

This list keeps track of interesting D3js libraries, plugins and utilities. We decided not to list tutorials, resources or concepts here, because there is already a very good list of readings out there you can check out and contribute to.

Curators: Moritz Klack and Christopher Möller of webkid.io

You can also explore the list with our interactive D3 Discovery tool.

Charts

  • billboard.js - Re-usable chart library [bar, line, area, donut, pie, step, spline]
  • britecharts - Client-side reusable charting library [bar, line, donut, sparkline, step]
  • chart-parts - A flexible, React-friendly, Grammar of Graphics for data visualization
  • cirrusjs - A multi-renderer charts library [area, line, stacked]
  • cubism - Time series visualization
  • c3 - Reusable chart library [line, spline, step, area, stacked, bar, pie, donut]
  • dagre-d3 - Layout directed graphs on the client-side
  • dc.js - For heavy amounts of data
  • dimple - An object-oriented API for business analytics [bubble, area, stacked]
  • d2b - Chart library for axis, pie, sankey, sunburst charts
  • d3.chart - Framework for building reusable charts
  • d3.chart.sankey - Reusable D3 Sankey diagram
  • d3-bar - Bar chart
  • d3-beeswarm - Plugin which computes a beeswarm arrangement
  • d3-boxplot - d3js box plot plugin
  • d3-bumps-chart - Plugin for visualizing bumps charts
  • d3-circle - Circle chart [donut]
  • d3-dag - Layout algorithms for visualizing directed acylic graphs
  • d3-dot - Dot chart
  • d3-ez - Easy Reusable D3 Charts & Components [bar, donut, pie, bubble, rose, heatmap]
  • d3-flame-graph - Flame graphs from hierarchical data
  • d3-funnel - A funnel and pyramid chart library
  • d3-gridding - Chart mockups using grids
  • d3-heatmap - Heatmap
  • d3-horizon-chart - Horizon charts module
  • d3-line - Line chart
  • d3-message-sequence - A dynamic/static message sequence chart
  • d3-timeseries - Time series charting library
  • d3-upset - Functions for plotting an UpSet plot [upset, bar, intersections, venn, relationships]
  • d3-x3d - Data Driven 3D Charts with D3 and X3D [bubble, bar, surfacearea, scatterplot, area]
  • d3fc - A collection of interactive chart components [line, bar, stacked, scatter, candlestick, ohlc]
  • d3plus - Extension library for easy creation of visualizations [scatter, stacked, line, bar, pie, network, bubble, box, map]
  • d3panels - Interactive charts with linked brushing [dot, scatter, line, heatmap, histogram]
  • d3pie - A configurable pie chart lib and generator
  • D3xter - Straight forward plotting [plot, timeline, bar, histogram, pie]
  • D4 - Re-usable charts DSL [bar, donut, line, scatter, stacked, waterfall]
  • dTree - Family tree library
  • epoch - A general purpose, real-time visualization library [area, bar, line, pie, scatter]
  • EventDrops - A time based/event series interactive visualization
  • Fancycharts.js - Library to visualize percentage values [bar, circles, donut]
  • firespray - Streaming charts [bar, line, stacked]
  • forest-d3 - A time series charting library [line, area, stacked, bar, scatter, pie ohlc]
  • Gantt-Chart - Gantt chart library
  • insights - Library to visualize and navigate graphs
  • kotojs - ES6 based framework
  • metrics-graphics - Optimized for visualizing time-series data [line, scatter, area]
  • micropolar - A polar chart library
  • mpld3 - Export matplotlib graphics to work in the Browser
  • neo4jd3 - Neo4j graph visualization
  • nvd3 - Re-usable charts and chart components [box plot, buttlet, candlestick, line, bar, pie, scatter, sparkline]
  • oecd-simple-charts - Simple charting library [box plot, stacked bar, pearl chart]
  • peek - Object-oriented chart library [scatter, line, area, bar, pie, donut]
  • plotly.js - High level charting library [scatter, line, bar, pie, box plot, histogram, heatmap]
  • plottable - Flexible, interactive charts for the web [area, bar, line, pie, scatter, stacked]
  • radar-chart-d3 - Radar chart module
  • rickshaw - Toolkit for creating interactive real-time graphs [line, scatter, bar]
  • taucharts - Charts with a focus on design and flexibility [line, bar, area, stacked]
  • techan.js - A visual, stock charting and technical analysis [candlestick, ohlc]
  • uvCharts - Supports lots of different chart types [bar, area, pie, stacked, line, polar, donut]
  • vega - A visualization grammar
  • vega-lite - A high-level grammar of interactive graphics
  • vega-lite-api - A JavaScript API for Vega-Lite.
  • venn.js - Area proportional Venn and Euler diagrams
  • visavail - Time data availability visualization
  • vizabi - A framework for building visual data exploration tools [bubble, map, line, bar, sankey, donut]
  • WebCola - Layout for graph visualization and exploration
  • xkcdgraphs - Xkcd style graphs [line]
Third Party
  • angular-nvd3 - NVd3 for AngularJS [line, stacked, bar, area, scatter, bullet, donut]
  • d3act - d3 with React [bar, bubble, pie]
  • d3-simpleCharts - A d3 wordpress plugin
  • ember-charts - Charts for Ember [line, bar, stacked, pie, scatter]
  • Layer Cake - A graphics framework built on top of Svelte.
  • line-chart - Line chart module for AngularJS [line, area, bar]
  • nivo - Dataviz components for React with isomorphic ability [bar, line, area, bubble, chord, heatmap]
  • ngx-charts - Chart framework for Angular [bar, pie, line, area, polar, stacked, bubble]
  • potion - Collection of React components for composing visualizations
  • react-d3 - Charts for React [area, bar, candlestick, line, pie, scatter]
  • react-d3-components - D3 Components [bar, stacked, scatter, line, area, pie]
  • react-d3-library - Library to use D3 in React [area, bar, line, pie, scatter]
  • react-stockcharts - Highly customizable stock charts [area, line, scatter, bubble, bar, stacked, candlestick]
  • react-vis - A collection of react components to render visualizations [area, bar, heatmap, line, scatter]
  • reaviz - Data visualization library for React based on D3
  • recharts - Re-designed charting library built with React
  • semiotic - A data visualization framework combining React & D3 [scatter, line, area]
  • victory - Composable React components for building visualizations [area, bar, candlestick, pie, line, scatter, voronoi]
  • vx - Visualization components for React [bar, line, scatter, stacked, area, pattern, heatmap, pie, radial, map, geo]
  • Vs - Declarative visualisation components for Vue.js [bar, line, area, pie, donut, stacked, sankey, timeline]
  • v-chart-plugin - Easily bind a chart to the data stored in your Vue.js components.

Maps

  • d3-carto-map - A mapping API that uses D3 geospatial functionality
  • d3-composite-projections - Projections for showing countries' distant lands together
  • datamaps - Customizable map visualizations in one file
  • d3-topogram - Continuous area cartograms based on TopoJSON
  • d3-exploder - Lets you easily move and resize geographic features
  • d3-geo-polygon - Clipping and geometric operations for spherical polygons
  • d3-geo-projection - Extended geographic projections
  • d3-geo-scale-bar - Displays automatic scale bars for projected geospatial data.
  • d3-geo-voronoi - Voronoi diagrams and Delaunay triangulation for the sphere
  • d3-geomap - Library for creating geographic maps
  • d3.geo2rect - Morphing geojson polygons into rectangles
  • d3-inertia - An extension to d3-drag that continues the mouse movement with some inertia
  • earthjs - Building orthographic globe with SVG, Canvas & WebGL
  • mapmap.js - A data-driven API for interactive thematic maps
  • mapsense.js - Full resolution vector maps with D3
  • maptable - Convert datasets to a set of visual components (Map, Filters, Table)
  • simple-map-d3 - Easy choropleth style maps
  • spam - Create maps with D3 and Canvas, easily
Third Party
  • leaflet-d3 - Collection of plugins for using D3 with Leaflet [map, geo]
  • react-d3-basic - Library For Building Composable And Declarative Maps [map, geo]
  • Wikimaps-D3js Atlas - CLI to generate raster, topojson and svg maps [map, geo]
  • react-simple-maps - An SVG mapping component library for React, built on top of d3-geo [map, geo]

Utils

Miscellaneous

  • chess-dataviz - Chess dataviz library
  • codeflower - Bird's eye view of the whole code
  • comic.js - Cartoon style drawing. Works also for canvas, Raphael & SVG.js
  • dragit - A toolkit to enable the manipulation of data graphics
  • d3moji - First class emoji support
  • d3-cloud - Word clouds
  • d3-context-menu - Helper to create context-menus
  • d3-force-gravity - Implement gravitational attraction (or force-field-like repulsion)
  • d3-force-reuse - Faster force-directed graph layouts by reusing force approximations
  • d3-force-sampled - Super fast, linear-time force-directed graph layouts by Random Vertex Sampling
  • d3-resume - Resume visualizer
  • d3.sketchy - Creates sketchy backgrounds, shapes and lines
  • d3plus-text - Smart SVG text box with line wrapping and automatic font scaling
  • graph-scroll - Simple scrolling events
  • jsdoc2diagram - Create tree diagram from jsdoc
  • mermaid - Generation of diagrams and flowcharts from text in a markdown style
  • netvis - Visualize network communication for arbitrary protocols
  • treeviz - Create customizable trees from json data
  • twitter-sentiment-visualisation - A series of D3.js charts showing realtime sentiment of Twitter data

Server side

  • d3-node - Static chart and map generation
  • Kyrix - Interactive pan/zoom Visualizations with automatic server-side scaling support.

Code Editors

Bl.ocks.org Profiles

Contribute to this list: https://github.com/wbkd/awesome-d3