Skip to main content
100%

Curved Links

✓ Published0🌍 Public
GGerardoFurtado
Last edited Aug 14, 2018
Created on Aug 14, 2018

This example visualizes the co-appearance network of characters in Victor Hugo’s *Les Misérables* as a force-directed graph, where links between characters are drawn as smooth Bézier curves. The original straight links are replaced by curves using an intermediate node placed between each source and target, creating a visually elegant layout that reduces overlap and improves clarity. Nodes are colored by group membership using a categorical color scale, and each node is draggable, allowing interactive exploration of the network structure. The simulation uses d3.forceLink with a short distance and moderate strength, combined with charge and centering forces, to arrange the characters. Curved paths are rendered as SVG paths with a quadratic Bézier command (S) for smooth, aesthetically pleasing connections.

AI-generated description

This variation of a force-directed graph uses intermediate nodes in links to create aesthetically-pleasing Bézier curves.

forked from <a href='http://bl.ocks.org/mbostock/'>mbostock</a>'s block: <a href='http://bl.ocks.org/mbostock/4600693'>Curved Links</a>

gpl-3.0 Licensed

Similar vizzes