WPF Diagrams: A* connection pathfinder

When creating a diagramming application, automatic connection path routing is an important part of the user experience. Ideally the connections should be routed without overlapping any of the nodes in the diagram. Any overlaps can cause confusion and make the diagram difficult to follow. Mindscape WPF Diagrams comes with a few different path routing algorithms which are good for different types of diagrams. The most powerful path router we provide is the AStarPathfinder. As the name suggests, this uses the A* alogirithm which is a popular choice for finding near optimal paths with high performance. This pathfinder focuses on creating connection paths that have a minimum number of corners and produce minimal node overlaps (which usually means no overlaps at all).

If you have used our AStarPathfinder in your application, you may have noticed that although it is great for minimizing node overlaps, it can still result in overlapping multiple connections. Below is an example of the AStarPathfinder being used in a simple diagram. There are several places where you can see multiple connections look like they are being merged together. This makes it difficult for users to see excatly which connection points each connection is being routed between.

Previous A* path routing

We’ve recently made some improvements to the AStarPathfinder which allow it to minimize overlapping parallel connection segments. To take advantage of this feature, you can use the new constructor overload to pass in the desired spacing between parallel segments. The default constructor uses a connection spacing of zero so as not to unexpectedly change the behaviour of existing applications. To use a pathfinder in your diagrams, start by implementing a custom diagram connection type (if you havn’t done so already). To do this, simply extend the DiagramConnection class and provide one of the required constructors. Then you can override the Pathfinder property to return an instance of a pathfinder of your choice. Note that it is best to return a static instance of a pathfinder rather than creating a new instance in the Pathfinder property. Here is a full example of a custom connection implementation which uses the AStarPathfinder with a connection spacing of 6.

public class CustomConnection : DiagramConnection
    private static AStarPathfinder _pathfinder = new AStarPathfinder(6);
    public CustomConnection(DiagramConnectionPoint from, DiagramConnectionPoint to)
        : base(from, to)
    public override IPathfinder Pathfinder
        get { return _pathfinder; }

To include custom connections in a diagram, either build them manually in code and add them to the diagram, or create a custom connection builder to incorporate them in the UI. Come visit the forum if you have any questions about custom connections.

To finish off, here is an image of the same diagram above, but using the new connection spacing feature of the AStarPathfinder. Here you can see the connection paths are much more defined and you can clearly see how the nodes are connected together.

Improved A* path routing

As a bonus, while we were in there we made some performance improvements to our A* implementation. So if you’re using the AStarPathfinder, it’s worth upgrading even if you don’t need the connection spacing feature. You can download this update through the currently nightly builds. Get the trial version from the downloads page, or go to your account page if you’re already a customer.

Tagged as WPF Diagrams

One Response to “WPF Diagrams: A* connection pathfinder”


Join our mailer

You should join our newsletter! Sent monthly:

Back to Top