240 likes | 411 Views
Introduction to Information Visualization. Robert Putnam putnam@bu.edu. Introduction to Information Visualization - Fall 2013. Outline. Introduction / Definition History Examples Workflow / Pipeline Software overview Hands-on exercises Resources.
E N D
Introduction to Information Visualization Robert Putnam putnam@bu.edu Introduction to Information Visualization - Fall 2013
Outline • Introduction / Definition • History • Examples • Workflow / Pipeline • Software overview • Hands-on exercises • Resources Introduction to Information Visualization - Fall 2013
“Scivis” 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 2D or 3D space (e.g., from simulation mesh or scanner). *Adaptedfrom The ParaView Tutorial, Moreland Introduction to Information Visualization - Fall 2013
Information visualization • Information visualization: concerned with data that does not have a well-defined representation in 2D or 3D space (i.e., “abstract data”). Introduction to Information Visualization - Fall 2013
Pre-history • Selected figures • William Playfair (1821) – line, bar charts, etc. • Charles Joseph Minard (1869) – Napoleon’s march, etc. • Jacques Bertin (1967) – “semiology of graphics” • 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 - Fall 2013
Examples • Network visualization (vizster) Introduction to Information Visualization - Fall 2013
Examples • Geo data mapping • Demo Introduction to Information Visualization - Fall 2013
Examples • Treemap • Demo Introduction to Information Visualization - Fall 2013
Examples • Circle chart • Demo Introduction to Information Visualization - Fall 2013
Examples • Population “Trendalyzer” • Demo Introduction to Information Visualization - Fall 2013
Additional Examples • NY Times words, words, numbers • Visual Complexity (from book by Manuel Lima) • 50 examples (from June 2009, somewhat dated) • D3 Gallery Introduction to Information Visualization - Fall 2013
Visualization components • Color • Size • Texture • Proximity • Annotation • Interactivity • Selection / Filtering • Zoom • Animation Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline* • Acquire • Parse • Filter • Mine • Represent • Refine • Interact * Adapted from Fry, Visualizing Data Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline • Acquire [p. 7, Fry, Visualizing Data] Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline • Parse [p. 8, Fry, Visualizing Data] Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline • Filter/Mine [p. 10, Fry, Visualizing Data] Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline • Represent [p. 10, Fry, Visualizing Data] Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline • Refine [p. 12, Fry, Visualizing Data] Introduction to Information Visualization - Fall 2013
Info vis workflow / pipeline • Interact • Demo [p. 12, Fry, Visualizing Data] Introduction to Information Visualization - Fall 2013
Visualization software • Host language (C/C++/Java/Python) plus OpenGL • 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 • D3 • Java + Flash (becoming rarer) Introduction to Information Visualization - Fall 2013
Hands-on • HTML intro* • Google charts • D3 *Enabling software: - JavaScript: “the language** of the web” - JSON: JavaScript Object Notation - SVG: Scalable Vector Graphics - CSS: Cascading Style Sheets **currently Introduction to Information Visualization - Fall 2013
Resources • Books • Visual Complexity, Mapping Patterns of Information , Manuel Lima • The Visual Display of Quantitative Information, Edward Tufte • Information Visualization: Beyond the Horizon, ChaomeiChen • JavaScript: The Definitive Guide, David Flanagan • Getting Started with D3, Mike Dewar • Visualizing Data, Ben Fry • Interactive Data Visualization for the Web, Scott Murray • Websites • http://processingjs.org/ • http://d3js.org/, https://github.com/mbostock/d3/wiki/API-Reference • http://code.google.com/apis/ajax/playground/ • 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 - Fall 2013
Resources • Web sites (cont.) • http://fellinlovewithdata.com/ • http://infosthetics.com/ • http://visual.ly/ • Conferences • 17thInternational Conference: Information Visualisation, July 15-18 2013, London • IEEE VIS 2013, October 13-18, Atlanta • Groups • d3-js (Google) • Greater Boston useR Group (R Programming Language) • Local meetups (see www.meetup.com) Introduction to Information Visualization - Fall 2013
Questions? • Tutorial survey: - http://scv.bu.edu/survey/tutorial_evaluation.html Introduction to Information Visualization - Fall 2013