Animation class

Animations are used to animate GraphObject and Diagram properties.

This class is useful for creating manual animations. If you wish to animate particular properties on a GraphObject every time their value changes, you may want to use AnimationTriggers instead, which automatically create and start Animations.

The AnimationManager#defaultAnimation is an instance of this class, and carries out the default animations in GoJS: Model load, layout, expand and collapse, and so on. See the Introduction Page on Animations for more detail on the different kinds of animations.

Manual animations are set up by creating an instance of this class, and calling #add at least once, then calling #start. The method #add specifies which objects and which animation effects/properties to animate, plus start and end values for the property. As objects are added to an Animation, the Animation infers which Diagram and AnimationManager is relevant.

Animations are started by calling #start, and stopped when the #duration is reached, or when #stop is called, or stopped when AnimationManager#stopAnimation is called with true as its argument.

Animations can continue indefinitely if #runCount is set to Infinity. Animations can act upon temporary copies of an object that will get destroyed by calling #addTemporaryPart. This is useful when crafting cosmetic animations of parts that are about to be deleted: Since the part will no longer exist, you can instead animate a temporary part disappearing.

A simple example usage is this:

var node = myDiagram.nodes.first();
var shape = part.findObject("SHAPE"); // assumes this Node contains a go.Shape with .name = "SHAPE"
var animation = new go.Animation();
// Animate this Node from its current position  to (400, 500)
animation.add(node, "position", node.position, new go.Point(400, 500));
// Animate the fill of the Shape within the Node, from its current color to blue
animation.add(shape, "fill", shape.fill, "blue");
// Both of these effects will animate simultaneously when start() is called:
animation.start();

See the Introduction Page on Animations and the Custom Animations sample for more example usage of the Animation class.

Unlike the AnimationManager#defaultAnimation, Animations can be started any time, and do not stop automatically when a new transaction begins.

Constructors

Properties

Methods

Operators

Static Properties

typings.gojs library