graph.changeSize() expands but doesn't shrink the graph canvas

[eakl]

Describe the bug

graph.ChangeSize() is not shrinking the canvas once it has been expanded.

Here is the code I use to resize the graph when width or height change

graph.current?.set('width', width)
    graph.current?.set('height', height)
    const canvas = graph.current?.get('canvas')
    if (canvas) {
      canvas.changeSize(width, height)
      // graph.current?.autoPaint()
    }

Your Example Website or App

CodeSandbox: https://codesandbox.io/s/usesize-g6-9b9t7v

Steps to Reproduce the Bug or Issue

1. Load the sandbox and open the graph on a new tab
2. Open the console
3. Expand the width of the window. The canvas resize and you can see the new width in the console
4. Shrink the width of the graph. The canvas doesn't shrink (scroll right to see that the canvas is still expanded)

Expected behavior

graph.changeSize() should expand and shrink the canvas

Screenshots or Videos

No response

Platform

• OS: macOS
• Browser: Brave - version 1.36.109 Chromium: 99.0.4844.51 (Official Build) (arm64)

Additional context

No response

[Yanyan-Wang]

I think it is not a problem of G6, since useUpdateEffect is not triggered every time the window size changed in your code.

And, it will be better to call graph.changeSize(width, height) instead of using the API of canvas

[eakl]

useUpdateEffect has useSize(graphRef).width and useSize(graphRef).height as dependencies. Shouldn't the function be triggered every time the container resizes?

By using graph.changeSize(width, height), the window expands but the canvas doesn't (The graph is hidden by the old canvas boundaries when you drag the canvas)

[Yanyan-Wang]

useUpdateEffect has useSize(graphRef).width and useSize(graphRef).height as dependencies. Shouldn't the function be triggered every time the container resizes?

Maybe you could console sth in the useUpdateEffect to see if it is triggered as expected

[Yanyan-Wang]

Hi, dear user. Since there was no response for a long time, we cannot figure out the answer of the problem you described. If there is new progress, feel free to open a new issue.