Skip to main content
100%

ICE-8: Family Tree

✓ Published0🌍 Public
RRohith arabati
Last edited Apr 4, 2022
Created on Apr 3, 2022
Forked from ICE-8: Family Tree

This interactive visualization shows a family tree graph using D3.js version 6 within a React framework, rendered as animated SVG elements. The code uses d3.stratify to convert a flat array of parent-child relationships into a hierarchical structure, then d3.tree() to compute node positions. Links animate from source to target positions via transition.duration(), while descendant nodes appear as skyblue rectangles with brown borders, displaying names through text elements. The visualization demonstrates how d3.js transitions bring static hierarchical data to life through sequential path and text animations.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes