Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Relation Graph with d3-force

Public visualization

Viewing a saved revision (read-only)

cf4afc11ff62480c934c3e7f2a698061

Relation Graph with d3-force

0 stars4🌍 Public
Llintonylin
Last edited Oct 28, 2020
Created on Oct 1, 2020
Forked from Circles on a Map

This interactive relation graph visualizes the character co-occurrence network from Victor Hugo's *Les Misérables*. Using `forceSimulation` from the `d3-force` library alongside the standard d3.v6 API, it maps characters to circles and their interactions to weighted lines. The SVG rendering supports both node dragging via the `drag` behavior and view zooming controlled through the `zoom` extension, which applies transforms to the network elements. Nodes are colored by their group assignment using the `schemeCategory10` palette.

AI-generated description

Relation Graph with Grab and Zoom features implemented.

TODO:

Legends, Class of Links

Based on force-directed-graph. The data comes from Les Misérables.