Search code examples
gojs

Drag vs link modes in GoJS

Is it possible to explicitly switch between dragging and linking modes in GoJS? I am trying to achieve a behavior similar to other diagram editors out there:

  1. Have 2 buttons in a toolbar outside of the diagram: an Link and a Hand.
  2. Clicking on Link button switches diagram into linking mode. Clicking any part of any node initiates LinkingTool on that node so it can be linked to another node. Node dragging is disabled.
  3. Clicking on Hand button switches diagram into dragging mode. Now mouse click on any node initiates DraggingTool, ResizingTool etc., anything but LinkingTool.

I believe I've seen such example but now cannot find it after couple hours of searching. An attempt to set diagram.toolManager.xxxTool.enabled to "false" in JavaScript does not seem to have any effect on tool activation behavior.

Solution

  • I suspect your problem is just a typo, the property is isEnabled, not enabled.

    For completeness: First you must set fromLinkable: true, toLinkable:true (or at least one) on your Node or port to enable the linking tool. Then you can conditionally disable the tool via your button:

    myDiagram.toolManager.linkingTool.isEnabled = false; // false to drag, true to link

    You can actually write that line in the console and see it live on a sample like Basic