Issues after upgrading GoJS from 2.3.5 to 3.x

I tried with 2.3.19 @walter I didn’t find any issues there.

Do we need to define our own computational logic for routing in 3.0.19?

At least the diagram has to render right with AvoidNodes routing?

No, it should just work as it did before. I would really like to know what the bug is in v3.0.

When using 3.0.19, are there any diagrams that do not cause an exception in your app? If so, is there any common charactistic associated with causing the exception?

Can we try to debug your app?

@walter Sure let’s debug. Let me know your availability.

I was thinking about your making the site/app available to us so that we could debug remotely.

Do you have answers for my other questions?

Do you load the GoJS library as a separate file?

What does this mean Walter? Do you need a stand-alone problem which has an issue?

Do you load the GoJS library via a <script> tag, either with a local copy of the file or via a CDN? I’m wondering if it would be easy to replace the library in the debugger.

We use NPM to install the GoJS package & imported using import statement.

I’m worried that a shared video session won’t be productive.

Okay. You mean connecting virtually & sharing screen can’t help @walter ?

Are you expecting an instance with the GoJS debug file? Where you can access & debug?

Hi, @walter. We found that the issue occurs when we have a group node, which should have a link connecting nodes.

Oh, that’s interesting. When you say “link connecting nodes”, are both of the Nodes members of one Group? Or are they members of different Groups? Or is one of them in a Group and the other one is a top-level Node (i.e. not a member of any Group), and if so, is the Link.toNode top-level or is the Link.fromNode top-level?

I’ve run into the exact same issue and I traced it to the isSubGraphExpanded property on groupTemplate. It always crashes for me when it is set to false. Here is a simple example:

goDiagram.groupTemplate = new this.go.Group(“Auto”, { isSubGraphExpanded: false })

If it is set to true then the graph renders without error BUT we really need the graph to start with the subGraphs closed so the diagram isn’t so large when starting.

As @mwiedmann mentioned I also observed a similar pattern. When we have isSubGraphExpanded: false we are facing this issue.

If we set isSubGraphExpanded: true OR removing group object children will render diagram.

Ah, I bet the router isn’t paying attention to whether the links are visible because they belong to collapsed groups. This is something we can fix easily. Thanks everyone!

1 Like

Sure Walter Let us know when we can expect a fix for it.

I’m unable to reproduce a situation which causes an exception. So I still need more information.

Are you also using any Routers other than the built-in AvoidsNodes Router?

I’ve tried links between member Nodes of a Group, links from a member Node to its containing Group, external links connecting with member nodes, and (external) links connecting with the group. All with the Group initially collapsed, or initially expanded.

Is there a Binding on the Link.points property? If so, is it a TwoWay Binding, and is there a “points” property on the link data when initially loading the diagram/model? In my attempt to reproduce the bug, I’ve tried the link template with and without a Binding on the “points” property.

I have this in the linkTemplate:

{
        routing: Link.AvoidsNodes,
        corner: 5,
        relinkableFrom: true,
        relinkableTo: true,
      },

I see TypeScript is telling me that Link.AvoidsNodes is deprecated. I removed that line and the graph then renders, but the link lines are now at weird angles (not horizontal/vertical any longer). I changed it to Routing.AvoidNodes and the error comes back. Is there a correct value I should use here to get the horizontal/vertical behavior with no crash?

UPDATE: It works fine with Routing.Orthogonal and Routing.Normal, but Routing.AvoidNodes crashes

Thanks. How is the Group template defined?

Here is the whole groupTemplate (using jQuery to set as this is older code). This looks great if I use Routing.Orthogonal, but then the lines will not avoid the nodes and it looks chaotic when you expand the groups.

$(
      go.Group,
      'Auto',
      {
        isSubGraphExpanded: false,
      },
      new go.Binding('background', 'isHighlighted', function (h) {
        return h ? '#dedede' : 'transparent'
      }).ofObject(),
      $(go.Shape, 'Rectangle', { fill: null, stroke: Colors.node.io, strokeWidth: 2 }),
      $(
        go.Panel,
        'Vertical', // title above Placeholder
        $(
          go.Panel,
          'Horizontal', // button next to TextBlock
          { stretch: go.GraphObject.Horizontal, background: Colors.node.io },
          $('SubGraphExpanderButton', { alignment: go.Spot.Right, margin: 5 }),
          $(
            go.TextBlock,
            {
              alignment: go.Spot.Left,
              editable: true,
              margin: new go.Margin(5, 15, 5, 5),
              font: 'bold 14px roboto, normal',
              //opacity:0.75,
              stroke: '#ffffff',
            },
            new go.Binding('text', 'label').makeTwoWay(),
          ),
        ), // end Horizontal Panel
        $(go.Placeholder, { padding: 5, alignment: go.Spot.TopLeft }),
      ), // end Vertical Panel
    ) // end Group and call to add to template Map

Does the link template have a binding on the Link.points property? If so, OneWay or TwoWay?

I’m still unable to reproduce any exception.

Do you have any Links where either the Link.fromNode or the Link.toNode are null, or where both are null?