This entry is part of the Chart Index, the reference library for the Chart Design Field Guide.
The chord diagram visualises relationships between categorical entities as arcs around a circle, connected by ribbons whose thickness encodes the strength of each relationship. The form is reflexive — it shows flows in both directions, often between members of the same set (countries, departments, characters). It is the chart used for migration matrices, network flow visualisations, character interaction graphs, and any "who relates to whom and by how much" question.
The form's reputation is for being striking. The colourful ribbons crossing the centre look like a Renaissance illuminated manuscript. The risk is that the beauty outpaces the readability: chord diagrams with too many categories or weak relationships become decorative noise.
What it is
A chord diagram maps a set of categorical entities to arcs around a circle and the directed (or undirected) relationships between them to ribbons connecting those arcs. Each entity's arc length is proportional to its total flow — the sum of incoming and outgoing relationships. Each ribbon's thickness is proportional to the strength of the relationship between its two entities.
Six departments arranged around the circle, with ribbons showing referrals between them. The widest arcs (the most-active departments) and the thickest ribbons (the most-frequent referral patterns) emerge from the visual hierarchy. The eye reads the asymmetry: a thick incoming ribbon from one department but a thin outgoing ribbon back to it indicates a one-way flow.
When to use it
Chord diagrams are the right choice when:
- You have flows between members of one categorical set — country-to-country migration, department-to-department referrals, character-to-character interactions.
- You have few enough entities (5–15) for the form to remain readable.
- The reader's question is "who connects to whom, and by how much?"
- The flows are non-trivially imbalanced — symmetric or uniform flows make the form decorative.
- The chart is editorial or visualisation-focused, not operational.
When not to use it
- Many entities. More than 15 arcs around the circle and the ribbons crisscross into illegibility. Use a Sankey or matrix view.
- Flows in only one direction. If the relationships are not naturally between members of one set (e.g., suppliers → customers), use a Sankey.
- Very imbalanced data. A chord diagram with one dominant arc (one entity sending and receiving nearly all the flow) wastes the circular layout.
- Audiences unfamiliar with the form. The visual conventions need explanation. For business audiences, a heatmap or stacked bar may be safer.
Design principles
Sort entities by total flow
The arc lengths are not arbitrary — they encode each entity's total participation. Sort the arcs clockwise from the largest, or arrange by domain meaning (alphabetical, geographic, hierarchical). Random arc order destroys the form's information.
Use a quiet palette
Each entity gets a colour; the ribbon between two entities uses one of the two colours (often the source). With six entities, you have six hues and many ribbons crossing — saturated palettes turn the chart into a quilt. Use a desaturated categorical palette or a single hue family.
Show each ribbon clearly
Ribbons should have an outline (1px, matching the source colour, slightly darker) so they remain distinguishable when overlapping. Without outlines, two crossing ribbons of similar colour become a single shape.
Annotate the dominant flows
In a chord diagram, the eye picks the thickest ribbons easily. Add labels for them — A → C: 142 referrals — so the dominant flows are quantified, not just visible. Smaller flows can remain unlabelled.
Use a small legend
For colour-by-source ribbons, include a key showing entity colours. For thickness-by-flow, a reference thickness in the legend (a ribbon labelled 50 units) helps the reader calibrate.
Provide direction cues
If flows are directional, indicate direction. A subtle gradient (faded at one end, full saturation at the other), a small arrow on the ribbon, or asymmetric ribbon shape all work. Without direction cues, the form reads as symmetric.
Avoid in dashboards
Chord diagrams demand attention. They are editorial and exploratory; they do not belong in operational dashboards where rapid scanning matters. For dashboard contexts, a matrix or stacked bar is faster to read.
Anatomy
A chord diagram's anatomy is the circular arrangement of arcs (with lengths proportional to totals) and ribbons connecting them (with thickness proportional to pairwise flows). The form's reading task is visual estimation of relationships; precision belongs in tooltips or paired tables.
Related types
- Sankey diagram — for flows between two or more distinct sets, not all-to-all within one set.
- Network graph (force-directed) — for relationships when entities have no natural order.
- Adjacency matrix — the same data as a heatmap; less aesthetic, more precise.
- Arc diagram — relationships between linearly-arranged entities with arcs overhead.
- Edge bundle — hierarchical version that groups edges by source / target hierarchy.
Reading list
- Krzywinski, M. et al. (2009). Circos: An Information Aesthetic for Comparative Genomics. The form's modern origin.
- Bostock, M. (2011). D3 Chord Diagram. The web-native implementation.
- Tufte, E. (1990). Envisioning Information. On dense information designs and the role of aesthetic order.