How can I cancel the default middle click event?

GoJS
1

By default, it will start zoom action after mouse middle click. Is there a way to prevent this?

2

You can set ToolManager.mouseWheelBehavior to ToolManager.WheelNone, so that mouse wheel events neither scroll nor zoom.

  $(go.Diagram, ...,
      { "toolManager.mouseWheelBehavior": go.ToolManager.WheelNone },
      . . .
  )
3

If you are looking to continue allowing only mouse wheel scrolling or mouse wheel zooming, you can override ToolManager.doActivate to always reset that ToolManager.mouseWheelBehavior property the way that you want.

For example, if you only want to support zooming:

    myDiagram.toolManager.doActivate = function() {
      this.mouseWheelBehavior = go.ToolManager.WheelZoom;
      go.ToolManager.prototype.doActivate.call(this);  // call base method
    };
1 Like
4

Thanks a lot. It is what I need.

5

Did the fix syntax change on this? What is this outside of myDiagram? Why are they separate?

6

within the context of the function (a function that exists on the Diagram’s prototype), this and myDiagram are identical in the code snippet above.

The default behavior of GoJS itself may have changed. This post is 4 years old. What are you looking to do @jliao?

7

Thanks for the quick response.

It appears by default, the middle mouse button will change the mouse wheel up/down to zoom or pan.

We only want the middle mouse button to zoom. Our users do not want to have the middle mouse button change it to pan mode.

It appears that the previous answer from 4 years ago was the answer, but having trouble implementing.

Here’s what I tried:

diagram.toolManager.doActivate = () => {
  diagram.toolManager.mouseWheelBehavior = go.ToolManager.WheelZoom
  go.ToolManager.prototype.doActivate.call(diagram)
}

This seems to also disable any other tools like panning or box selecting with left mouse button

8

FYI, “this” in that function is referring to the Diagram’s ToolManager, because that function is actually a method override on that ToolManager. In the call to the super method, you have to pass this, or else a reference to that instance of ToolManager, not the Diagram.

When I try the code I just suggested, How to disable middle mouse button to change to pan mode - #2 by walter, I find that I can still pan with the mouse or drag-select with the mouse.

1 Like
9

Exactly what we needed. changing diagram to diagram.toolManager did it! Thanks so much!