Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of ICE 8 - Family Tree

Public visualization

Fork of ICE 8 - Family Tree

0 stars0🌍 Public
DDINESH SAI BOPPANA
Last edited Jul 9, 2022
Created on Jul 9, 2022

This family tree visualization displays a hierarchical genealogy of nine individuals, with nodes color-coded by generation depth (red for the root, blue for children, green for grandchildren). The code uses `d3.stratify()` to transform the flat parent-child data structure, then `d3.tree()` computes node positions. SVG circles represent nodes, cubic Bézier paths connect parent-child relationships, and text labels identify each person. The coloring function `marker(d.depth)` distinguishes generations, with hardcoded sample data stored as objects with `child` and `parent` properties.

AI-generated description

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

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed