An edge, also called a link, is a connection between two nodes in a network or graph. Nodes are the things being related, such as people or characters; edges represent their relationships, such as following someone or appearing in the same scene. Unlike a hierarchy, a network can represent many-to-many connections. section 12.0 section 12.1
Store network data in separate node and edge lists. An edge list uses source and target columns to identify its two endpoints. It can also carry a weight: in a character network, the weight can count the scenes two characters share. section 12.1
Choose an edge type and visual encoding that match the relationship:
- Use a directed edge when the connection has meaningful direction, from source to target. An arrow can show that direction. section 12.1
- Use an undirected edge when the relationship works both ways and has no specific direction. section 12.1
- Vary link thickness to show connection weight, such as how often two characters share a scene. section 12.3
Character connections as edges
Create one node per character and one undirected edge for every pair that shares a scene. For example, an edge from Nurse to Juliet can have weight 2 when they appear together in two scenes. An arc diagram places the nodes along a line and draws each edge as an arc; thicker arcs reveal stronger connections. section 12.1 section 12.3
In a D3 tree chart, links come from root.links(), which returns source and target points. Bind those links to SVG path elements, then use d3.link() with x() and y() accessors to calculate each path’s d attribute. A curve such as curveBumpX gives the links their visible shape. section 11.3.2
Edges can support different network views. Adjacency matrices use a grid to represent links, while arc diagrams and network graphs show nodes together with their connections. Arc diagrams emphasize which nodes are isolated or highly connected; force-directed layouts pull strongly connected nodes closer together. section 12.0 section 12.5
Table 12.3 Links list for the sample dataset
|
Source
|
Target
|
Weight
|
|---|---|---|
|
Lady Capulet
|
Nurse
|
1
|
|
Nurse
|
Juliet Capulet
|
2
|
|
Romeo Montague
|
Juliet Capulet
|
1
|
Inspect a compact edge list with source, target, and weight columns before turning it into a visualization. section 12.1
