Resize parts of diagram

GoJS
1

I have a diagram, the div has width:100%, but I need to change the width to 85% when clicking a button… The problem is the diagram has a scroll now, and I would like to resize all the parts of the diagram to fit the 85% size, I saw an example with RequestUpdate, but it doesn´t work, is there another way to do that? Because I want the button to change the width of the div from 100% and 85%.

2

You could set Diagram.autoScale so that it automatically rescales the diagram to fit (either entirely or just in one dimension). But that would prevent users from zooming in or out.

More plausible would be for you to call CommandHandler.zoomToFit after you have changed the Div size and the Diagram has had time to adapt to the new Div size.

3

image

I’m doing this, but it doesn´t work

image

Maybe do you know the reason for this?

4

How does setting inEdition cause the “processMap” Div to change size?

Only call CommandHandler.zoomToFit (or Diagram.zoomToFit) after the actual Div has changed size.

6

Now I have the solution, I just put a little delay after resizing the div, thanks for the support!

7

Actually, here’s a solution that doesn’t involve explicit delays:

  new go.Diagram("myDiagramDiv", {
      "ViewportBoundsChanged": e => {
        const info = e.subject;
        if (info.newCanvasSize.width !== info.canvasSize.width) {
          e.diagram.zoomToFit();
        }
      },
      . . .