Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Force Directed Graph

Public visualization

Force Directed Graph

0 stars1🌍 Public
WWei-Che Chang
Last edited Nov 6, 2020
Created on Nov 6, 2020

A force-directed graph displays a network of 410 nodes and their connections, with node colors assigned by group via `d3.schemeCategory10`. The visualization pairs the graph with an adjacency matrix rendered as SVG rectangles, where users can click either nodes or grid cells to highlight corresponding links and matrix positions. Built with `d3.forceSimulation`, `forceLink`, `forceManyBody`, and `forceCenter`, the graph supports drag-and-drop node repositioning and zoom/pan interactions through `d3.zoom`. The adjacency matrix uses `d3.select` to update stroke and fill opacity based on edge weights.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed