I want to fit the chart to the parent element.

[Pylori]

Hi,

How can I fit the chart to the parent element?

I styled the e-chart and thought it fits the parent element, but the element inside the chart sticks out.

The source is as follows.

Regards, 

Pylori.

[Srihari Muthukaruppan]

Hi Pylori, 

 

We have analysed your query. From that, we would like to let you know that the chart is responsive with respect to the width and height of its parent element, if its zero, then it will render with its default size(600 * 450). Since while the dashboard panel resizes the height and width of the parent element seem to be zero and the chart gets rendered with the default size. Hence we suggest refreshing the chart manually after panel resize to achieve your requirement using created() and resize() event of DashboardLayout component. we have also modified the style of chart using the class name to achieve your requirement. Please find the below sample, code snippet and screenshot 

  

Sample:  https://www.syncfusion.com/downloads/support/directtrac/general/ze/DashboardResize18.3.501882629186.zip 

  

Code Snippet: 

@Html.EJS().DashboardLayout("defaultLayout").Resize("resize").Created("created").Columns(5).AllowResizing(true). 

// add your additional code here 

<script> 

 

    function created() { 

       var chart = document.getElementById("container").ej2_instances[0]; 

       chart.refresh(); 

    } 

    function resize() { 

        var chart = document.getElementById("container").ej2_instances[0]; 

        chart.refresh(); 

    } 

         

 

</script> 

<style> 

    .e-chart { 

        height: inherit !important; 

    } 

    .e-accumulationchart{ 

        height: inherit !important; 

    } 

</style> 

 

Screenshot: 

 

 

 

 

Let us know if you have any concerns. 

 

Regards, 

Srihari M  

[Pylori]

Hi,

thank you for your answer.

I tried the sample.

The behavior of the DashboardLayout component was smooth and very good.

Proceed with development using the DashboardLayout component.

Regards,

Pylori.

[Baskaran S]

Hi Pylori, 

  

Thanks for your update. 

  

Regards, 

Baskaran S