Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Force directed graph

Public visualization

Viewing a saved revision (read-only)

bcf1aef7232f430fbcda7f565ba6b08b

Force directed graph

0 stars0🌍 Public
Kkalokli8
Last edited Apr 8, 2020
Created on Apr 8, 2020
Forked from React Starter

This example shows a force-directed graph of character co-occurrence data from Les Misérables, rendered as an interactive SVG animation. It uses d3.forceSimulation to position nodes and links, with draggable circles representing characters and colored convex hulls drawn around groups of three or more nodes sharing the same group attribute. The hulls are generated using d3.polygonHull and closed curves, with a dropdown to switch between curveBasisClosed, curveCardinalClosed, curveCatmullRomClosed, and curveLinearClosed. The visualization is built with D3 v4 and React, loading graph data from a JSON file.

AI-generated description

React Starter code.