I am working on an animation to zoom, scroll and center a node horizontally. It works fine but when the node is more on the left or right of the diagram it can happen that while zooming in the animation flips right and left before arriving at the node.
I tried several Easing options, taking more time for the animation switching the order of the animation and trying to split it into several animations but nothing solved getting rid of this curving/bouncing.
Here is a video where you can see that the animation is not direct to the node but does a little curve. How can I get rid of that?
Here is the code:
const centeredWidth = (diagram.viewportBounds.width * diagram.scale) / 2; const animation = new go.Animation(); animation.easing = go.Animation.EaseLinear; animation.add(diagram, 'scale', diagram.scale, 1); animation.add( diagram, 'position', diagram.position, element.actualBounds.copy().offset(-centeredWidth, -180) ); animation.start();