[Help]: Use dagre.js bendPoints of edges

[coonh]

Use dagre.js bendPoints of edges

I am using FoblexFlow for a fixed top down tree. Layouting is done by dagr.js (also tried elk.js)

Fixed means I can not drag or move nodes, but I am able to zoom or move the canvas.

Both those libraries provide edges containing edges with bendPoints, but I do not understand how i can draw these edges with these bendPoints in FoblexFlow. Is this not supportet or have i not understood the was the custom ConnectionBuilders work?

[siarheihuzarevich]

Hi! Thanks for the question.

Foblex Flow does not support bend points out of the box. If you’re using external layout engines like dagre.js or elk.js and trying to inject custom bend points into the connections — that won’t work automatically. The library draws connections based on a start and end position (or anchor side), and optionally uses a ConnectionBuilder to compute the SVG path. But this builder is pure — it doesn’t know anything about external layout engines or multiple bend points.

If you want to support bend points, you would need to implement your own ConnectionBuilder and feed it the bend points manually from your own state. Foblex Flow does not recalculate the shape based on external geometry — it’s completely controlled.

Also, keep in mind: if the nodes move, you’ll be responsible for recalculating the bend points and redrawing the path — Foblex Flow won’t infer that for you.

https://flow.foblex.com/examples/custom-connection-type