Skip to main content
100%

Fork of D3 Tree with Multiple Parents

✓ Published0🌍 Public
RRobert Wolf
Last edited Nov 20, 2023
Created on Nov 20, 2023

This example visualizes a hierarchical dataset of food categories and items, where nodes can have multiple parents, creating a non-tree structure. It displays the data as a left-to-right node-link diagram, with each item's label rendered as text and connections drawn as curved paths. The code uses D3.js v5 and the `tree`, `hierarchy`, and `linkHorizontal` APIs to lay out the graph, while a custom algorithm deduplicates repeated child nodes by ID and repositions them. The visualization is rendered as an SVG and includes pan and zoom interaction via D3's `zoom` event. The data is loaded from a JSON file and uses a transition animation to update node positions.

AI-generated description
MIT Licensed

Similar vizzes