Work with waypoints on connectors

draw.io 08 Jun 2020

Share:

Connectors show how the different shapes in the diagram are related. In complex diagrams, you are likely to have many overlapping connectors. While line jumps are useful when you have one or two connectors that cross but shouldn’t intersect, you can change the path that your connectors take to make your diagram clearer by adding extra waypoints.

Add waypoints to connectors

There are several ways you can add waypoints to connectors. The easiest way to add a waypoint is to drag the blue points on the connector to the path you want it to take.

  1. Select the connect you want to reroute.
  2. Drag the connector into a new position.

As you drag the connector, new waypoints are added automatically and intelligently, depending on where you grabbed the connector.

Drag the connector to automatically add waypoints

If you prefer not to drag connectors around, you can use the menu.

  1. Right-click on the connector in between two way points to display the context menu.
  2. Select Add Waypoint.

Use the context menu to add waypoints to a connector

Tip: To join connectors instead of overlapping them, use the waypoint shape in the Misc shape library. It looks like a solid waypoint in your diagram, and acts like a normal shape. Drag connectors from the waypoint shape, and drop connectors onto the waypoint shape to better organise the connectors in your diagram.

Remove a waypoint from a connector

  1. Select the connector where you want to remove a way point.
  2. Drag the appropriate section of the connector back into a position such that the way point is removed.

Drag the connector back to remove waypoints

You can also use the context menu to remove way points.

  1. Select the connector first, then right-click on one of the existing way points.
  2. Select Remove Waypoint.

Use the context menu to remove a waypoint from a connector

Note: If you flip a connector horizontally or vertically while it is attached to a shape, its waypoints will be changed or deleted automatically.

Clear all waypoints

By clearing all of the waypoints in a connector, it will revert to the shortest path between the two shapes.

  1. Right-click on the connector you want to reset to see the context menu.
  2. Select Clear Waypoints.

Note: You can alternately use the context menu and dragging to add and remove connectors. Use whichever method suits you best.

Use the context menu to clear all waypoints on a connector

Adding and removing waypoints by dragging connectors and using the context menu works for many styles of connectors that you can set in the Style tab of the format panel on the right. The Straight connector style does not allow waypoints as it always takes the shortest path between the two shapes.

Follow us on GitHub, Twitter, Facebook.

Share: