Graph and chord

Graph and chord charts show how things connect: a graph places nodes and their links freely, and a chord diagram sets groups around a ring to show what flows between them.

LLMs

Basic chord

A chord series sets nodes around a ring and joins them with ribbons as wide as each link's value, colored by their target.

Minimum angle

Set minAngle so nodes with little or no flow still get an arc wide enough to see and label, like the teams here with no links.
Set lineStyle.color to source, target or gradient to choose which end of a ribbon gives it its color, shown side by side.

Chord style

Round each arc with borderRadius, space them with padAngle, fade the ribbons with opacity and use focus: 'self' on hover.

Simple graph

A graph series with fixed x and y positions, arrow edgeSymbol ends, curved links and labels on chosen edges.

Graph on axes

Set coordinateSystem to cartesian2d to place graph nodes on a category and value axis, joined in order by arrowed links.

Force rings

Sixteen graph series, each a ring from two to seventeen nodes, laid out by force with its own repulsion and edgeLength.

Force layout

Set layout to force to let nodes push apart and links pull them together, with categories coloring each group in the legend.

Dynamic graph

Add nodes and edges with setOption on a timer, and the force layout keeps settling as the network grows around a fixed center.

Adjacency focus

A graph with stored positions where focus: 'adjacency' fades everything but a character's own links, and only major names are labeled.

Hide overlapping labels

Turn on every label and set labelLayout.hideOverlap, so names appear as you zoom in within the scaleLimit range.

Circular layout

Set layout to circular to place nodes on a ring, with rotateLabel turning each name to point away from the center.

Graph over time

A graph per country on cartesian2d axes traces income and life expectancy year by year, with a single select legend.

Large force graph

A force graph of about 500 classes with draggable nodes, roam limited by scaleLimit and a thumbnail to find your way.

Package dependencies

A prepositioned graph of 700 packages with roam, focus: 'adjacency' labels on hover and a thumbnail of the whole map.