![Page 1: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/1.jpg)
1
H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space
Andrew ChanCPSC 533C
March 24, 2003
![Page 2: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/2.jpg)
2
H3
Image from: http://graphics.stanford.edu/papers/h3/fig/nab0.gif
![Page 3: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/3.jpg)
3
Ideas behind H3
Creating an optimal layout for a general graph is tough
Creating an optimal layout for a tree is easier
Often it is possible to use domain-specific knowledge to create a hierarchical structure from a graph
![Page 4: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/4.jpg)
4
Stumbling Blocks
The deeper the tree, the more nodes; exponential growth
You can see an overview, or you can see fine details, but not both
![Page 5: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/5.jpg)
5
Solution
A layout based on hyperbolic space, that allows for a focus + context view
H3 used to lay out hierarchies of over 20 000 nodes
![Page 6: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/6.jpg)
6
Related Work
H3 has its roots in graph-drawing and focus+context work
![Page 7: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/7.jpg)
7
2D Graph and Tree Drawing
Thinking very small-scale Frick, Ludwig, Mehldau created
categories for graphs; # of nodes ranged from 16 in the smallest category, to > 128 in the largest
![Page 8: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/8.jpg)
8
2D Tree Drawing (cont’d)
MosiacG SystemZyers and Stasko
Image from:http://www.w3j.com/1/ayers.270/paper/270.html
![Page 9: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/9.jpg)
9
3D Graph DrawingSGI fsn file-system viewer
Image from:
http://www.sgi.com/fun/images/fsn.map2.jpg
![Page 10: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/10.jpg)
10
3D Graph Drawing (cont’d)
Other work centered around the idea of a mass-spring system– Node repel one another, but links
attract– Difficulty in converging when you try
to scale the systems Aside: Eric Brochu is doing similar
work in 2D - http://www.cs.ubc.ca/~ebrochu/mmmvis.htm
![Page 11: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/11.jpg)
11
3D Tree Drawing
Cone Trees, Robertson, Mackinlay, CardImage from: http://www2.parc.com/istl/projects/uir/pubs/items/UIR-1991-06-Robertson-CHI91-Cone.pdf
![Page 12: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/12.jpg)
12
Hyperbolic Focus+Context
Hyperbolic Tree Browser,
Lamping, Rao
Image from:
http://www.acm.org/sigchi/chi95/Electronic/documnts/papers/jl_figs/strip1.htm
![Page 13: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/13.jpg)
13
Alternate Geometry
Information at: http://cs.unm.edu/~joel/NonEuclid/
Euclidean geometry– 3 angles of a triangle add up to?– Shortest distance between two points?
Spherical geometry– How we think about the world– Shortest way from Florida to Philippines?
![Page 14: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/14.jpg)
14
Alternate Geometry (cont’d)
Hyperbolic Geometry / Space– Is important to the Theory of Relativity– The “fifth” dimension– Can be projected into 2-D as a pseudosphere
– Key: As a point moves away from the center towards the boundary circle, its distance approaches infinity
![Page 15: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/15.jpg)
15
H3’s Layout
Image from: http://graphics.stanford.edu/papers/h3/fig/nab0.gif
![Page 16: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/16.jpg)
16
Finding a Tree from a Graph
Most effective if you have domain-specific knowledge
Examples:– File system– Web site structure– Function call graphs
![Page 17: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/17.jpg)
17
Tree Layout
Cone tree layout versus H3 Layout
Image from: http://graphics.stanford.edu/papers/h3/html/node12.htm#conefig
![Page 18: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/18.jpg)
18
Sphere Packing
Need an effective way to place information
Cannot place spheres randomly Want to have a fast algorithm
![Page 19: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/19.jpg)
19
Sphere Packing (cont’d)
Image from: http://graphics.stanford.edu/papers/h3/fig/incrhemi.gif
![Page 20: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/20.jpg)
20
Demo
![Page 21: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/21.jpg)
21
Strengths
Can easily see what the important structures are and the relationships between them
Can let you ignore “noise” in data Animated transitions Responsive UI
![Page 22: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/22.jpg)
22
Weaknesses
Starting view only uses part of the sphere
Moving across the tree can disorient you; cost of clicking on the wrong place is high
Labels not present if node too far from center
![Page 23: H3: Laying Out Large Directed Graphs in 3D Hyperbolic Space](https://reader036.vdocuments.site/reader036/viewer/2022062410/56815959550346895dc695f2/html5/thumbnails/23.jpg)
23
Questions?