Information Visualiation:Trees

Chris North

cs3724: HCI

Presentations

• brian ward• juan vera

• Vote: UI Hall of Fame/Shame?

Next

• Thurs: Demo day• Proj 2, initial implementation, 1 page

• McBryde 102, 2-5pm

• Apr 4: Proj 2, final implementation

Presentations: UI critique or HW2 results

• Next Tues: dan constantin, grant underwood, mike gordon (topo)

• Next Thurs: matt ketner, sam altman

Midterm

• Avg = 80.5• 1

• Performance time• Learning time• Error rates/ error recovery time• Retention time• Subjective satisfaction

• 2: users + tasks• 4: ov, z&f, dod• 5: c• 9: time = c1+c2*log2 2(distance/size)• 10

• Map: know geography, multi-select regions• Menu: list alphabetic, don’t know geography, name• Command line: type 2 letter abbrev, experts, • Scaterplot: trends census , balance tradeooffs• Excell: min max

Review

• 3 steps in animation loop1. update state

2. repaint

3. sleep

• What is a thread?lightweight separate process

Review

• 1D and 2D spaces• 1D: timelines, text

• 2D: maps, pictures

• 4 approaches for navigating large spaces?• detail only

• zoom

• focus+context: detail area inside the overview

• overview+detail: 2 windows

Trees (Hierarchies)

• What is a tree?• DAG, one parent per node

• Data structure: parent ptr, array of children, LM child+RS

• Size: #nodes = bheight

• Examples:• file systems, org charts, web sites, decision trees, geneology,

libraryies dewey decimal, …

• Tasks:• find, browse, ordered lists, properties

• Parent, ancestors, descendents, paths

Detail Only

• Dos: tree

TreeView Widget

• Good for directed search tasks

• Not good for learning structure

• No attributes

• Apx 50 items visible

• Lose path to root for deep nodes

• Scroll bar!

• Error rate high

• Fitt’s Law?• Too many small distant things

Mac Finder

Overview+Detail

• Maryland

Focus+Context

• Hyperbolic Tree (star tree)• Radial; shrink with distance to center

• Drag to navigate

• Fitt’s Law?• Scale 100 + structure

• Xerox PARC, Inxight• http://startree.inxight.com/

Miniaturization

• Disk Tree• Xerox PARC

3D• ConeTrees

• Rotate subtrees

• Pro:• more space

• natural, increase retention

• Con:• Occlusion

• Mismatch for i/o devices

• Xerox PARC

Ugh!

2 Approaches

• Connection• node & link

• E.g. TreeView widget

• Containment• node in node

• E.g. Venn diagram

A

CB

A

B C

Zooming

• TreeMaps• Slice and Dice, space filling

• Node size & color encodes data attribute

• Zoom on subtrees

• Good for fixed-height trees

• Scale: 1000

• Maryland• http://www.cs.umd.edu/hcil/treemap3/

• “Squarified” TreeMap• http://www.research.microsoft.com/~masmith/all_map.jpg

Cushion TreeMaps

• Cushion TreeMaps• Free file directory browser

• Van Wijk • http://www.win.tue.nl/sequoiaview/

• Map of the Market• http://www.smartmoney.com/marketmap/

Radial Containment

• SunBurst• Radial slicing

• Animated zooming

• Focus+Context

• Georgia Tech

Sunburst vs. Treemap

• + Faster learning time: like pie chart• + Details outward, instead of inward• + Focus+context zooming

• - Not space filling• - More space used by non-leaves

• All leaves on 1-D space, perimeter• Treemap: 2-D space for leaves

• - Smaller scale?

Multiple Foci?

• Focus on 2 distant regions simultaneously• Microsoft Research