Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Collapsible Tree Example

Public visualization

Viewing a saved revision (read-only)

ec33422322ef42a194439a6e0bc51aed

Collapsible Tree Example

0 stars0🌍 Public
GGaneshPenumarthi
Last edited Apr 4, 2022
Created on Apr 4, 2022
Forked from HTML Starter

This interactive visualization displays a collapsible tree diagram using d3.layout.tree, with nodes rendered as SVG symbols (circles, crosses, or diamonds) and links colored by a level property from the embedded JSON data. The code loads d3 v3 from a CDN and uses d3.svg.diagonal for curved edges, along with d3.svg.symbol to vary node shapes based on value thresholds. The tree includes hardcoded family hierarchy data, with fixed node depths and margin-based layout, though no collapse/expand behavior is implemented in the shown script.

AI-generated description

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

See also React Starter.