Six useful JavaScript libraries for dealing with data

Need to reformat data for use in another application? Plot it on a map? Use it for an interactive Web graphic? These open-source JavaScript libraries can help turn your data into a suitable format for analysis or a compelling online presentation.

Cascading Tree Sheets

What it does: Cascading Tree Sheets (CTS) aims to do for structured data what Cascading Style Sheets (CSS) does for basic HTML display: help define styling for complex presentations. By adding CTS code widgets for things like maps or charts, users can create visualizations with basic HTML -- no JavaScript knowledge necessary.

What's cool: With six available widgets for Google maps, bar charts, bubble charts and more, users just need to code simple HTML tables and lists in order to generate robust online visualizations.

Drawbacks: Visualization options are fairly limited so far -- for example, the choropleth maps widget only handles states in the U.S. And the project is still in an early stage, so things like sample CTS themes aren't fleshed out yet.

Skill level: Beginner.

Examples and learn more: See examples and sample code on the CTS widget page.

Data-Driven Documents (D3)

What it does: This library gives you functions for binding data to a portion of your HTML document; you can then "apply data-driven transformations to the document." This is not a library like Google Chart Tools, which offers a number of data visualization templates you can customize; this is more of a specialized language that makes it easier to create designs from scratch on an HTML canvas.

What's cool: Talented designers can create almost anything they can envision and craft interactive designs exactly as they want. D3 uses jQuery- and CSS-like selectors to choose elements in your HTML document (technically elements within the Document Object Model, or DOM) and then transform them, which many people find easier to use than straight JavaScript. It handles multiple data formats including XML and CSV as well as JSON, and includes functionality that makes it simple to loop through data sets.

Drawbacks: While D3 is powerful, there's also a relatively steep learning curve compared to other libraries listed here. And since you're literally starting off with a blank canvas, you need both coding and design skill to create something worthwhile -- unless you plan on tweaking code "borrowed" from elsewhere. Update: As noted by a reader, D3 doesn't work with some older browsers, so additional coding with a library such as Sizzle or Raphael may be needed to support earlier versions of Internet Explorer.

Skill level: Expert.

Examples: Take a look at The Tech I.P.O.'s and Four Ways to Slice Obama's 2013 Budget Proposal, both from The New York Times.

Learn more: This D3 tutorials page has a lengthy list of resources, including one from Scott Murray that's the basis of the book Interactive Data Visualization for the Web.

Dataset

What it does: Billed as a "transformation and management library," Dataset helps ease the task of processing data for use in other applications by simplifying things like "handling loading, parsing, sorting, querying & manipulating data from all sorts of sources."

What's cool: Dataset can help you perform tasks ranging from pulling in data stored in a Google Spreadsheet to remotely polling a live data feed. You can add calculated columns on the fly as well as group and select data. The API is robust and the library is well-documented.

Dataset is part of the open-source Miso Project, backed by several well-known organizations likely to understand the importance of dependability and need to scale (such as British media outlet The Guardian) with funding from the Bill and Melissa Gates Foundation.

Drawbacks: The multiple capabilities of this library means that there are a number of functions to learn if you want to take full advantage. Note, too, that this is data I/O and manipulation only; you'll likely need other applications for sophisticated analysis and display.

Skill level: Power user to expert.

Examples: Interactive tree map of U.K government spending (also uses D3 and Backbone.js); line chart from remote data (also uses Highcharts).

Learn more: Tutorials on the Dataset website are a good place to start. For a brief case study on using Dataset and Google Spreadsheeets in production applications, see Google Docs + Miso-Powered Aps: a note on collaborative workflow by Daily Beast developer Michael Keller.