Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 Stratify tree diagram

Public visualization

D3 Stratify tree diagram

0 stars1🌍 Public
NNita
Last edited May 2, 2021
Created on May 2, 2021

This example shows a hierarchical family tree rendered as a dendrogram, with nodes labeled by name and curved links connecting parents to children. The data is embedded as a CSV string and parsed with `d3.csvParse`, then converted into a hierarchy using `d3.stratify`. The layout is computed with the `d3.cluster` tree layout, and links are drawn as SVG paths using a custom `project` function that maps tree coordinates to screen positions. Text labels use varying font sizes based on node depth.

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