Skip to main content
100%

D3 Node-Link Diagram

✓ Published2🌍 Public
Pplai1
Last edited Oct 27, 2022
Created on Oct 27, 2022
Forked from HTML Starter

This example demonstrates a node-link diagram representing social connections among 16 tribal groups, with 58 edges showing positive or negative relationships. A D3 force-directed layout positions the nodes using `d3.forceSimulation` with link, charge, and centering forces. Circles are rendered as SVG elements with dark blue fill and partial opacity, while lines represent connections. The data is loaded from a CSV file, and hover interactions trigger tooltip visibility. The code uses D3 v7 and includes the d3-legend and d3-scale-chromatic libraries, with the simulation updating node and link positions on each tick.

AI-generated description

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

See also React Starter.

MIT Licensed

Similar vizzes