How to reinitialize multiple charts (Chart Width issue)

Question

I used multiple types of charts in dashboard. I have noticed that chart size will be 100% only on the initial page load. If I redirect to other link and again get back on same component, charts are not rendered in full size until window size is changed manually either by resizing the chrome or pressing F12 for inspect element. How do I fix this issue?

We are using React js with syncfusion-ej2

Here is the image of chart after redirecting back on same component.
https://tinyurl.com/y3dxmg6k

Durga Gopalakrishnan · Accepted Answer

Hi Nikita,

Greetings from Syncfusion.

We have validated your reported scenario. We suggest you specify height and width for chart as 100% for each template in dashboard panels. Charts are refreshed properly on resizing the browser. We have prepared sample for your reference. Please check with the below snippet and screenshot.

Code Snippet

//…

</ChartComponent>

Before Resize

After Resize

Sample

https://stackblitz.com/edit/react-qji2yz

Since we are unaware of your exact scenario in which an issue is reproduced, please share the following information which will be more helpful for further analysis and provide you the solution sooner.

Try to reproduce the reported scenario in the above sample.
Please share your sample (or) code snippet with full configurations.
Share the details if you have done any other customization in your sample.
Share your data source file.
Share your preview template version.

Kindly revert us, if you have any concerns.

Regards,

Durga G