d3 Sankey assign fixed x,y position

Question

I have a sankey diagram in which the user can move and position the nodes freely. I want to save the exact pixel-position selected by the user and use it in the next regeneration of the diagram.

The only way I have managed to approach this until now was to use the "x layer" of the node instead of the exact x-position (not the x-coordinate in pixels but the x-coordinate in layers/levels - 1,2,3 etc...).

Is there a way to use the pixel coordinate instead?

Answer 1

I guess you're using transform when the user moves the nodes.

If you assign each node an id, you could save pairs like [ (#id, transformation) ..; ] [ (#id, transformation) ..; ] and apply it again after.

I could try something if you show your code :)

Answer 2

The sankey plugin acts as your data model. All it does is calculations of x for the 'rect's and 'dx' for the paths and many other position calculations. You can capture those positions with the 'dragend'.

Once you have the data you can get and set with pattern

var getNodes = sankey.nodes();
//do something here to set the position 
sankey.nodes(getNodes);

Then you would doe the same with the links. Then recalculate everything.

sankey.layout() 

Without seeing your code I am sure there will bet another step to make sure this works, but you will find it is an easy module to update.

You might want to check the actual source code because I have a custom version that might have different variable names, but it works the same.

Answer 3

You can extract the x and y values and save them into an array as follows:

var savedCoordinates = sankey.nodes().map(function(d) {
        return {x:d.x, y:d.y};
});

Of course, this must be used after the layout has been computed, otherwise x and y values are undefined.

To return to your saved coordinates, you can use the following:

sankey.nodes().forEach( function(d,i) {
      d.x= savedCoordinates[i].x;
      d.y= savedCoordinates[i].y;
});

Finally, you'll need to update the drawing with whichever drawing function you are using (updating the transform attributes of g nodes and the path attributes for the links).

PS: You notice that I'm assuming the node order doesn't change. If it does, you need to provide an id field, or similar to your data... do you have one?