Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Force Directed Graph

Public visualization

Viewing a saved revision (read-only)

2dfe442dfee54291a418bf3f87bf6b08

Force Directed Graph

0 stars0🌍 Public
LLigoon
Last edited Nov 9, 2020
Created on Nov 9, 2020

This example combines a force-directed graph with an adjacency matrix to visualize network connections. The graph uses `d3.forceSimulation` with `forceLink`, `forceManyBody`, and `forceCenter` to position nodes, while links are drawn as SVG lines with widths proportional to edge values. Clicking a node highlights its corresponding row and column in the matrix, and both elements support zooming via `d3.zoom`. Node colors and radii encode group membership, with a legend showing the six group categories.

AI-generated description

React Starter code.