This extension implements several custom animations within GoJS. It may be useful to copy some of them into your own project.

  • Double click in the Diagram background to create a node, or copy and paste nodes, to view creation animations.
  • Delete a node to view deletion animations.
  • Draw links to see new link creation animations.
  • Select a node and press the + button or the button below to see a link-and-node creation animation.
  • Reload the model using the button below to see the custom load animation


Creation Animation
Deletion Animation
Drawn Link Style

GoJS Features in this sample


GoJS offers several built-in animations, enabled by default, as well as the ability to create arbitrary animations.

The Diagram.animationManager handles animations within a Diagram. The AnimationManager automatically sets up and dispatches default animations, and has properties to customize and disable them. Custom animations are possible by creating instances of Animation or AnimationTrigger. More information can be found in the GoJS Intro.

Related samples