2

In a graphical user interface I'm dealing with graph-like structures. Nodes are represented either by circles or rectangles. The user should be able to draw connection lines (directed edges) between two nodes, with the possibility of defining a set of intermediate points this line should pass through.

It's no problem to create a piecewise C2-continuous Bézier curve that starts at the first node's center, goes though all intermediate points and ends at the second node's center.

Problem

But now (mainly for aesthetical reasons) I want the edges to start/end at the node boundaries instead of the center points. So how could I find suitable anchor points on the nodes' boundaries? One possibility would be to calculate the intersection points between my Bézier curve and the nodes border. But for the circle, this would result in a 6th order polynomial equation and trying to solve this numerically seems like overkill.

Possible solution

Another option I tried is to take the intersection between the node boundary and the line that goes through the two controll points of the first/last Bézier curve. While this seems like a good approximation if the intermediate points are further away from the nodes, it fails if they are close:

first cacse second case

Gray: intermediate points, green/blue: controll points, red: approximated intersection point

Are there recommended ways to solve this problem? How do existing tools deal with this?

Community
  • 1
  • 1
ph4nt0m
  • 948
  • 4
  • 10
  • 23
  • 1
    I found [this blog post](http://ciechanowski.me/blog/2014/02/18/drawing-bezier-curves/) quite useful. – nonsensation Sep 30 '15 at 16:30
  • When the circle is more to the right than the square should the spline still go away from the right(or to be more precise from the set "out"-port) or should the "out"-port point towards the square? – HelloWorld Sep 30 '15 at 18:50
  • @HelloWorld This should depend on the position of the control points. I'm looking for a way to automatically calculate where this "out" port should be in order for the whole spline to look "nice". The only input to this problem is the set of user-defined intermediate points and the position and shape of the two nodes. For connecting the center points of the nodes, Bézier splines are one possible solution (see picture), but I would like the curve to end at the shape boundaries. – ph4nt0m Sep 30 '15 at 19:13

1 Answers1

1

for the circle, this would result in a 6th order polynomial equation and trying to solve this numerically seems like overkill.

QPainterPath::pointAtPercent can be used with a simple 1D Newton scheme to find the intersection with a circle. That's really easy to do.

For squares, you can do the same, but iterate the circle radius:

  1. Start with a circle centered at the square's center, say with same area as the square.

  2. Find intersection with the circle.

  3. Extend a new circle radius to the square boundary, on a line from the center through the intersection point found in the previous step.

  4. Repeat from #2.

All of this is easy to do and should perform OK.

Never mind that solving polynomial equations is trivial with something like eigen to do the algebra for you.

Kuba hasn't forgotten Monica
  • 95,931
  • 16
  • 151
  • 313
  • Thanks, this sounds promising, but could you elaborate on how to use `pointAtPercent()` with a 1D Newton scheme? I assume you refer to Newton's method to find the root of some function, probably the function describing the difference between the circles radius and the distance of a point on the curve to the circles center. – ph4nt0m Sep 30 '15 at 19:26