Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Tree

Public visualization

Tree

0 stars2🌍 Public
RRamdas Dheeraj
Last edited Nov 8, 2025
Created on Nov 5, 2025
Forked from SVG Fundamentals

This example presents a three-generation family tree as a static SVG visualization using D3.js v6. It shows a root "Grandparents" node branching into two parent nodes, each with two child nodes. The layout is computed with `d3.stratify()` and `d3.tree()`, while `d3.linkVertical()` draws the connecting paths. Node shapes and colors encode generation depth: squares represent the root, circles represent parents, and triangles represent children. A legend explains the mapping, and each node includes a tooltip via a `<title>` element.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed