Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 collapsable multiple parents tree

Public visualization

Viewing a saved revision (read-only)

593068e17c3c4c4abfe61f82f25c528c

D3 collapsable multiple parents tree

0 stars0🌍 Public
BBoyka
Last edited Jun 16, 2023
Created on Jun 16, 2023
Forked from Tree Example

This example visualizes plant generation data and a custom tree structure using D3.js version 3’s `d3.layout.tree`, `d3.svg.diagonal`, and SVG rendering with animated transitions. It shows hierarchical relationships through collapsible nodes, where clicking toggles child visibility, and includes an additional link connecting two non-parent-child nodes via a custom `additionalLinks` array. Nodes are rendered as colored rectangles with text labels, while paths represent parent-child connections. The code computes layout positions based on depth and applies 750-millisecond transitions to smoothly update node and link positions during collapse and expansion.

AI-generated description

Tree map