Who Will Drive Data Driven Documents?

Check out this javascript library D3 for “Data Driven Documents” (D3 on Github).  At first D3 seems to be just yet another way to add graphs and charts to web pages, but if you spend a few minutes soaking it in you can see how it might change how people think about data and documents altogether.

Example data diagrams produced with D3 javascript library

Like anything that changes our mental paradigm it takes a bit of noodling to wrap your head around it. D3 is similar to basic jQuery with the twist that you can add and transform data attached to arbitrary DOM elements, then use that data to drive the visualization and behavior of the DOM dynamically.

D3.js is a small, free JavaScript library for manipulating documents based on data.

D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. As a trivial example, you can use D3 to generate a basic HTML table from an array of numbers. Or, use the same data to create an interactive SVG bar chart with smooth transitions and interaction.

Data Driven Functions

There are some clever things to be done in just a few lines of code when you use D3 to map what might normally be static attributes of your CSS/HTML/SVG (or other DOM elements) to data driven functions.  D3 provides: Continue reading