Data Visualization Tools for the Web Kristian Allen Programmer - UCLA Digital Library 

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 

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 

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 

Web Visualization Trends ● Shift away from Flash / Flex / Actionscript ● Movement towards HTML5/CSS3/Javascript ● Javascript libraries can compete with Flash ○ Raphael ○ Processing.js ○ d3 

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 

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" } } 

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? 

Questions? Further topics? Google Refine, data manipulation? Programming series of workshops? Bring your own dataset, hackathon? 

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/