Tree View Example

This example shows the tree mode alongside the default force mode for the same stacked bar chart structure. Tree mode arranges nodes in a deterministic hierarchy: dimension nodes at the top, division nodes grouped underneath, and leaf nodes in a grid at the bottom (one axis per dimension).

Keyboard Controls

Command	Key
Enter the structure	Activate the "Enter navigation area" button
Exit	Esc
Left (backward along category)	←
Right (forward along category)	→
Up (backward along date)	↑
Down (forward along date)	↓
Drill down to child	Enter
Drill up to category parent	W
Drill up to date parent	J

Chart + Inspectors

Stacked Bar Chart

Force Graph

Tree View

About This Example

This page demonstrates the two visualization modes available in the inspector. The force graph (default) uses a physics simulation to position nodes — good for seeing overall connectivity but non-deterministic. The tree view uses a fixed hierarchical layout where dimension nodes sit at the top, division nodes group underneath, and leaf nodes are arranged in a grid (one axis per dimension). Parent-child links are drawn solid while sibling links are dashed.

Both inspectors respond to the same navigation events, so you can compare how each layout represents the current position in the structure.