Search code examples
algorithmnode-redcurve

Curve Algorithm used in Node-RED

I want to know that what algorithm is used for drawing the curve line between nodes in Node-RED Editor.

Here is an screenshot of the curved line.enter image description here

Thanks.

Solution

  • You can see the code that generates the path here:

    https://github.com/node-red/node-red/blob/d57edaa4c102a1bc2ec09f7703c7c8e6cdf04894/packages/node_modules/%40node-red/editor-client/src/js/ui/view.js#L666

    It varies the approach used to determine the path based on the relative position of the two nodes it is connecting.

    If the nodes don't overlap (that is, the right edge of the source node is to the left of the left edge of the destination node), then a simple bezier curve is used. The positions of the control points determined by the relative distance between the nodes.

    If the destination node is further to the left of the source node (that is, the wire has to loop back on itself), then it gets more complicated, using 4 different curves. Again, all of the control points are determined by the relative distance and other scaling factors.