Hi vin,
On our further analysis of the shared details, we found the browser’s page scroll bar appeared along with diagram scroll bar. We suggest you use the following code to avoid the browser’s scroller bar, but diagram scroller will appear because the diagram content (nodes and connectors) is bigger than the viewport size. The diagram control has also scrollers because the created diagram content is bigger than the page view port size. Please refer to the following sample for how to avoid browser scroller using CSS property. We suggest you set the parent div element of the diagram as “width:100% and height:100%” to avoid the browser scroller. It you want to remove the diagram’s scroller means, we need to make the entire diagram content fi to the viewports area. To achieve this, we suggest you call FitToPage API to fit the diagram inside the available view port area. We have added a button to call the FitToPage API in the below sample and we can find the diagram’s scrollers disappear when click on the “fitToPage “ button.
Code snippet:
|
<div style="width:100%;height:100%">
<ejs-diagram #diagram id="diagram" width="100%" height="590px" [layout]='layout' [dataSourceSettings]='data' [setNodeTemplate]='setNodeTemplate' [tool]='tool' [snapSettings]='snapSettings'>
</ejs-diagram>
</div> |
If still the reported problem persists means we suggest you replicate the reported issue I n the above sample that will help us to serve you better.
Regards,
Gowtham.
