Multiple links between nodes in a LayeredDiagraphLayout

I have a layered digraph layout in an existing app and now trying to add the ability to show multiple links between the same pair of nodes. It currently just draws the links on top of one another, and I can’t seem to convince it to do otherwise. In this diagram, I have two links drawn between nodes three and five, but they now overlap. I’d like them drawn so that the labels don’t overlap. How can I do this? I see that if I remove the LayeredDigraphLayout, these links get drawn non-overlapping, but layered digraph is the layout I really want.

image

Here’s a fiddle with this example: gojs semi-hidden links - JSFiddle - Code Playground

That routing behavior is controlled by the fromSpot and toSpot.

First, I would turn off the automatic assignment of spots by the layout, by setting LayeredDigraphLayout.setsPortSpots to false. That will get you different routing behavior for the links, but you probably won’t like the results. So…

Second, I suggest that you set the Node’s port’s spots as follows:

    fromSpot: go.Spot.BottomSide,
    toSpot: go.Spot.TopSide