This demonstrates how to use d3-annotation() with bboxCollide to procedurally place node labels. After using the nodes data to create a network visualization of the Les Miserables play, we filter the nodes to leave out the side characters and pass that array to d3-annotation. We then create a second forceSimulation, this time using the size of the notes as the property in our bounding box collision detection, to move the labels out of each others' way.
d3-annotation by Susie Lu.
Comparing 2016 presidential election cartograms from FiveThirtyEight, Washington Post, Wall Street Journal, NPR, and Daily Kos.
Uses Polylabel to pick some decent label positions.
See also: Jigsaw morphing, Smoother polygon transitions
The end result of my blog on SOM - Adding boundaries inside a hexagonal heatmap in D3.js in which the one heatmap of a Self Organizing Map is displayed with D3 with a small hover event and where boundaries between the overlaying segments have been visualized with black lines
A simpler version without line boundaries can be found here
| .idea/ | |
| *.iml |
| license: gpl-3.0 | |
| height: 1100 | |
| border: no |
| license: gpl-3.0 |
| license: gpl-3.0 |
| license: gpl-3.0 |
| license: gpl-3.0 |
| license: gpl-3.0 |
