Trouble with ngx-graph dagre layout

Question

I am struggling to make @swimlane/ngx-graph work for my project. I've invested a lot of work into getting it to this point, but as soon as I've tried to get the library to draw the edges between nodes, it starts generating errors. I've tried every one of the layouts, and get different errors from each. I'll keep this post just about Dagre, since this is the layout I'd like to build my custom layout from.

Here is the error I get with the 'dagre' layout:

ERROR TypeError: dagreNode is undefined
    node swimlane-ngx-graph.mjs:524
    run swimlane-ngx-graph.mjs:524
    draw swimlane-ngx-graph.mjs:1553
    createGraph swimlane-ngx-graph.mjs:1538
    Angular 21
    createGraph swimlane-ngx-graph.mjs:1538
    update swimlane-ngx-graph.mjs:1483
    Angular 5
    update swimlane-ngx-graph.mjs:1476
    ngOnChanges swimlane-ngx-graph.mjs:1419
    Angular 8
    next graph.lens.ts:62
    RxJS 6
    setNode graph.ts:70
    Angular 32
    ConsoleComponent_Template console.component.html:35
    Angular 33
    14913 main.ts:5
    Webpack 7
core.mjs:10920:22
    Angular 2
    RxJS 6
    Angular 22
    createGraph swimlane-ngx-graph.mjs:1538
    update swimlane-ngx-graph.mjs:1483
    Angular 5
    update swimlane-ngx-graph.mjs:1476
    ngOnChanges swimlane-ngx-graph.mjs:1419
    Angular 8
    next graph.lens.ts:62
    RxJS 6
    setNode graph.ts:70
    Angular 32
    ConsoleComponent_Template console.component.html:35
    Angular 33
    14913 main.ts:5
    Webpack 7

I'm having a bit of trouble understanding what the layout is expecting from my Graph class objects. I made sure that my Graph class implements both NgxGraph and D3Graph, and contains all members for both. I've dove into the code for the dagre layout, and it look to me like it is accessing the graphs _nodes and _edges properties. These aren't in either interface, but it appears as though these are Maps, so I mirrored that architecture in my class as well. Like so:

 get nodes(): Node[] {
    if (this.cachedNodes) return this.cachedNodes;
    this.cachedNodes = [...this._nodes.values()];
    return this.cachedNodes;
  }

I want to be clear that there are no issues so long as I don't try to create any edges, the whole thing is stable with dagre or my custom layout when only drawing nodes.

So I have two questions:

Does anyone recognize this error and/or have any suggestions for a path forward in troubleshooting?
Is there anywhere where I can find a clear definition of what the Layout class should do and what ngx-graph is expecting of it? The github docs have examples, but each of the layouts in the library is structured differently. The only common function is run().

Thank you in advanced for any suggestions or assistance.

Trouble with ngx-graph dagre layout

0 Answers0