dagrejs/dagre

Maintaining custom node order in dagre layout

OhadTutay opened this issue · 7 comments

Hello,
I am currently working on a project where I'm using Dagre.js for graph layout, specifically for tree structures.
While Dagre.js excels at automatic graph layout, I have a specific requirement that I'm finding challenging to implement: I need to enforce a specific order for the children of a tree node, such as rendering children from left to right.

Dagre.js automatically arranges nodes and edges to optimize the layout, which sometimes results in nodes being placed in an order that doesn't align with my intended structure. I'm looking for a way to define and maintain the order of child nodes within a tree node using Dagre.js - I want the order of the nodes to be the same as their order in the array of nodes I provide to the dagre layout.

Is there currently a feature or approach in dagre that enables such custom node ordering? If not, would it be possible to consider adding this functionality in a future release? (For reference, a similar option is available in Elk.js:
https://eclipse.dev/elk/reference/options/org-eclipse-elk-layered-layering-strategy.html (INTERACTIVE option) and
https://www.eclipse.org/elk/reference/options/org-eclipse-elk-layered-crossingMinimization-forceNodeModelOrder.html)

Thank you for your assistance.

This fork claims to support custom node order: https://www.npmjs.com/package/@pinging/dagrejs

Did you ever end up solving it @OhadTutay ? I tried Elk but the laying out isn't as good as Dagre.

@voxpelli did you try that solution?

@volkandkaya I have not tried it (yet), the fork seems a bit outdated in other aspects

@voxpelli felt the same, I have went with Elk for now. Should be easy to swap back to Dagre if they add it.

布局顺序是根据传入的节点顺序排序的
image
setNode 时,根据上面顺序插入数据
image

大佬这个key是id吗
image

布局顺序是根据传入的节点顺序排序的 image setNode 时,根据上面顺序插入数据 image

实测和setEdge也有关系