Mao Lin Huang (???)

1
Information Visualization and Its Applications
?????????

• Mao Lin Huang (???)
• University of Technology, Sydney,

2
Visualization (???)
Information Visualization (?????)
Scientific Visualization (???????)
None Graph Visualization (???????)
Graph Visualization (??????)
Graph G (V, E)
3
Information Visualization
Advances in science technology have allowed
people to see old things in new ways. Telescopes,
microscopes and oscilloscopes are typical
instrument examples. ?????????????????????.
???????, ??? .
Maps, diagrams, and PERT charts are examples of
using visual representations to see things. A
good picture is worth ten thousand words.
??????????????????? Today, computers help
people to see and understand abstract data
through pictures.
4
The Definition (??)
Information visualization the use of
interactive visual representations of abstract,
non-physically based data to amplify cognition
CMS99. ????? ?????, ????????????,
???? ????????????. CMS99 Stuart K. Card,
Jock D. Mackinlay, and Ben Shneiderman.
Readings in information visualization using
vision to think. Morgan Kaufmann Publishers,
Inc., 1999.
Xerox Palo Alto Research Center (PARC)
5
Information Visualization
None-relational data Relational data
Graphics-driven Graph-driven
An example of using SeeNet to view email data
volumes generated by ATT long distance network
traffic. Edges represent email connections. Weigh
and colors of edges represent volumes of email
data.
The little image dots represent data records of
the number of sun spots, from 1850 to 1993,
zoomed in on a small area. (collected from GVU
Center, Georgia I. T.)
6
Graph-Driven Visualization of Relational Data
Graph Visualization
An example of visualizing relational data. This
is the visualization of a family tree (graph).
Here each image node represents a person and the
edges represent relationships among these people
in a large family.
7
The Model of the Relational Data ??????
Relational information (graph) visualization
systems use graphs G (V, E) to model relational
structures the entities are nodes, and the
relationships are edges (sometimes called
links). For example, the structure of the World
Wide Web can be modeled as a graph the nodes are
HTML documents, and a hyperlink from one document
to another is represented as a directed edge.
8
Challenges in GV

• Graph layout Problem
• Scale Problem
• Scope Problem
• Navigation Problem

Readability, cognitive effort comprehension
Small window, large data sets Context display
Distributed huge data sets, which are partially
unknown
How to find particular data items by visual
manipulation?
9
Classical Graph Layouts

• Link-node diagrams
• Layout algorithms (graph drawing)
• Geometric positioning of nodes edges
• Small amount of nodes
• Avoid node overlaps
• Reduce edge crossings

radial layout
symmetric
force-directed
hierarchical
orthogonal
10
The Graph Drawing (??)
A drawing D(G) of a graph G (V, E) consists of
a location (x, y) for each v in V and a route
((x1,y1), (x2, y2)) for each edge e in E.
???????????????.
A graph drawn using the original spring
algorithm. ???????????.
11
Classical Tree Layouts

• A special type of graphs
• With no circles
• Structured hierarchically
• Inefficient use of display space
• Small amount of nodes

radial layout
radial layout
Classical hierarchical layout
hyperbolic tree
balloon layout
12
Space-Optimized Tree Layout
(We introduced this new method in 2001)

• Redefine the wedge (v)
• Efficient use of display space
• Connectionenclosure
• Large amount of nodes
• How to navigate? (Distortion, ZoomingFiltering
• contextdetail)

A large data set of approximately 50 000 nodes
My Unix root with approx. 3700 directories and
files
13
Redefine the wedge(v) of radial drawings

• A region P(?) of a node? is defined by the wedge
  wg(v) and one (or more) cutting edges
  (boundaries) cut by other regions that cross the
  line l in wg(v).
• A wedge is defined as wg(?) ?, l, ?(?), where
  ? is the father of ? and l is a straight line
  going through ? that determines two boundaries of
  P(?).

14
The Problem of Viewing Large Data ??????????

• Traditional graph visualization assumes that the
  whole graph can reasonably be represented in a
  readable and understandable manner on the display
  medium.
• Amount of information we want to visualize
  becomes larger
• A small modern file system (say with a 2GB
  drive on a PC) there are hundreds of nodes and
  links
• Web graphs are much larger even a small
  organization such as a University has many
  thousands of web documents.
• No techniques can visualize the complete World
  Wide Web.
• Classical visualization methods tend to be
  inadequate.

15
Clustered Layout (nodes grouping)
Connection Enclosure
16
Clustered Layout

• High scalability
• Dynamic viewing
• Abridged context
• Open close clusters
• Average readability

17
Force-Directed Clustering (DA-TU)(we introduced
this method in 2002 and its the first attempt of
using force-directed method to draw clustered
graphs)

• Multi-level clustering
• Multiple spring forces
• High scalability
• Dynamic viewing
• Abridged context
• Open close clusters
• Good readability

18
Multi-Forces in Clustered Graphs
19
The Online Graph Model ?????

• Proposed in 1997
• Scope problem
• is well addressed
• Scalability is
• increased through
• dynamic viewing
• Lost overall context
• Change frames
• Animation preserves
• mental map
• Modified Spring Algorithm

20
Online Navigational Visualization (Online
Force-Directed Animated Visualization)
We proposed OFDAV in 1997 that provides a major
departure from traditional methods. We visualise
a tiny part (a frame Fi ) of a huge graph at
time t. We change from Fi to Fi1 by user
interaction.
21
Online Navigational Visualisation????????
OFDAV provides a major departure from traditional
methods. We visualise a tiny part (a frame Fi )
of a huge graph at time t. We change from Fi to
Fi1 by user interaction.
OFDAV does not need to know the whole graph, it
does not predefine the geometry (the user can
navigate logically), and it is user-oriented.
22
Scope Problem is Addressed

• We incrementally calculate and maintain a small
  local visualization on-line. The graph is
  supplied to the system by a series of requests
  for neighbourhoods of focus nodes.

Small local graph
new focus node v
Huge graph
neighbourhood of v
23
Online Graph Layout Problem

• The specific criteria for online drawing
• The layout of logical frame must show the
  direction of the exploration.
• Reduce the overlaps among the local regions.
• The sequence of drawing preserves the mental map.
  
• The general criteria for graph drawing
• Reduce the edge crossings.
• Avoid nodes overlaps

24
Spring model (????)
In the spring model, each node is replaced by a
steel ring, and edges are replaced by Hookess
law springs (????). The rings have a
gravitational repulsion (????????) acting between
them, and we can find a drawing which minimizes
the energy.
25
Modified Spring Algorithm (MSA)
In this frame, there are two focus nodes, x and
y. The total force on node v is
26
The layout of Fi must show the direction of the
exploration.
Spring model
Modified spring model
27
Application1Visual Web browser

• WebOFDAV - mapping the entire Web,
• Look at the whole of WWW as one graph a huge and
  partially unknown graph.
• Maintain and display a subset of this huge graph
  incrementally.
• Reduce mouse-click rate
• Maintain a 2D map history of navigation

28
The lost in hyperspace problem ??????

• Even in this small document, which could be read
  in one hour, users experienced the lost in
  hyperspace phenomenon as exemplified by the
  following user comment I soon realized that if
  I did not read something when I stumbled across
  it, then I would not be able to find it later.
  Of the respondents, 56 agreed fully or partly
  with the statement, When reading the report, I
  was often confused about where I was. Nielson,
  1990.

29
Visual Web Browser addresses the problem of lost
in hyperspace with a sense of space.

• Graphic Web Browser addresses the fundamental
  problem of lost in hyperspace by displaying a
  sequence of logical visual frames with a graphic
  history tail to track the users current
  location and keep records of his previous
  locations in the huge information space.
• The logical neighborhood of the focus nodes
  indicates the current location of the user, and
  the tail of history indicates the path of the
  past locations during the navigation.

30
Application2File Managementand Site Mapping
An example of using Space-Optimized Tree
Visualization for a small web site mapping
(approximately 80 pages) - viewing techniques
needed
Mapping to a Unix root with approx. 3700
directories and files
31
Application3 Web Reverse Engineering

• HWIT (Human Web Interface Tool) is able to reuse
  existing structures of web site by visualizing
  and modifying the corresponding web graphs, and
  then re-generating a new site by save the
  modified web graphs.

The layout of an existing structure of a web site
Enhancing the existing Web site by adding a
sub-site
32
Application4 B2C e-Commerce

• VOS (Visual Online Shop) can be used for online
  grocery shopping, shopping cart model. It is
  applicable to any e-commerce shopping application
  (dynamically navigate e-catalogs).

33
Application5 Online Business Process
Management

• WbIVC (Web-based Interactive Visual Component) is
  applied to a research project management system
  (RPMS) in universities.
• A participant can review the details of a
  specific process element by clicking on the
  corresponding rectangle, and then selecting the
  open a process element in the popup menu.
• A participant can also create a new artifact (a
  Java methods) to a research project by opening a
  edit window.

The output interface of the WbIVC in RPMS
The input interface of the WbIVC in RPMS
34
Application6 Program Understandingand Software
Mining

• JavaMiner is for non-linear visual browsing of
  huge java code for programming understanding.
• textual data mining
• Visualize a variety of relationships between
  terms in Java code, e.g. HAS, SUBCLASS, CALL and
  INTERFACE relationships.
• Text documents, the lexicon, the neighborhood
  function

The input interface of the WbIVC in RPMS
35
Conclusion

• The above talk gives an introduction to
  Information Visualization and covers most of
  research works I have done in this field.
• In the future, I will remain doing research
  across these three layers because I believe that
  to guarantee the quality of the research, it
  needs theory but to assess the value of the
  research, it needs applications.

Thank You !