hypervariate data visualization · • provide (initial ideas of) data source and format of the...

INFOVIS8803DV > SPRING 18

HYPERVARIATE DATA VISUALIZATION

Prof. Rahul C. BasoleCS/MGT 8803-DV > February 5, 2018


Hypervariate Data (n > 3)

• Many well-known visualization techniques exist for datasets of 1-3 dimensions. We have discussed them throughout the semester.

• But what about data sets with more than 3 variables (n>3)?

– These are often the interesting & challenging ones– Many problems are of low-dimensional hypervariate nature (4-20)– How would one visualize such data?


Consider the following Design Challenge

• Data set of 500 cases

• Attributes– 5 quantitative– 4 nominal– 2 ordinal

• Design a visual representation


Here is one crazy idea …

• Use a Spreadsheet– Each variable is positioned into a column– Data cases are rows– This is a projection (mapping)


… or we can use Multiple Views

A B C D E

Case 1

Case 2

Case 3

Case 4

Give each variable its own display.

A B C D E

1 4 1 8 3 5

2 6 3 4 2 1

3 5 7 2 4 3

4 2 6 3 1 5


Scatterplot Matrix (n>3)

Represent each possible pair of variables in their own 2D scatterplot. Good if pairwise correlation is key.


But what if we want to handle all datasets generically?


Recall: Use Iconic Representations

• Glyph (graphical object) represents a data case • Visual properties of glyph represent different variables


Chernoff Face (n>3)

Encode different variables’ values in characteristics of human face

n=11

Herman Chernoff (1973). "The Use of Faces to Represent Points in K-Dimensional Space Graphically". Journal of the American Statistical Association, 68 (342): 361–368.


http://flowingdata.com/2010/08/31/how-to-visualize-data-with-cartoonish-faces/crime-chernoff-faces-by-state-edited-2/


Star Plots (n>3)


Small Multiples of Star Plots

https://andrewpwheeler.files.wordpress.com/2012/03/infographic_star_plots.png


Glyphs (n > 3)

• Think of them as generalizations of star charts and Chernoff faces.• A “mark” – a shape or form – that can be varied in n ways.

12 variables can be encoded – 4 angles, 4 lengths, 4 thicknesses


Examples of Multivariate Glyphs


Criticisms of Data Glyphs

One of the most common criticisms of data glyphs is that there is an implicit bias in most mappings, i.e., some attributes or relationships between attributes are easier to perceive than others.

• Perception-Based Bias• Proximity-Based Bias• Grouping-Based Bias


Let’s return to our beloved Spreadsheet …

What happens if we had 10s of columns and 100s of rows?How would you make the text more visual or symbolic?


Table Lens

Idea: • Make the text more visual and symbolic • Just leverage basic bar chart idea • Change quantitative values to bars • What about nominal data?

http://www.open-video.org/details.php?videoid=8304

https://www.youtube.com/watch?v=ZDY9YCYv7z8


LineUp

https://www.youtube.com/watch?v=iFqCBI4T8ks http://caleydo.org/tools/lineup/https://lineup.caleydoapp.org/


What about Categorical Data?

• How about multivariate categorical data?

• Students– Gender: Female, male– Eye color: Brown, blue, green, hazel– Hair color: Black, red, brown, blonde, gray– Home country: USA, China, Italy, India, ...


Mosaic Plot


Parallel Coordinates

Brushable http://bl.ocks.org/mbostock/1341021)Reorderable Axes http://bl.ocks.org/jasondavies/1341281http://www.parallelcoordinates.de/

http://bl.ocks.org/mbostock/1341021

http://bl.ocks.org/jasondavies/1341281


Making Sense of Parallel Coordinates


Pixel Displays

• Represent data case or a variable as a pixel (or as a small glyph such as a circle) – Million or more per display– Seems to rely on use of color– Can pack lots in

• Challenge: What’s the layout? What does position mean?


One representation

• Grouping arrangement • One pixel per variable • Each data case has its own small rectangular icon • Plot out variables for data point in that icon using a grid or spiral

layout


Illustration

Levkowitz Vis ‘91


Unit Visualization

Sand Dance

https://sanddance.azurewebsites.net/BeachPartyApp/BeachPartyApp.htmlhttps://www.youtube.com/watch?v=15Hns2igiag

https://sanddance.azurewebsites.net/BeachPartyApp/BeachPartyApp.html

https://www.youtube.com/watch?v=15Hns2igiag


Unit Visualization

docplot


Another Metaphor

Dust-and-Magnet

• Iron bits (data) are drawn toward magnets (attributes) proportional to that data element’s value in that attribute

• Higher values attracted more strongly

• All magnets present on display affect position of all dust

• Individual power of magnets can be changed

• Dust’s color and size can connected to attributes as well


Another Metaphor

Dust-and-Magnet (Go Big)

https://www.cc.gatech.edu/gvu/ii/dnm/dustnmagnet-16Hub.mp4


Design Exercise

• Pair Up.• Visualize the data using any of the techniques we discussed in class.• Use colored pencils if needed.• Be prepared to discuss/present why you chose a particular technique

and how you encoded it.• Be creative.

Name XONE PS4 PC Gamespot Meta Critic New Price Used Price Genre

Titanfall 2 Yes Yes Yes 9 85 24.99 30.99 Action

Forza Horizon Yes No Yes 9 86 38.45 47.49 Sports

FIFA 17 Yes Yes Yes 9 84 34.89 33.95 Sports

Raven’s Cry Yes Yes Yes 1 27 11.99 0.05 Strategy

Gravity Rush No Yes No 8 -- 58.99 49.99 Action

Civilization VI No No Yes 9 88 41.40 19.99 Strategy

http://www.gamespot.com/


Set Data & Operations

• Large set of items, each can be in one or more sets• How do we visually represent the set membership?


Standard Technique

Venn Diagram

Contains all possible zones of overlap


http://www.conceptdraw.com/solution-park/diagram-venn


Euler Diagram

Only contains zones that exist


OnSet

https://www.cc.gatech.edu/gvu/ii/setvis/onset/index.html


Reminder -- PM2: Description

• Prepare a project description. • Create a two-page pdf document listing project members and

topic/data to be addressed. • Provide (initial ideas of) data source and format of the data

(spreadsheet, SQL database, etc.). • Provide a characterization of your target user. • Describe 3 or 4 questions/tasks that users of your system should be

able to investigate/answer. • Provide a sketch of your possible

• Submit a single pdf document on Canvas.

hypervariate data visualization · • provide (initial ideas of) data source and format of the...

Documents