Home

D3 (Data-Driven Documents or D3.js) is a JavaScript library for visualizing data using web standards. D3 helps you bring data to life using SVG, Canvas and HTML. D3 combines powerful visualization and interaction techniques with a data-driven approach to DOM manipulation, giving you the full capabilities of modern browsers and the freedom to design the right visual interface for your data.

Resources

• Introduction
• API Reference
• Release Notes
• Gallery
• Examples
• Tutorials
• Plugins
• d3.js on Stack Overflow
• d3-js Google Group
• d3-js Slack Channel (Invite)
• d3-js Gitter Channel
• d3-js IRC Channel => #d3.js on irc.freenode.net

Translations (Unofficial)

• 한국어
• 日本語
• 中文手册
• 简体中文
• 繁體中文
• Русский
• Türkçe
• Indonesian
• Português

Installing

If you use NPM, npm install d3. Otherwise, download the latest release. The released bundle supports AMD, CommonJS, and vanilla environments. Create a custom bundle using Rollup or your preferred bundler. You can also load directly from d3js.org:

<script src="https://d3js.org/d3.v4.js"></script>

For the minified version:

<script src="https://d3js.org/d3.v4.min.js"></script>

You can also use the standalone D3 microlibraries. For example, d3-selection:

<script src="https://d3js.org/d3-selection.v1.min.js"></script>

If you prefer to pin to a specific release, try CDNJS or unpkg.

Supported Environments

D3 supports so-called “modern” browsers, which generally means everything except IE8 and older versions. D3 is tested against Firefox, Chrome, Safari, Opera, IE9+, Android and iOS. Parts of D3 may work in older browsers, as the core D3 library has minimal requirements: JavaScript and the W3C DOM API. D3 uses the Selectors API Level 1, but you can preload Sizzle for compatibility. You'll need a modern browser to use SVG and CSS3 Transitions. D3 is not a compatibility layer, so if your browser doesn't support standards, you're out of luck. Sorry!

D3 also runs on Node and web workers. To use the DOM in Node, you must provide your own DOM implementation; JSDOM is recommended. To avoid defining a global document, pass a DOM element to d3.select or a NodeList to d3.selectAll, like so:

var d3 = require("d3"),
    jsdom = require("jsdom");

var document = jsdom.jsdom(),
    svg = d3.select(document.body).append("svg");

Local Development

Browsers enforce strict security permissions to prevent you from reading files out of the local file system. To develop locally, you must run a local web server rather than using file://…. Node’s http-server is recommended. To install:

npm install -g http-server

To run:

http-server & 

This will start the server on http://localhost:8080 from the current working directory.