Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

My Family Tree

Public visualization

Viewing a saved revision (read-only)

71a45dc547e04aabb40b58ca084eea07

My Family Tree

0 stars0🌍 Public
TTejucmandava
Last edited Apr 12, 2023
Created on Apr 12, 2023

This interactive family tree visualizes three generations of a family, with each node displaying a person's name and colored circles (fill and stroke) to distinguish branches and levels. Using D3 version 3’s `d3.layout.tree` and `d3.svg.diagonal`, the SVG diagram renders hierarchical connections as curved links, with smooth transitions (`duration`) animating node positions on click. The hierarchical data is hardcoded as a JavaScript array, and clicking a node toggles its children, dynamically updating the tree layout.

AI-generated description

A demonstration of how to start using D3 version 6.