Tree Layouts


Classification of Tree Layouts

Node-link
Containment
Stacking/Touching
Linear Alignment
Classical
Treemap
Icicle
Circular Alignment
Radial
Balloon
Cactus

Analyzing Tree Layouts:


  • Large trees
  • Labeling nodes

  • Computing Depth
  • Computing maximum number of branches

  • Compare subtrees
  • Space usage
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment

Analyzing Tree Layouts:


  • Large trees
  • Labeling nodes

  • Computing Depth
  • Computing maximum number of branches

  • Compare subtrees
  • Space usage

Finding subtrees?

Is Treemap always bad?

Node-link
Containment
Stacking/Touching
Linear Alignment
Classical
Treemap
Icicle
Circular Alignment
Radial
Balloon
Cactus

Let's take a look at this Treemap example in D3

  • What are the differences between tree layouts and networks?

  • Give examples of hierarchical relations and non-hierarchical networks on the same set of data items, such as students in a class or people in a family

Hierarchical edge bundling

Hierarchical edge bundling in D3 Treemap

Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment
Node-link
Containment
Stacking/Touching
Linear Alignment
Circular Alignment

Questions?

Email: Tommy.Dang@ttu.edu