D3.js stands for Data-Driven Documents and is a JavaScript library for manipulating documents based on data. It is one of the best tools available that provides data visualization in W3C-compliant computing, applying such broadly used web technologies and standards as HTML5, JavaScript, Cascading Style Sheets (CSS3), and Scalable Vector Graphics (SVG).
D3.js works in the following way: arbitrary data is bound to a Document Object Model (DOM), after that data-driven transformations are applied to the document. With D3 array of numbers can be source of both simple HTML table and interactive SVG bar chart with smooth animation and transitions.
One of the possible keys to the D3′s success is the lack of constraints. It is not a data processing library, nor it is a graphics library. It doesn’t aim to provide implementation of every possible feature. D3 doesn’t limit developers with pre-built templates. Instead, it provides solution to the basic issue: efficient manipulation of documents based on data. Apart from set of tools that easily connect data and graphics, D3 supports reusable code, large datasets and dynamic behaviors for interaction and animation.
Another reason of D3’s success is its flexibility provided by seamless usage of existing web technologies (HTML, CSS, SVG) and manipulation of any part of the DOM. It simplifies the developer’s job and doesn’t limit neither look-and-feel of the data visualization, nor its placement on a webpage. Moreover, selectors used by the library are defined by the W3C Selectors API and supported natively by modern browsers. D3 not only works on the web, it takes advantage of browser resources to make the process of visualizing data as fast and flexible as possible.
D3 applies pre-built JavaScript functions for wide range of tasks, such as to select elements, create SVG objects, style them, add dynamic effects, transitions, etc. For the styling of the objects CSS can also be used. Most popular data formats are supported out-of-the-box: JSON, CSV (comma-separated values) or geoJSON. For other specific data formats JavaScript functions can be written.
Styles, attributes, and other properties are not just simple constants in D3.js, but can be specified as functions of data. D3 provides many powerful built-in functions that take care of, for example, projecting geographic coordinates into SVG path data, or rich text/graphic charts and diagrams generation by binding large datasets to SVG objects. Library’s functional style provides code reuse through a rich set of components, plugins and reusable functions (e.g. graphical primitives for area, line and pie charts, etc.).
D3 is cross-platform and can be used with different purposes. For instance, it can be integrated into Plone CMS using collective.js.d3 package. Main benefits of this particular library are that D3:
- is fast and flexible general purpose visualization library;
- uses full capabilities of popular and widely accepted web standards;
- provides a way to map data to documents;
- handles data transformation;
- provides basic math and layout algorithms.
D3.js is a library that uses digital data to create and control dynamic and interactive graphical forms which run in web browsers. The main D3’s advantage is that it offers great control over the final visual result. Its application of popular web standards allows to discover full browser capabilities, combining powerful visualization components with a data-driven approach to DOM manipulation. To get more information visit D3.js website or view rich visual examples.