Lecture 8 2 Introduction to Data Visualization CMPT

  • Slides: 22
Download presentation
Lecture 8 -2: Introduction to Data Visualization CMPT 733, SPRING 2016 JIANNAN WANG INCORPORATING

Lecture 8 -2: Introduction to Data Visualization CMPT 733, SPRING 2016 JIANNAN WANG INCORPORATING NOTES FROM MICHAEL FRANKLIN AND DAVID TAYLOR

Outline Why Visualization? Principles of Visualization Design Visualization Toolkits 02/02/16 JIANNAN WANG - CMPT

Outline Why Visualization? Principles of Visualization Design Visualization Toolkits 02/02/16 JIANNAN WANG - CMPT 733 2

Why Visualization? Exploratory Data Analysis From: http: //www. qualia. hr/the-power-of-data-visualization-anscombes-story/ 02/02/16 JIANNAN WANG -

Why Visualization? Exploratory Data Analysis From: http: //www. qualia. hr/the-power-of-data-visualization-anscombes-story/ 02/02/16 JIANNAN WANG - CMPT 733 3

Why Visualization? Communication How to tell a good story about this dataset? Year Country

Why Visualization? Communication How to tell a good story about this dataset? Year Country Income Population Lifespan 1820 Canada 1159. 5 816, 000 39 1830 Canada 1312. 47 1, 169, 000 39. 05 … … … https: //www. youtube. com/watch? feature=player_embedded&v=jbk. SRLYSojo 02/02/16 JIANNAN WANG - CMPT 733 4

Outline Why Visualization? Principles of Visualization Design Visualization Toolkits 02/02/16 JIANNAN WANG - CMPT

Outline Why Visualization? Principles of Visualization Design Visualization Toolkits 02/02/16 JIANNAN WANG - CMPT 733 5

Motivation WTF Visualizations (http: //viz. wtf/) Without knowing the principles, you might make a

Motivation WTF Visualizations (http: //viz. wtf/) Without knowing the principles, you might make a lot of mistakes like this! 02/02/16 JIANNAN WANG - CMPT 733 6

Principle 1: Simplicity! Are you going to design Google. com like this? 02/02/16 JIANNAN

Principle 1: Simplicity! Are you going to design Google. com like this? 02/02/16 JIANNAN WANG - CMPT 733 7

Chart Design: Simplifying Example from Tim Bray 02/02/16 JIANNAN WANG - CMPT 733 8

Chart Design: Simplifying Example from Tim Bray 02/02/16 JIANNAN WANG - CMPT 733 8

Chart Design: Simplifying Example from Tim Bray 02/02/16 JIANNAN WANG - CMPT 733 9

Chart Design: Simplifying Example from Tim Bray 02/02/16 JIANNAN WANG - CMPT 733 9

Principle 1: Simplicity! Remove or not remove? ◦ Ask whether keeping an element reveals

Principle 1: Simplicity! Remove or not remove? ◦ Ask whether keeping an element reveals more information Still so many? ◦ Interactive Chart 02/02/16 USA JIANNAN WANG - CMPT 733 10

Principle 2: Understand Magnitudes Which one is brighter? (40, 40) 02/02/16 (30, 30) JIANNAN

Principle 2: Understand Magnitudes Which one is brighter? (40, 40) 02/02/16 (30, 30) JIANNAN WANG - CMPT 733 11

Principle 2: Understand Magnitudes Which one is longer? 02/02/16 4 3. 8 JIANNAN WANG

Principle 2: Understand Magnitudes Which one is longer? 02/02/16 4 3. 8 JIANNAN WANG - CMPT 733 12

Principle 2: Understand Magnitudes 02/02/16 JIANNAN WANG - CMPT 733 13

Principle 2: Understand Magnitudes 02/02/16 JIANNAN WANG - CMPT 733 13

Principle 3: Use Color Make your visualization look beautiful ◦ Colour Lovers: http: //www.

Principle 3: Use Color Make your visualization look beautiful ◦ Colour Lovers: http: //www. colourlovers. com 02/02/16 JIANNAN WANG - CMPT 733 14

Principle 3: Use Color Work for different kinds of data 02/02/16 JIANNAN WANG -

Principle 3: Use Color Work for different kinds of data 02/02/16 JIANNAN WANG - CMPT 733 15

Principle 4: Use Structure From http: //labs. juiceanalytics. com 02/02/16 JIANNAN WANG - CMPT

Principle 4: Use Structure From http: //labs. juiceanalytics. com 02/02/16 JIANNAN WANG - CMPT 733 16

Principle 4: Use Structure Correlation Visualization ◦ Consider a table with n=4 attributes 02/02/16

Principle 4: Use Structure Correlation Visualization ◦ Consider a table with n=4 attributes 02/02/16 JIANNAN WANG - CMPT 733 17

Principle 4: Use Structure Correlation Visualization ◦ Conduct a deeper analysis on each pair

Principle 4: Use Structure Correlation Visualization ◦ Conduct a deeper analysis on each pair of attributes 02/02/16 JIANNAN WANG - CMPT 733 18

Principle 4: Use Structure Correlation Visualization ◦ Conduct a deeper analysis on a single

Principle 4: Use Structure Correlation Visualization ◦ Conduct a deeper analysis on a single attribute 02/02/16 JIANNAN WANG - CMPT 733 19

Outline Why Visualization? Principles of Visualization Design Visualization Toolkits 02/02/16 JIANNAN WANG - CMPT

Outline Why Visualization? Principles of Visualization Design Visualization Toolkits 02/02/16 JIANNAN WANG - CMPT 733 20

Efficiency vs. Expressiveness Tools Efficiency Expressiveness Excel, Google Charts Tableau, ggplot 2 D 3,

Efficiency vs. Expressiveness Tools Efficiency Expressiveness Excel, Google Charts Tableau, ggplot 2 D 3, Vega Open. GL, Java 2 D 02/02/16 JIANNAN WANG - CMPT 733 21

Assignment 8 Part 2: Dynamic Visualization with D 3 ◦ Prerequisite: D 3 Basics

Assignment 8 Part 2: Dynamic Visualization with D 3 ◦ Prerequisite: D 3 Basics ◦ Task B. Dynamic Visualization using "transition" ◦ Task C. Dynamic Visualization using "selection. exit" ◦ Task D. Dynamic Visualization using "selection. on" ◦ Where To Go From Here (Optional) Deadline: 11: 59 pm, Mar 21 th http: //tiny. cc/cmpt 733 -sp 16 -a 8 02/02/16 JIANNAN WANG - CMPT 733 22