Editable TextBlock moving with diagram scroll

GoJS
1

Hello,
I faced this issue the other day.

zone

How do I stop editable TextBlock from moving when go diagram is scrolled ?

2

What did you want to happen instead? If you want the editor (a <textarea> in this case) to continue to be in the middle of that gray node, what should happen as that node scrolls out of the viewport? Might that not cause the editor to scroll off the whole browser window?

3

Thats fine with me if the editable textblock is not even visible anymore after scrolling, but continues to remain in the middle of the group.

4

I think you’re asking for something that most people would not want. You may also have noticed that the <textarea> is shown at a normal scale even if the Diagram.scale is tiny, so that the editor remains usable without a magnifying glass.

But you can have that if you want. You’ll have to implement a “ViewportBoundsChanged” DiagramEvent listener that moves the editor. That HTML element is available as the myDiagram.toolManager.textEditingTool.currentTextEditor.mainElement.

5

OK, ill try this out.

Also there could be one more way to solve this, can i actually disable scrolls on viewport when text is editable ?
I know i can override the doactivate and dodeactivate events of edittextblock tool, but is there a way to disable scrolls?

6

You mean overriding the TextEditingTool methods? Yes, that is exactly right. Maybe something like:

$(go.Diagram, . . .,
  { . . .,
    "textEditingTool.doActivate": function() {
      this.diagram.commit(function(d) {
        d.allowScroll = d.allowZoom = false;
        d.hasHorizontalScrollbar = d.hasVerticalScrollbar = false;
      }, null);
      go.TextEditingTool.prototype.doActivate.call(this);
    },
    "textEditingTool.doDeactivate": function() {
      go.TextEditingTool.prototype.doDeactivate.call(this);
      this.diagram.commit(function(d) {
        d.allowScroll = d.allowZoom = true;
        d.hasHorizontalScrollbar = d.hasVerticalScrollbar = true;
      }, null);
  })
7

Yes, but will it actually not remove the scroll bars ? Can not the scroll bars still be there but disabled?

8

Yes. That would require setting the appropriate CSS styles on them. I didn’t have time to try all that. But you can…