Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Data Visualization Tools for the Web

Data Visualization Tools for the Web

The 3rd in a three part series outlining the basic tools to get started with data visualization for the web. This talk will focus on using Google Refine to manipulate data and d3 to generate some impressive visualizations with minimal effort.


May 24, 2013

More Decks by Kristian

Other Decks in Programming


  1. Topics • Quick synopsis of previous workshops • Introduction to

    some new toolkits ◦ Google Refine for data manipulation ◦ jsFiddle for development playground ◦ d3 Javascript library for interactivity • Survey of other popular tools
  2. Previous Workshops Part 1 : • Used a clean pre-formatted

    dataset • Imported and used stock Google Fusion charts and maps Part 2 : • Used a custom data set • Explored network graph in Gephi
  3. The Next Steps • Limitations • Google Fusion Tables /

    Charts ◦ If data does not meet strict format, tough to import ◦ Limited visualization options • Gephi ◦ Hundreds of knobs and switches, complex ◦ Results are confined to a local application
  4. Web Visualization Trends • Shift away from Flash / Flex

    / Actionscript • Movement towards HTML5/CSS3/Javascript • Javascript libraries can compete with Flash ◦ Raphael ◦ Processing.js ◦ d3
  5. Enough talk, lets do something! • Sounds good - First,

    lets clean up a data set • Google Refine ◦ Tool to clean up data ◦ De-duplication, mass change operations ◦ Facet, Pivot, Clustering ◦ Powerful export options, JSON templates • Tutorial url - http://bit.ly/124JB1J
  6. JSON is the dominant data format • What do I

    need to know about JSON? ◦ Human readable, plain text, lightweight ◦ Consists of name / value text pairs Sample: { "I am a name" : "I am a value", "Also a name" : 1234, "More stuff " : { "nested name" : "nested value", "also nested" : "another value" } }
  7. All done with data. Cool stuff yet? • Bummer -

    Custom programming is hard • Bonus - People have done the heavy lifting • We will hack, borrow and steal for now to get our chops up to speed • What looks cool?
  8. Resources Excellent series of tutorials for beginners UC Berkeley Graduate

    School of Journalism http://multimedia.journalism.berkeley.edu/tutorials/cat/data D3 repository of charts http://nvd3.org/