Skip to main content
100%

Collapsible Tree Hierarchy

✓ Published2🌍 Public
QQuinn Sebso
Last edited May 7, 2024
Created on May 7, 2024

This example shows an interactive collapsible tree hierarchy, allowing users to click on nodes to expand or collapse their children, and to navigate the tree by re-rooting it at a clicked node. The visualization uses D3.js v6 to compute a tidy tree layout with `d3.hierarchy` and renders it as an SVG, with animated transitions for all changes. A custom node-info div displays the name and ID of the last clicked node. The code also manages a stack to remember previous roots, enabling backward navigation through the hierarchy.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes