implement dragging

Author: antoinerg

package-lock.json

@@ -65,7 +65,7 @@
     "country-regex": "^1.1.0",
     "d3": "^3.5.12",
     "d3-sankey": "git://github.com/antoinerg/d3-sankey.git#4f37ed8d3578b545a8569ecd74583f373768e900",
-    "d3-sankey-circular": "^0.26.0",
+    "d3-sankey-circular": "git://github.com/antoinerg/d3-sankey-circular.git#a298acf674f0a9c7158243d45814cd8060dad728",
     "d3-array": "1",
     "d3-collection": "1",
     "d3-force": "^1.0.6",

package.json

@@ -48,9 +48,13 @@ function sankeyModel(layout, d, traceIndex) {
         .nodePadding(nodePad)
         .circularLinkGap(2)
         .nodes(nodes)
-        .links(links);
+        .links(links)
+        .nodeId(function(d) {
+            return d.pointNumber;
+        });
 
     var graph = sankey();
+
     if(sankey.nodePadding() < nodePad) {
         Lib.warn('node.pad was reduced to ', sankey.nodePadding(), ' to fit within the figure.');
     }
@@ -160,6 +164,7 @@ function nodeModel(d, n, i) {
     n.dy = n.y1 - n.y0;
 
     return {
+        index: n.pointNumber,
         key: key,
         traceId: d.key,
         node: n,
@@ -185,7 +190,7 @@ function nodeModel(d, n, i) {
         valueFormat: d.valueFormat,
         valueSuffix: d.valueSuffix,
         sankey: d.sankey,
-        graph: d.sankey.graph,
+        graph: d.graph,
         arrangement: d.arrangement,
         uniqueNodeLabelPathId: [d.guid, d.key, key].join('_'),
         interactionState: d.interactionState
@@ -540,8 +545,8 @@ module.exports = function(svg, calcData, layout, callbacks) {
         .call(updateNodePositions)
         .call(attachPointerEvents, sankey, callbacks.nodeEvents);
 
-    // sankeyNode
-    //     .call(attachDragHandler, sankeyLink, callbacks); // has to be here as it binds sankeyLink
+    sankeyNode
+        .call(attachDragHandler, sankeyLink, callbacks); // has to be here as it binds sankeyLink
 
     sankeyNode.transition()
         .ease(c.ease).duration(c.duration)

src/traces/sankey/render.js

@@ -4,7 +4,7 @@
             "type": "sankey",
             "node": {
                 "pad": 1,
-                "label": ["0", "1", "2", "3", "4", "5"]
+                "label": ["0", "1", "2", "3", "4", "5", "6"]
             },
             "link": {
                 "source": [
@@ -15,15 +15,11 @@
                 ],
                 "value": [
                     1, 2, 1, 1, 1, 1, 1
-                ],
-                "label": ["1", "2", "3", "4", "5"]
+                ]
             }
         }],
     "layout": {
         "title": "Sankey with circular data",
-        "margin": {
-          "l": 25, "r": 25, "t": 25, "b": 25
-        },
         "width": 800,
         "height": 800
     }