2-d: focus+context
DESCRIPTION
2-D: Focus+Context. cs5984: Information Visualization Chris North. Strategies. Detail only: detail without overview Zooming: detail becomes overview Transparency: detail on top of overview Overview+Detail: detail next to overview - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/1.jpg)
2-D: Focus+Context
cs5984: Information Visualization
Chris North
![Page 2: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/2.jpg)
Strategies
• Detail only: detail without overview• Zooming: detail becomes overview• Transparency: detail on top of overview• Overview+Detail: detail next to overview• Focus+Context: detail within overview
• Focus+Context:• “Distortion-oriented display”• “Fisheye”
![Page 3: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/3.jpg)
Wendy Schafer
• Moosburg
moosburg.cs.vt.edu
![Page 4: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/4.jpg)
Document Lens
• Robertson, “Document Lens”, p 562• priya, parool
![Page 5: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/5.jpg)
Bifocal Display
• Leung, “Bifocal displays”• alex, qiang
![Page 6: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/6.jpg)
Distortion Functions
• Mapping from info surface to display surface
f
Information surface Display surface
![Page 7: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/7.jpg)
Visual Transfer Functions
Information surface
Display surface
Identity function = normal flat overview
Bifocal
Information surface
Display surface
![Page 8: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/8.jpg)
Magnification Functions
1st Derivative
Bifocal
Information surface
Magnification
Information surface
Magnification
![Page 9: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/9.jpg)
Bifocal DisplayDisadvantage: 1 dimensional stretching on the 4 sides
Bifocal
![Page 10: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/10.jpg)
Perspective Wall / Document Lens
Perspective
Context gradually disappears
![Page 11: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/11.jpg)
NonLinear Magnification• http://www.cs.indiana.edu/hyplan/tkeahey/research/nlm/nlm.html
• http://www.cs.indiana.edu/hyplan/tkeahey/research/papers/infovis.98.html
![Page 12: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/12.jpg)
“Bubble”Disadvantage: local context highly de-magnified
Bubble
![Page 13: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/13.jpg)
“Fisheye”, “wide-angle lens”Disadvantage: no flat area
Wide-angle
![Page 14: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/14.jpg)
Focus+Context
• Bifocal
• Perspective
• Bubble
• Wide-angle
![Page 15: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/15.jpg)
Quiz: TableLens
• Bifocal!
![Page 16: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/16.jpg)
Fisheye Menus
• combination of perspective
![Page 17: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/17.jpg)
Calendar
• Leung
![Page 18: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/18.jpg)
Why not magnifying glass?
• Hides local context
![Page 19: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/19.jpg)
F+C vs. O+D• - distortion
• + smooth transition
• + more screen space efficient
• +easier layout
• - no flat overview, turn offf focus
• - eye swapping
• + higher zoom factor, higher scale
•+ really high scale with intermediates
•+ implementation (no math)
![Page 20: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/20.jpg)
Next Week
• Tues: Visual Overview Strategies• Stasko, “Information Mural”
» ben, ahmed
• Rayson, “Aggregate Towers”» anil, supriya
• Thurs: Multiple View Strategies• Chi, “Visualization Spreadsheet”
» mudita, abhi
• North, “Snap-Together Visualization”» varun, kumar
![Page 21: 2-D: Focus+Context](https://reader034.vdocument.in/reader034/viewer/2022051621/56814833550346895db55302/html5/thumbnails/21.jpg)
Assignment
• Homework 2 due today