1. Information Visualization Main Concepts and Techniques Silvia Batraneanu MSPAS 2009

2. Reference model for visualization

3. Data Types Nominal  Equal or not equal than others, order does not matter Ordinal  Order is important, they can form ordered sets or tuples Numerical  can do arithmetic operations on them  spatial, geophysical, temporal

4. Data Transformations Involves loss (filter, aggregation) or gain (revealing another aspect) of information New values can be derived:  Mathematical operations: sum  Statistical operations: mean The data type can change:  Numerical -->Ordinal : classing  Nominal --> Ordinal : sorting

5. Data Tables Structured information ready to be mapped to visual structures. We know : the number of attributes  dimensionality the types of the attributes

6. Visual Structures Spatial substrate – perceptually dominant  Main aspect : axes  Types of axes: nominal, ordinal, quantitative Marks(glyphs)  4 elementary types:points, lines, areas, volumes  Take up space Marks’s graphical properties  Spatial : size, orientation  Object related: Grayscale, Color, Texture, Shape  Some are more effective than others

7. Visual Mapping Example - FilmFinder Interactive controls Ratings --> Oy FilmType->Nx Scatterplot Year  Qx Popularity  Qy. FilmId  P(Year, Popularity) FilmID(FilmType) -> P(Color)

8. Encoding more information with spatial position Composition Alignment Folding Recursion Overloading

9. Alignment Repetition of the axes at a different position in space

10. Folding Continuation of the axis in an orthogonal dimension

11. Recursion Repeated subdivision of space

12. Trees – using connectivy Cone tree Classical representation Tree view

13. Trees – using enclosure Treemap

14. Networks The most complex data structures that need to be visualized Used to describe telecom and computer networks, World Wide Web Contains cycles  sole encoding technique : connectivity Graphs containing just tens of nodes tend to look like a ball of tangled strings  map clutter

15. Important aspects in visualizing networks Positioning the nodes  key to readability  Geographical position: SeeNet  Graphical layout algorithms : mininization of link crossing  Advanced iterative positioning algorithms : spring embedder, planar straight line embedding Managing the links so they convey information  Color the links according to type or utilization: SemNet  Select a link subset with the help of interactive sliders: SeeNet  Represent a pair of directed arcs as a single arc: SeeNet Handling large-scale graphs -> uses some form of aggregation  Hierarchical clustering : SemNet  Geographical clustering: SeeNet  Clustering based on natural hierarchy : software systems Interacting with and navigating through large networks  Levels of detail can enable nonuniform and interactively progressive aggregation

16. SeeNet Efficient display Map clutter Call volume aggregation Grouping two links into one

17. Spring embedding Before After Narcissus

18. Using 3D: Pros and Cons Pros: more effective for 3D physical data additional dimension for encoding data can accommodate large-scale visual structures Cons: greater implementation challenges: shading, lighting, navigation, occlusion significantly more processing power

19. View transformations Location probes  Details on demand  Brushing  Magic lenses Viewpoint controls  Zoom, pan, clip  Overview+detail Distorsions (Focus+Context)  Bifocal : Perspective Wall, Document Lens  Polyfocal : Table Lens  Based on levels of interest: Fish Eye Lens Levels of Detail

20. Details on Demand Popup windowsAdjacent frames

21. Brushing

22. Magic lens

23. Overview + detail

24. Distorsion Monofocal BifocalPolyfocal Fisheye Representation space Distorted space Transfer function Magnification function

25. Bifocal view – Perspective wall

26. Bifocal view – Document Lens

27. Polyfocal view –Table lens

28. Fish-eye lens Normal view Distorted view

29. Levels of Detail

30. Overview+detail vs. Focus+Context Overview+detail  Simple to implement and understand  Operators need to shift attention between the two windows  Typical zoom: 5-15 scaling to 1000 with intermediate views Focus+context  Harder to implement and understand  Effective if critical features remain undistorted  Keeps overview and details visible at all times  Typical zoom: 2-5

31. Interaction  Changes the process of understanding data  Allows the user to explore more possibilities in a given time  Has to be sufficiently fast to be efficient

32. Time and Interaction  Three levels of interaction  Finest level – psychological moment – 0.1 s Stimuli fuse in a single percept Animation breaks down if longer than 10 frames/second.  Intermediate level – unprepared response – 1s The user has a minimum of time to respond  Coarsest level – unit task –about 10 sec Can do a minimal unit of cognitive work  Animation must be slowed down in some cases  Interactive visualization systems need scheduling mechanisms

33. Interacting with Data Transformations Dynamic Queries  Uses interactive controls to filter data Direct Walk  Navigates from record to record through linking ->Web browser Details On Demand Attribute Walk  Searches for objects with similar properties as a selected one Brushing

34. Interacting with Visual Mappings Data Flow  Uses explicit node-link diagram to represent the mappings Pivot tables  Lets the user rapidly manipulate the mapping of data to rows and collumns

35. Interacting with View Transformations Direct selection Camera movement Magic lens Overview+detail Zooming

36. Visualization levels of use InfosphereInformation workspace Visually enhanced objects Visual knowledge tools

37. We learned about.. The different phases in the information visualization process Improving the use of space and displaying more variables Displaying complex structures such as trees and networks The main visual transformations Interacting with a visualization system

38. Bibliography “Readings in information visualization: Using vision to think”, S.K. Card, J.D. MacKinlay, B. Schneiderman, 1999, Morgan Kaufmann Publishers “Information Visualization: Beyond the horizon”, 2nd ed, Chaomei Chen, Springer “Information Visualization”, Robert Spence, 2000, Addison-Wesley http://www.infovis-wiki.net/ IEEE Information Visualization Conference http://vis.computer.org/ http://vis.computer.org/

39. Advanced real-time visualization system for ATLAS TDAQ networks

40. ATLAS TDAQ system Selects interesting events coming out of the ATLAS detector: 64 TBytes/s  tens of Mytes/s Uses a three layer trigger architecture Uses three distinct switched Ethernet networks  Data FrontEnd  Data BackEnd  Control The three networks total over 4000 ports, 2500 PCs, 200 edge switches and 5 chassis core switches

41. ATLAS-Specific Visualization Requirements A comprehensive monitoring system provides large amounts of data -> what data to present to who and how Three types of consumer groups:  Networking experts  System analists  Operators The ideal visualization system would:  Follow the system architecture and its data flow  Display both traffic and status info in real-time  Allow efficient navigation so as not to lose the big picture Available 2D display solutions have proven to be very limited

42. 3D visualization system Chose 3D because it can cope better with large scale models Profited from recent advances: levels-of-detail, fly-through navigation, proximity sensors etc Used X3D standard:  Can be extended through prototypes  Has an external Scene Access Interface  Chosen X3D browser : Octaga Player Modeled a hierarchical 3D model for the TDAQ system

43. Hierarchical 3D model Top layer  Overall picture at a glance  Contains processor farms and network cores Middle layer  Contains processors and edge switches grouped by functionality Bottom layer  Contains individual ports and their associated traffic statistics and plots

44. Port level view Ox  time (last 5 intervals) Oy  traffic (top) and errors (bottom) Color  traffic state( Critical, Stressed, Normal) Uses both alignment and recursion Details on Demand (additional port info, traffic plots)

45. Device level view Control switch Data switch Processor Each device displays: Traffic panels Overall status light – its state/color is a result of statistics aggregation Used different colors to distinguish data and control networks

46. Farm level view Each rack has: Multiple processors A data switch (top) A control switch (bottom) Due to natural aggregation at the rack level, we were able to use proximity instead of connectivity  eliminated map clutter WALK navigation is used inside a farm

47. Top level view Uses connectivity to display the relationships between subsystems Shape differentiates the subsystems:  Boxes  Farm processors  Cylinders  Network Cores Color differentiates the networks:  Yellow : Data Front End  Red: Data BackEnd  Green:Control Uses FLY navigation

48. Important characteristics Uses a prototype for each object type  scene automation and expansion Refreshes the scene at 30 seconds Uses levels of details to be able to render the model Combines FLY and WALK navigation types with proximity sensors to accomplish smooth fly- through navigation