0

I am trying to create an image that contains nodes (represented as rectangles) and a path. Two consecutive nodes in the path should be connected with a directed edge (line and an arrowhead at the end). Each line should start at the center of a rectangle and point towards the center of the next rectangle in the path.

The question is whether there is any easy way to calculate the point where each arrow hits the rectangle. Rectangles are not necessarily aligned horizontally and/or vertically, so this is not trivial.

I have managed to come up with a solution that works quite well, but I had to remember all the geometry I was taught at school. Maybe there is an easier way to do it with rotations, instead of calculating directly the end point?

1 Answers1

1

In this example, the endpoints coincide with the centers of the connected rectangles; this obviates the need to calculate the intersection explicitly.

image

A similar approach is taken in the example cited here, using symmetric shapes.

image

Community
  • 1
  • 1
trashgod
  • 203,806
  • 29
  • 246
  • 1,045
  • Maybe my question was not clear then. If the endpoint reaches up to the center of the next rectangle, the arrowhead will be lost, because the next shape will be drawn on top of it. That's why I need to calculate the intersection. take for example the line that connects the orange with the red rectangle. I need to know where the line hits the red rectangle to put there the arrowhead. – Ioannis E. Venetis Jun 08 '13 at 17:27
  • Ah, that makes sense. You should update your question to clarify this requirement. Include an [sscce](http://sscce.org/) showing your current approach, for [example](http://stackoverflow.com/a/15607737/230513). – trashgod Jun 08 '13 at 22:19