Introduction to Information Visualization Robert Putnam putnambu edu

Introduction to Information Visualization Robert Putnam putnam@bu. edu Introduction to Information Visualization - Spring 2013

Outline Introduction / Definition History Examples Workflow / Pipeline Software overview Hands-on exercises Resources Introduction to Information Visualization - Spring 2013

“Sci vis” versus “Info vis” • Visualization: converting raw data to a form that is viewable and understandable to humans. • Scientific visualization: specifically concerned with data that has a well-defined representation in 2 D or 3 D space (e. g. , from simulation mesh or scanner). *Adapted from The Para. View Tutorial, Moreland Introduction to Information Visualization - Spring 2013

Information visualization • Information visualization: concerned with data that does not have a well-defined representation in 2 D or 3 D space (i. e. , “abstract data”). Introduction to Information Visualization - Spring 2013

Pre-history Important figures – William Playfair (1821) – line, bar charts, etc. – Charles Joseph Minard (1869) – Napoleon’s march, etc. – Jacques Bertin (1967) – theoretical basis for infographics – John Tukey (1977) – “exploratory data analysis” – Edward Tufte (1983) – statistical graphics standards/practices 1985 NSF Workshop on Scientific Visualization 1990: S. K. Card, et al. Readings in Information Visualization: Using Vision to Think Introduction to Information Visualization - Spring 2013

Examples Network visualization (vizster) Introduction to Information Visualization - Spring 2013

Examples Geo data mapping Demo Introduction to Information Visualization - Spring 2013

Examples Treemap Demo Introduction to Information Visualization - Spring 2013

Examples Circle chart Demo Introduction to Information Visualization - Spring 2013

Examples Population “Trendalyzer” Demo Introduction to Information Visualization - Spring 2013

Additional Examples NY Times words, words Visual Complexity (from book by Manuel Lima) 50 examples (from June 2009, somewhat dated) D 3 Gallery Introduction to Information Visualization - Spring 2013

Visualization components Color Size Texture Proximity Annotation Interactivity – Selection / Filtering – Zoom – Animation Introduction to Information Visualization - Spring 2013

Info vis workflow / pipeline* Acquire Parse Filter Mine Represent – Visual structure for data – View Refine Interact Introduction to Information Visualization - Spring 2013 * Adapted from Fry, Visualizing Data

Info vis workflow / pipeline Acquire [p. 7, Fry, Visualizing Data] Introduction to Information Visualization - Spring 2013

Info vis workflow / pipeline Parse [p. 8, Fry, Visualizing Data] Introduction to Information Visualization - Spring 2013

Info vis workflow / pipeline Filter/Mine Introduction to Information Visualization - Spring 2013 [p. 10, Fry, Visualizing Data]

Info vis workflow / pipeline Represent [p. 10, Fry, Visualizing Data] Introduction to Information Visualization - Spring 2013

Info vis workflow / pipeline Refine [p. 12, Fry, Visualizing Data] Introduction to Information Visualization - Spring 2013

Info vis workflow / pipeline Interact Demo Introduction to Information Visualization - Spring 2013 [p. 12, Fry, Visualizing Data]

Visualization software Host language (C/C++/Java/Python) plus Open. GL Stat/math package with graphics – R – MATLAB Special-purpose info viz software – Earth mapping, biological network visualization, etc. Browser-enabled graphics/info viz packages – Google Charts – Processing / Processing. js – D 3 – Java + Flash (becoming rarer) Introduction to Information Visualization - Spring 2013

Hands-on HTML intro* Google charts D 3 *Enabling software: - Java. Script: “the language** of the web” - JSON: Java. Script Object Notation - SVG: Scalable Vector Graphics - CSS: Cascading Style Sheets **currently Introduction to Information Visualization - Spring 2013

Resources Books – – – – Visual Complexity, Mapping Patterns of Information , Manuel Lima The Visual Display of Quantitative Information, Edward Tufte Information Visualization: Beyond the Horizon, Chaomei Chen Java. Script: The Definitive Guide, David Flanagan Getting Started with D 3, Mike Dewar Visualizing Data, Ben Fry Interactive Data Visualization for the Web, Scott Murray Websites – – – – http: //processingjs. org/ http: //d 3 js. org/, https: //github. com/mbostock/d 3/wiki/API-Reference http: //code. google. com/apis/ajax/playground/ http: //infosthetics. com/ http: //www. edwardtufte. com/tufte/ http: //www. visualcomplexity. com/ http: //www. webdesignerdepot. com/2009/06/50 -great-examples-of-data-visualization/ Introduction to Information Visualization - Spring 2013

Resources Conferences – 17 th International Conference: Information Visualisation, July 15 -18 2013, London Groups – d 3 -js (Google) – Greater Boston use. R Group (R Programming Language) – Local meetups (see www. meetup. com) Introduction to Information Visualization - Spring 2013

Questions? Tutorial survey: - http: //scv. bu. edu/survey/tutorial_evaluation. html Introduction to Information Visualization - Spring 2013