Skip to main content
100%

Network tree

✓ Published3🌍 Public
Uubl2
Last edited Mar 31, 2022
Created on Mar 31, 2022

This example shows a force-directed network tree with six nodes and five weighted links, rendered as draggable orange circles with text labels. The code uses d3.layout.force (v4) to simulate gravity, charge, and link distance, while rendering SVG lines and groups. Node weights set stroke-width via Math.sqrt(d.weight), and data loads from an external graphFile.json containing name, group, and link target/source arrays. The visualization updates node positions on each tick using the force layout’s tick event.

AI-generated description

See also React Starter.

MIT Licensed

Similar vizzes