1
Interaction & Dynamic Queries 1
CS 7450 - Information VisualizationJanuary 29, 2004John Stasko
Spring 2004 CS 7450 2
Interaction
• How do you define “interactive”?
2
Spring 2004 CS 7450 3
Response Times
• .1 sec - animation, visual continuity, sliders
• 1 sec - system response, conversation break
• 10 sec - cognitive response
Spring 2004 CS 7450 4
Interaction - 3 Transformations
• Data (Primary Focus)− Selecting cases to show
• Visual− Selecting a different representation− UI controls for chart/graph/vis
• View− Selecting the perspective− Zoom, pan, ...
3
Spring 2004 CS 7450 5
Data Transformation
• Selecting what you want to see• What are some techniques?
Spring 2004 CS 7450 6
Example
www.digitalhistory.uh.edu/timeline/timeline.cfm
4
Spring 2004 CS 7450 7
Data Transformation
• Interaction forms:− Pop-up tooltips (bubble help)− Direct walk− (General) Brushing− Details-on-demand− Dynamic query− Histogram brushing
Spring 2004 CS 7450 8
Pop-up tooltips
• Hovering mouse cursor brings up details of item
5
Spring 2004 CS 7450 9
Direct Walk
• Linkages between cases
• Exploring one may lead to another
• Example:− Following hyperlinks
on web pages
Spring 2004 CS 7450 10
Brushing
• Applies when you have multiple views of the same data
• Selecting or highlighting a case in one view generates highlighting the case in the other views
• Very common technique in InfoVis
6
Spring 2004 CS 7450 11
Brushing
Sameitem
Spring 2004 CS 7450 12
Details-on-Demand
• May not be showing all the data due to scale problem− May be showing some abstraction of groups
of elements
• Expand set of data to show more details, perhaps individual cases
7
Spring 2004 CS 7450 13
Dynamic Query
• Probably most common technique• Let’s explore more details...
Spring 2004 CS 7450 14
DB Queries
• Query language− Select house-addressFrom atl-realty-dbWhere price >= 200,000 and
price <= 400,000 andbathrooms >= 3 andgarage == 2 andbedrooms >= 4
8
Spring 2004 CS 7450 15
DB Queries
• Pluses?
• Minuses?
Spring 2004 CS 7450 16
Typical Query Response
• 124 hits found− 1. 748 Oak St. - a beautiful …− 2. 623 Pine Ave. -− …
• 0 hits found
9
Spring 2004 CS 7450 17
Problems
• Must learn language• Only shows exact matches• Don’t know magnitude of results• No helpful context is shown• Reformulating to a new query can be slow• ...
Spring 2004 CS 7450 18
Dynamic Query
• Specifying a query brings immediate display of results
• Responsive interaction (< .1 sec) with data, concurrent presentation of solution
• “Fly through the data”, promote exploration, make it a much more “live” experience− Timesharing vs. batch
10
Spring 2004 CS 7450 19
Dynamic Query Constituents
• Visual representation of world of action including both the objects and actions
• Rapid, incremental and reversible actions• Selection by pointing (not typing)• Immediate and continuous display of
results
From: Ahlberg &Shneiderman,CHI ‘94
Spring 2004 CS 7450 20
Imperfection
• Idea at heart of Dynamic Query− There often simply isn’t one perfect response
to a query− Want to understand a set of tradeoffs and
choose some “best” compromise− You may learn more about your problem as
you explore
11
Spring 2004 CS 7450 21
Software Demo
• HomeFinder - Univ. of Maryland
Spring 2004 CS 7450 22
What Did We See?
• Interface− buttons− sliders (nominal --> ordinal)− alphasliders
12
Spring 2004 CS 7450 23
Query Controls
• Variable types− Binary nominal - Buttons− Nominal with low cardinality - Radio buttons− Ordinal, quantitative - sliders
Spring 2004 CS 7450 24
Alphaslider
A B C DEF G HI J K L M N OP QR S T UVW XYZ
Goldfinger
Currentselection
Slider thumb
Slider area Index
13
Spring 2004 CS 7450 25
Rangeslider
100
Low selectionthumb
Real data rangeHigh selectionthumb
0
Spring 2004 CS 7450 26
FilmFinder Video
14
Spring 2004 CS 7450 27
Spotfire
Currentassignment
Spring 2004 CS 7450 28
Spotfire Features
• Starfield display• Tight coupling
− features to guide the user− rapid, incremental, reversible interactions− display invariants− continuous display− progressive refinement− details on demand
15
Spring 2004 CS 7450 29
Nice Application
www.myrateplan.com/cellphones
Spring 2004 CS 7450 30
DQ Strengths
• ?
16
Spring 2004 CS 7450 31
DQ Strengths
• Work is faster• Promote reversing, undo, exploration• Very natural interaction• Shows the data
Spring 2004 CS 7450 32
DQ Weaknesses
• ?
17
Spring 2004 CS 7450 33
DQ Weakness
• Can you formulate an arbitrary booleanexpression?− !(A1 V A2) ^ A3 V (A4 V A5 ^ A6) V …
• But do people really do this often?
Spring 2004 CS 7450 34
DQ Weakness
• Controls take space!− How much in Spotfire?
• Put data in controls...
18
Spring 2004 CS 7450 35
Data Visualization Sliders
Low selectionthumb
Data distribution
High selectionthumb
From: Eick, UIST ‘94
Spring 2004 CS 7450 36
Drawing Queries
Query Sketch
You specify a timelinequery by drawing a rough pattern for it, thesystem brings back nearmatches User-drawn query
ResponsesM. Wattenberg, CHI ‘01
19
Spring 2004 CS 7450 37
DQ Weakness
• As data set gets larger, real-time interaction becomes increasingly difficult
• Storage - Data structures− linear array− grid file− quad, k-d trees− bit vectors
Spring 2004 CS 7450 38
Brushing Histograms
• Special case of brushing• Data values represented in histograms
that can be clicked on and selected (controls region)
• When items selected there, the corresponding item(s) are highlighted in main view windows
20
Spring 2004 CS 7450 39
BH Example
DataMaps
Maryland&Va Tech
Spring 2004 CS 7450 40
DQ vs. BH
• Empirical Study− Use DataMaps, a geographic (US states) data
visualization tool− Have participants do different tasks with both
methodsHow many states have pop between x and y in 1970?Given 3 states, which has the lowest median income?What’s the relationship between education and income?List states with pops. 0->x and y->z.What kind of a state is Florida?
Q. Li & C. North, InfoVis ‘03
Demo
21
Spring 2004 CS 7450 41
Findings
• Brushing histograms better and more highly rated for more complex discovery tasks− Attribute correlation, compare, and trend
evaluation
• Dynamic queries better for more simple range specification tasks− Single range, multiple ranges, multiple criteria
Functioned more as its owninfovis tool
Functioned more as auxiliary control for other vizs
Spring 2004 CS 7450 42
Case Study
Attribute Explorer
Video
22
Spring 2004 CS 7450 43
Fundamental Idea
• Show all the data, use different displays for different variables
• Use brushing so that interaction with one view highlights selections in others
Spring 2004 CS 7450 44
DQ vs. BH
• Fundamental Differences:− BH highlights data of interest;
DQ filters unwanted data− DQ does single range query;
BH allows multiple ranges− DQ users interact with the query (low,hi);
BH users interact directly with data− DQ visualizes query formulation (1 way);
BH displays query results too (I/O)
Li & North, ‘03
23
Spring 2004 CS 7450 45
Case Study - SDM
• Developed at CMU• Limitations of static visuals
− Unable to focus on different objects with context
− Clutter and object occlusion− Objects are dwarfed in the scale for the entire
data set− Fail to classify object sets− Difficult to compare quantities which are not
spatially contiguousChuah et al, UIST ‘95
Spring 2004 CS 7450 46
System in Action
Video
24
Spring 2004 CS 7450 47
What We Saw
Object handles Maintain context: Body and shell
Viewing occluded objects Interactive augmentation
Spring 2004 CS 7450 48
Interaction
• More to come...
25
Spring 2004 CS 7450 49
Upcoming
• Interaction and Dynamic Queries 2− Reading
Chapter 5 againFishkin & Stone
• Time Series data• HW3 due in a week
Spring 2004 CS 7450 50
Sources Used
• Spence, CMS books• Shneiderman; Ahlberg et al; Chuah et al;
Tweedie et al articles• Chiu & Wang F99 slides
26
Spring 2004 CS 7450 51
Extras
• Additional information
Spring 2004 CS 7450 52
SDM Components
• Object-centered selection• Dynamic and flexible operations
• SDM handles
• Objects constraints and feedback techniques• Context persistence• Set-wide operations
27
Spring 2004 CS 7450 53
Advantages
• ?
Spring 2004 CS 7450 54
Advantages
• Focus and context• View occluded objects• View different object sets in different scales• Visualization is not part of the underlying data• Compare the widths and heights of objects at a
distance
28
Spring 2004 CS 7450 55
Disadvantages
• ?
Spring 2004 CS 7450 56
Disadvantages
• Object manipulation causes occlusion• Users cannot operate on parts of objects• With limited scope, certain objects are occluded
by the focus of objects • Changing the width/height can blur the linear
relationships between objects
Top Related