Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 Node-Link Diagram

Public visualization

D3 Node-Link Diagram

0 stars3🌍 Public
Mmariahdiaz
Last edited Oct 25, 2022
Created on Oct 25, 2022

This example shows a node-link diagram of social network data, using a force-directed layout to position 16 nodes and their connecting links. The visualization uses D3 v7's `d3.forceSimulation` with `forceManyBody`, `forceLink`, and `forceCenter` to calculate the layout, while rendering nodes as SVG circles and edges as lines with animated tick updates. Node colors come from `d3.scaleOrdinal` with the `schemeSet1` palette, and hovering a node triggers a tooltip via mouseover events. Data is loaded from a CSV file containing source, target, and link values.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed