Skip to content

incorrect edge positioning when switching between graphs (DagreNodesOnlyLayout) #618

@cmgchess

Description

@cmgchess

Describe the bug
When dynamically switching graph data (nodes and links) using a Dagre layout, edges are rendered in incorrect positions after the graph data changes.
Calling update$ forces the layout to recompute and corrects the edge positions, but introduces a visible flicker where edges briefly render incorrectly before snapping into the correct layout.
In ngx-graph v8.4.0, switching graph data results in correctly positioned edges without requiring any additional update trigger

To Reproduce
Steps to reproduce the behavior:

  1. Go to demo
  2. Notice the edge positioning in the initial loading
  3. Switch between scenario 1 and 2 and notice the subsequent edge positioning

Expected behavior
That the edges properly positioned

Screenshots
Initial load

Image

First switch (click scenario 2) - notice the edge positioning

Image

Second switch (click back scenario 1) - notice the edge positioning

Image

Demo
https://stackblitz.com/edit/playground-angular-17-material-nsu3nd-zcaeusbs

ngx-graph version
>=9.0.0

Additional context
Manually triggering the update$ or using a setTimeout would properly position the edges, but with a visible flicker

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions