Click in the diagram and then try zooming in and out of the diagram by using control-mouse-wheel. If you don't want to hold down the control key, click the mouse wheel button in the diagram to toggle between mouse wheel events zooming instead of scrolling.
This diagram uses a custom CommandHandler to replace the standard zooming behavior. The CommandHandler.decreaseZoom, CommandHandler.increaseZoom, and CommandHandler.resetZoom commands no longer change the Diagram.scale. Instead they change the effective Part.location for all of the Nodes by changing the value of the conversion function that is getting the location from the "loc" property on the node data.
As the value of SpacingCommandHandler.space changes, all of the Bindings on "loc" are re-evaluated, causing the nodes to get new locations. The value of the "loc" data property remains unchanged by the Binding. However the TwoWay Binding does cause the "loc" data property to be modified when the user drags a node.
The conversion functions also depend on the SpacingCommandHandler.isYSpaced property, which can be toggled by the checkbox. When false the conversion functions do not space along the Y axis, but only along the X axis.
Because the conversion functions are dependent on the particular Diagram, and because the node template depends on the conversion functions, the template cannot be used by other Diagrams.
The SpacingCommandHandler.space property is duplicated on the Model.modelData object, both so that the information is saved in the model as well as to support undo/redo.
A CommandHandler handles all default keyboard input events in a Diagram. There are many predefined methods on CommandHandler that implement common commands to operate on the Diagram or the current Diagram.selection>.
You can override CommandHandler.doKeyDown to handle additional keyboard shortcuts or to change which commands are invoked via the keyboard.
Your code can invoke a command by calling the appropriate method on the Diagram.commandHandler. Each command method has a corresponding can... predicate that your code can use to enable or disable any buttons that invoke the command. Your code can customize the behavior of a command by overriding the method on CommandHandler, or by setting properties on the CommandHandler or Diagram or Parts -- see GoJS Permissions.
There are several CommandHandler extensions that provide additional functionality.
More information can be found in the GoJS Intro.