Node-link circular layout: animated Sankey links

Another experiment improving the previous ones. As in this very old experiment, animation is used to convey the direction of links (see Holten et al. 2010 for a comparison of different techniques - animation being the best in our case).

The overlapping of links makes the diagram hard to read, so interaction is used to help the user: By hovering the mouse over a node, it is possible to focus on the links connected to it.

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="Node-link circular layout: animated Sankey links" />
        <title>Node-link circular layout: animated Sankey links</title>
        <link type="text/css" href="index.css" rel="stylesheet"/>
        <script src="https://d3js.org/d3.v3.min.js"></script>
    </head>
    <body>
        <svg height="500" width="960"></svg>
        <script src="index.js"></script>
    </body>
</html>
    

Modified http://d3js.org/d3.v3.min.js to a secure url

https://d3js.org/d3.v3.min.js