dagrejs / dagre-d3

A D3-based renderer for Dagre
MIT License
2.85k stars 587 forks source link

Fix render transitions #342

Closed akosel closed 6 years ago

akosel commented 6 years ago

Fixes regression discussed in https://github.com/dagrejs/dagre-d3/issues/321.

The commit to update to d3.js v4 brought in a change that forces a complete redraw of the graph (due to removing the DOM tree underneath the graph element. Additionally, a number of other locations were mixing up entering v exiting v updating, so I cleaned that up a bit. Also, fixed an issue in the exit function for edgePaths that causes the createLine call to always fail as it passes in an empty object, which will always lead to an undefined curve function being called.

lutzroeder commented 6 years ago

Thank you for looking into this.

Tried these steps with new painting over existing:

  1. Build and open interactive-demo.html
  2. Replace definition with digraph { X [ label="Foo" ]; }
  3. Changed the label to Bar
screen shot 2018-10-03 at 6 45 26 pm
akosel commented 6 years ago

Thank you for looking into this.

Tried these steps with new painting over existing:

  1. Build and open interactive-demo.html
  2. Replace definition with digraph { X [ label="Foo" ]; }
  3. Changed the label to Bar
screen shot 2018-10-03 at 6 45 26 pm

This should now be fixed.

lutzroeder commented 6 years ago

The same seems to be happening with edge labels, changing the font or adding characters.

Example 1

screenshot

Example 2

screenshot2
akosel commented 6 years ago

Ah, good catches. Ok, that second one is now fixed. If you see anything else please keep sending them along. I'm less familiar with all the edge cases, so this is helpful.

akosel commented 6 years ago

Ah wait, just noticed the second image there seems to be a separate issue. I'll add something for that too.

akosel commented 6 years ago

Ok, both of those cases are now handled.