• Abstract and Figures
• Public Full-text

Interactive Visualization of Graphs on Multiple Levels of Detail Using a Direct-Touch Interactive Graphics Device Fajran Iman Rusadi 7th August 2009 Student number: 5781574 E-mail address: [email protected] Grid Computing | Master's Thesis Supervisor: Dr. R.G. Belleman ii Interactive Visualization of Graphs on Multiple Levels of Detail Using a Direct-Touch Interactive Graphics Device Master's Thesis (Afstudeerscriptie) written by Fajran Iman Rusadi under the supervision of Dr. R.G. Belleman, and submitted in partial fulfilment of the requirements for the degree of MSc in Grid Computing at the Universiteit van Amsterdam. Date of the public defence: Members of the Thesis Committee: 26th August 2009 Dr. R.G. Belleman Prof. C.R. Jesshope, PhD Dr. I. Bethke ii Abstract Graph visualization deals with the issues of graph representation and layout: how to draw the nodes and edges and where to place the nodes or bend the edges. These issues become more complex as the size of the graph increases. Graph simplification can be used to handle the problem. Recursive graph clustering is one of the simpli- fication method that works by transforming a graph into a hierarchical graphs. This kind of graphs can be visualized using a multiple levels of detail approach that allows users to not only see the overview of the graph but also see the more detailed view version. Interactions from users are needed to enable that exploration. A multi-touch table is used as an interaction device to help create an intuitive and easy to use user interface that can support effective visualization and interaction. It allows users to perform a direct-touch interaction with the visualization system. A multi-touch interactive visualization of graphs application is created. It is de- signed to be able to handle large graphs using approaches mentioned earlier. To evaluate the application, a performance test and a multiple levels of detail visualiza- tion of a graph are performed. i ii Contents Abstract i Contents iii Acknowledgements v 1 Introduction 1 1.1 Graph Visualization . 1 1.2 Graph Complexity Reduction . 1 1.3 Interactive Visualization . 2 1.4 Interaction Device . 3 1.5 Motivation and Goal . 3 1.6 Overview of This Thesis . 4 2 Interactive Graph Visualization 5 2.1 Graph Drawing . 5 2.2 Challenges in Graph Visualization . 5 2.3 Related Work . 7 2.3.1 Automatic Graph Layout Algorithms . 7 2.3.2 Graph Simplification . 8 2.3.3 Multiple Levels of Detail . 9 2.3.4 Interactive Graph Visualization Environments . 11 2.4 Summary . 12 3 Application Requirements 13 3.1 Visualizing Large Graphs . 13 3.2 User Interaction . 13 3.3 Summary . 14 4 Technology Selection 15 4.1 Accelerated Graphics . 15 4.1.1 Scene Graph . 15 4.2 Multi-Touch Table . 16 4.2.1 Multi-Touch Application . 17 4.3 Graph Data Structure . 18 5 Implementation 19 5.1 Application Architecture . 19 5.1.1 Multi-Touch Event Handling . 20 5.1.2 Interaction Modes . 21 5.2 Hierarchical Graph Creation . 21 5.2.1 Hierarchical Graph in Tulip . 22 5.2.2 Scene Graph Construction of Hierarchical Graph . 23 5.3 Iconic Representation of Cluster . 24 5.4 Multiple Levels of Detail Representation . 24 5.5 Graph Layout and Interaction . 27 5.6 Animated Transition . 27 5.7 Interaction Tools . 28 5.7.1 Node Position Manipulation . 28 iii CONTENTS 5.7.2 Multiple Node Selection . 28 5.8 User Interface . 28 5.8.1 Declarative User Interface . 29 5.8.2 Command Bar and Contextual Menu . 29 5.9 Search Facility . 30 6 Result 31 6.1 Performance Evaluation . 31 6.1.1 Startup Time . 31 6.1.2 Frame Rate . 31 6.2 Information Visualization Paper Collaboration Graph . 33 6.3 Search Feature . 36 7 Summary 39 7.1 Future Work . 40 Bibliography 41 iv Acknowledgements I would like to thank Dr. Robert Belleman for all his supervision, advice, and en- couragement. Thanks for giving me a chance to play with a very interesting device, a multi-touch table. To Laurence Muller who introduced me to something that I never expected before, multi-touch application programming. Also to Paul Melis for all his supports during the project. I would also like to thank the very important people in my life, my family, espe- cially my mom and dad. Thank you for all of your support, motivation, love, and thought of me in your prayers. Many thanks also go to Depkominfo for making my dreams come true. To all my Indonesian friends here in Amsterdam who always share great time together. To everyone else who care about me, thanks for the support. Terima kasih! v vi CHAPTER 1 Introduction To help understand scientific data, a technique called visualization is available. The basic idea of visualization is to create images from data, to transform data to geomet- rical shapes or pixels. Visualization has a goal to give users insight about the data that is being presented [25]. There are two main categories of visualization: scientific visualization and in- formation visualization [32]. Each category has its own characteristic and works on different kinds of data. Scientific visualization works with data that has an inherent spatial placement [31]. Users already have a mental image about the data so they can already imagine what the data looks like. An example application of this kind of visualization is a fluid flow visualization [26]. Fluid, like water that flow on a certain surface, is everywhere in life. Therefore, users can easily relate the visualization to what they see in real life. Information visualization deals with abstract data which has no physical place- ment information. No mental image is known beforehand and therefore visualization is needed to help users build such a mental image [31]. Visualizing a network of people using a graph is one example of information visualization. 1.1 Graph Visualization Graph visualization is one of the topics in information visualization that deals with data that is represented as a graph: entities represented as nodes and relations between them represented as edges. One of the characteristic of the data is that the data items have relations between each other and so can be represented as a graph. This kind of visualization has the goal to help understand that relation, such as finding patterns and structures. Graph drawing is the basic foundation of graph visualization. A graph can tell about relations between data items. Before it can be drawn, information about graph layout is need to be known. One of the challenges in graph visualization with regard to graph layout is how to produce a good layout. It is a layout that can give even node distribution, minimum edge crossing, and several other aesthetic related criteria [19]. Producing a good layout might be relatively easy if the size of the graph is small, but it gets increasingly more difficult as the size of the graph increases. Automatic graph layout algorithms are available. These algorithms read a graph and then result position of all nodes. Some algorithms are fine-tuned to some kind of graphs and some are to the other. For example, a graph layout algorithm called Reingold-Tilford performs best on a specialized type of graph called tree [30]. No algorithm is known to perform best with all kind of graphs. 1.2 Graph Complexity Reduction Working with a large graph introduces new problems that do not exist on a relatively small graph. Graph layout algorithms will require more time to create layout of a larger graph to give the best possible layout. Screen size limitation is also a problem since putting a large number of objects on a limited screen size will create a cluttered and unclear image. 1 Introduction Figure 1.1: Map of the Internet by the Opte Project. Figure 1.1 is a sample image that illustrates these problems. The Opte Project1 created this image to show a map of the Internet that is represented as a graph. Since that small image tries to incorporate all of those large number of nodes and edges, shapes that represent the nodes and edges become very tiny. Putting a detailed information also become impossible. Moreover, the nodes and edges are also cluttered and make the image become more unclear. This graph representation already becomes a problem, not to mention the amount of time required to create layout of such a large graph. Reducing the size of the graph is often used to handle this problem. Some nodes are removed or grouped (clustered) to make a simpler graph that has less amount of nodes and edges. This is done with a purpose of making graph layout become easier and creating a clearer image. However, if the complete picture of the graph is still required, creating a single and simple image of the graph is not enough. Multiple images, ranging from one that shows the simplest version of the graph to the one that shows the most detailed version, are need to be generated. Moreover, given a limited size of screen, a large image need to be divided into several smaller images. Generating these large number of images in the beginning is impractical. Not only it will take a lot of time, but also probably not all images are interesting to the users and thus needed to be displayed. This makes creating such images become useless, both the effort and the result. The simplified version of graph can be displayed differently. For example, in a clustered graph, a node that is created as a replacement of several collapsed nodes can be represented using a special icon.

Load more

  53

Copy Link