Support custom X-axis positioning of the nodes

[dcupif]

Hi, thank you for this great library.

For a specific use case, we'd need to position nodes on the X-axis according to a D3 time scale. It does not seem possible as of now considering the horizontal positioning of the nodes is governed by the nodes' depth.

Would it be in the scope of this library to support such use case? If not, would you have any hints/suggestions towards implementing a solution?

We are willing to help working on a solution. 😃

[dcupif]

@bella-kpler fyi

[mvdobrinin]

@dcupif Can you use custom align function?

d3-sankey/src/sankey.js

Line 198 in bb7233e

const i = Math.max(0, Math.min(x - 1, Math.floor(align.call(null, node, x))));

This should control the X axis positioning of the nodes based on columns that they belong to.

[kayecandy]

@dcupif Can you use custom align function?

d3-sankey/src/sankey.js

Line 198 in bb7233e

const i = Math.max(0, Math.min(x - 1, Math.floor(align.call(null, node, x))));

This should control the X axis positioning of the nodes based on columns that they belong to.

Thanks for the advice! To add to this answer, this is how I did it:

sankey = d3.sankey()
  /* ... */
  .nodeAlign((node, n)=>{
      return node.customX ? node.customX : d3.sankeyJustify(node, n) // sankeyJustify can be changed to any nodeAlign() functions
  })
  /* ... */

[NPC]

Unfortunatelly it doesn't seem to work if your custom scale for whatever reason extends beyond the already calculated max depth (passed as “n” into the alignment function).

I'll keep experimenting, but seems like at the very least after the alignment is done max depth should be updated for the chart to be drawn properly. This would provide more flexibility to the calling code.

[NoPodi]

@dcupif Can you use custom align function?

d3-sankey/src/sankey.js

Line 198 in bb7233e

const i = Math.max(0, Math.min(x - 1, Math.floor(align.call(null, node, x))));

This should control the X axis positioning of the nodes based on columns that they belong to.

Thanks for the advice! To add to this answer, this is how I did it:

sankey = d3.sankey()
  /* ... */
  .nodeAlign((node, n)=>{
      return node.customX ? node.customX : d3.sankeyJustify(node, n) // sankeyJustify can be changed to any nodeAlign() functions
  })
  /* ... */

node.customX ? could lead to an issue because if node.customX = 0 then this would jump into the else branch too

var x = 0; x === true; ==> false