d3 Drillable Bar Charts

A couple weeks back I began tinkering with interactive bar charts using the d3 javascript charting toolkit. d3 stands for Data Driven Documents, and is the latest from the great Mike Bostock, former developer of Protovis, another great charting tool.

Anyhow, one of the samples on the d3 site used a drillable bar chart, where users can start at an aggregate level and then dig into the details by clicking on a given bar – a simple concept that is beautiful when d3 is the platform.

This has led me to my first chart, with more to come. The initial example looks at home runs by team for the 1995-2010 seasons, and begins at the season level. Once a season is selected, we drill into homers at the team level, and then at the individual batter level. It's fast, intuitive, and a heck of a lot more esthetically pleasing than your typical report output from any one of dozens of high-powered reporting tools.

d3 Bar Chart

To see it in action, click here


FacebooktwitterredditpinterestlinkedinmailFacebooktwitterredditpinterestlinkedinmailby feather
FacebooktwitterlinkedinrssFacebooktwitterlinkedinrssby feather


Ken Cherven is the Founder and Curator of the Visual-Baseball.com website. He loves to merge baseball data with all sorts of visualization methods - charts, network graphs, maps, etc. to provide greater insight into underlying data patterns. Ken also authors books about baseball and visualization, and loves to listen to jazz while drinking some wine, craft beer, or bourbon.