All examples By author By category About

nbremer

Data based orientations in SVG Gradients - Step 2

This Chord diagram shows the second step of the example used in my blog on Data-based orientations for gradients in a d3.js Chord Diagram

What you see here are movie collaborations between the Avengers in the MCU (up until & including Thor Ragnarok). Because collaborations are symmetrical, the chords are all as thick at the beginnen as at the end. Therefore, I wanted each chord to represent both the Avengers that it connects through a gradient. This is what you see in this step. In the next step we'll look at how to improve the chord ordering to prevent as much overlap as possible.

You can find the first step and those after this step here