Animate diagram when change diagram position


#1

Hi. I have a case when I need to animate my diagram when changing diagram’s position x.
Example:

diagram.position = new go.Point(diagram.position.x + value, diagram.position.y);

I’ve set up animationManager for diagram, so animationManager.isEnabled: true.
But I don’t see any animation even if I increase animation duration.

How it’s possible to move diagram to specific value (like changing diagram position x) with animation?

Thanks in advance.


#2

You can use the undocumented method, AnimationManager.prepareAutomaticAnimation.

function repositionDiagram() {
  myDiagram.startTransaction("reposition diagram");
  myDiagram.animationManager.prepareAutomaticAnimation("reposition diagram");
  myDiagram.position = new go.Point(100, 100);
  myDiagram.commitTransacation("reposition diagram");
}

Here is some info about the method:

Begins listening for changes to Diagram.position, Diagram.scale, and Part positions, and animates those automatically in the near-future.

This is called after Diagram.startTransaction and the animation begins when Diagram.commitTransaction is called.

Calling this method stops any currently running animation.

@param {string} reason The reason the animation is to begin. This is added to a list of reasons, which informs whether or not the animation manager can start.
@param {any=} options a JavaScript object detailing optional arguments for animation.
Possible options:

  • reason:
    The reason the animation is to begin. This is added to a list of reasons, which informs whether or not the animation manager can start.
  • excludedProperties:
    An array of property names to exclude from this animation. For instance, if you do not wish to animate positions or locations, you could set { excludedProperties: ['position', 'location'] }
  • onChange
    Callback; invoked on every animation
  • onComplete
    Callback; invoked when only this animation is completed
  • easing
    Easing function
  • duration
    Duration of animation. Defaults to AnimationManager.duration.

#3

@jhardy, thank you so much for your quick response!
I’ve tried and it works great. It’s exactly what I expected.


#4

@jhardy,
Do you know why it’s undocumented?
Would it be added to documentation or would it be deprecated in closest future?
What do you think – can this solution be used in long term project?


#5

It will be added in a future version. The API for it is in development, and may change significantly between now and when it is documented.

What do you think – can this solution be used in long term project?

Yes, though you may need to change your code as you update the library.