panningTool tool and drag scroll issue

GoJS
1

Hi,

I’m having a hard time to understand to behavior of the panning tool.
I’m trying to implement a very simple model that works as following:

  1. when the diagram is fully visible
    myDiagram.viewportBounds.containsRect(myDiagram.documentBounds)
    There should be no scroll and no options to move the diagram (That means panning tool is disabled) - no problem to implement that part.

  2. when the diagram is not fully visible
    !myDiagram.viewportBounds.containsRect(myDiagram.documentBounds)
    The user should be able to scroll (allowHorizontalScroll and allowVerticalScroll set to true)
    And to drag scroll (same as in google maps for example).

In any of those cases want to disable the unexpected behavior of drag and move the diagram inside the canvas.

The problem Is that in order to implement drag scroll I must enable the panning tool.
Enabling the panning tool only when myDiagram.viewportBounds.containsRect(myDiagram.documentBounds) is not enough because this will also enable the tool when there is only horizontal scroll or only vertical scroll and that will cause the drag and scroll work vertically/horizontally and move the whole diagram in the other direction.

Is there any way to allow drag and scroll without allowing to drag and move the diagram inside the canvas?

Thanks,
Dor.

2

You could override PanningTool.move to do whatever you want. Here is the definition of that method:

PanningTool.prototype.move = function() {
  var diagram = this.diagram;
  if (this.isActive && diagram) {
    if (this.bubbles) {
      diagram.lastInput.bubbles = true;
      return;
    }
    var pos = diagram.position;
    var first = diagram.firstInput.documentPoint;
    var last = diagram.lastInput.documentPoint;
    var x = pos.x + first.x - last.x;
    var y = pos.y + first.y - last.y;
    if (!diagram.allowHorizontalScroll) x = pos.x;
    if (!diagram.allowVerticalScroll) y = pos.y;
    diagram.position = new Point(x, y);
  }
};

Feel free to adapt the code for your own needs.