diagram Snap zone cannot resize problem when click maximize window

[lorryl]

Hi,

Sometimes when I click maximize window or resize the dialog, the diagram snap zone will resize, even I set the width and height both is 100%.

In this case, what method should I call in the corresponding event to make the canvas automatically fill up？

[Aravind Ravi]

Hi Lorryl,

We have created a sample to update the diagram size while resize the window. By default, in the diagram , we have calculated a diagram height and width based on the parent div height and width if you set diagram width and height in percentage. We suspect that you have set the parent div height and width as px and set diagram width as 100%. So that when you resize , the diagram does not resized properly. Please set the parent div width as 100% and height as 1000px. So that when you resize, the diagram has been resized properly. Please refer to the below code snippet

<div style="width:100%;height:1000px">

  <ejs-diagram

    #diagram

    id="diagram"

    width="100%"

    height="100%"

    [getConnectorDefaults]="connDefaults"

    [getNodeDefaults]="nodeDefaults"

    [snapSettings]="snapSettings"

  >

</ejs-diagram>

</div>

Sample: https://stackblitz.com/edit/angular-9bwfkm?file=app.component.ts

Regards

Aravind Ravi

[lorryl]

My width and height must be both 100%, thanks for your reply.

[Aravind Ravi]

Hi Lorryl,

Most welcome. Please let us know if you need any further assistance on this.

Regards

Aravind Ravi