GoJS 3.0 released

GoJS 3.0

GoJS 3.0 brings a number of new features for advanced Diagram control, such as custom routing via Routers and data-bound theming with Themes. We have also rewritten some of the internals to take advantage of modern JavaScript, and rewritten the API to use clearer enumerations. These changes are largely backwards-compatible.

There are a number of other changes, detailed below.

New npm packages

For 3.0, the gojs npm package contains only the release libraries, and no extensions, documentation or sample code. The documentation, sample, and extensions code can be downloaded separately, via npm create gojs-kit.


GoJS 3.0 leverages modern JavaScript and more modern Canvas API features for increased performance. However, this also means dropping support for old browsers such as IE11, and there are a number of minor incompatibilities detailed below.

Diagram rendering is now generally faster, and Diagram heap size has been significantly reduced, especially for large graphs.


AvoidsLinks Router

One has always been able to customize the computed paths for Links by setting properties on a Link or on its connected port elements, or by overriding methods on a custom Link subclass. There is now support for a separate routing phase where instances of Router can modify Links. See the intro page on routers for more information.

GoJS 3.0 introduces the AvoidsLinks Router, which attempts to separate parallel link segments, and can work alongside AvoidsNodes routing.


GoJS now provides functionality to define and manage themes, and GraphObjects can now be themed via theme bindings. This allows for applications to more easily provide multiple themes, especially light and dark mode. See the intro page in theming for more information.

Viewport Layers

There are two new default layers in each Diagram, "ViewportBackground" and "ViewportForeground". These layers have the new property Layer.isViewportAligned set to true. Parts in viewport aligned layers will not obey the Diagram.position or Diagram.scale properties, so as the user scrolls or pans or zooms they will remain fixed in the viewport.

Layers with Layer.isViewportAligned set to true will automatically position and scale their Parts to be relative to the viewport, based on the Part’s GraphObject.alignment and GraphObject.alignmentFocus values, not on its Part.location or GraphObject.position.


GoJS now uses Typescript enumerations to represent possible values for many properties. This enables autocompletion in some text editors. Some examples:

  • Where one wrote: new go.Panel({ stretch: go.GraphObject.Fill }),
    one can now write: new go.Panel({ stretch: go.Stretch.Fill }).
  • Where one wrote: new go.RowColumnDefinition({ column: 1, sizing: go.RowColumnDefinition.None }),
    one can now write: new go.RowColumnDefinition({ column: 1, sizing: go.Sizing.None }).
  • Where one wrote: new go.TreeLayout({ alignment: go.TreeLayout.AlignmentStart }),
    one can now write: new go.TreeLayout({ alignment: go.TreeAlignment.Start }).

The original static EnumValue properties have been deprecated in favor of these new enumerations, but continue to exist for compatibility. So, for example: go.GraphObject.Fill === go.Stretch.Fill. The never-documented EnumValue class has been removed from the library. The new enum values are numbers.

Other New Features

For more changes and incompatibilities, see the Change Log