How to make org chart web part dynamically take up all available space (width) on the screen?

On a page, I added the web part, by default it takes up very little of the actual width of the screen...

I have looked at some of the custom JavaScript a CSS articles on this but I cannot get it to take up the full width of the screen?

Does anyone have this that I can use?


Hi @mattw112,
Can you, please provide some more details on your setup?
To zoom in on the OrgChart, you can use the zoom() method:

renderer.zoom(1.2)  // to zoom in 20%

However, the width of the OrgChart also depends on the layout used. Can you paste a screenshot of your OrgChart so that we can get the idea of what's actually off?

I simply want it to be responsive and take up the full width of the screen, right now it cuts off and doesn't take up full screen width. Not talking about zoom. Talking about the web part width.

Hi @mattw112,
Could it be that you're using a section layout on the SharePoint page that does not give all the space to the web part? Please see that it's not controlled by the OrgChart settings but by the layout settings of the SharePoint page.
Please check the settings of the section:


It does look like the container width is controlled by some custom CSS property. Can you, please confirm if you have any Custom CSS in the Configuration Wizard (please provide a screen of your Custom CSS tab in this case). Thanks!