block by micahstubbs 7f360cc66abfa28b400b96bc75b8984e

adjacency matrix layout

Full Screen

a d3 version 4 port of the bl.ock Adjacency Matrix Layout from @Elijah_Meeks

to make this example, I also ported the underlying adjacency matrix layout to d3v4. find that layout at the d3-adjacency-matrix-layout project on github.

the dataset shown is the famous Les Miserables character co-appeareance network


Original README.md


A simple D3 layout that creates an adjacency matrix. In an adjacency matrix, unlike an arc diagram or a force-directed layout, the links are not lines and the nodes are not circles (or other icons). Instead, all nodes are shown across the x and y axes, and a link is indicated by a filled grid cell where the connected nodes meet.

The layout also includes helper functions to draw the x and y axes to label the nodes.

The d3v3 version of the layout is here.

index.html

d3-adjacency-matrix-layout.js

miserables.json