Height does not set to pannel height

[Shivani Bhilare]

When panel resized width is getting applied according to panel width but height is not resizing according panel height.

Tried using in ts =>this.chartComponent.chartResize(this.event)

In html=> ejs-Charts => style='display:block; width: 100%; height: 100%'

[Durga Gopalakrishnan]

Hi Shivani, 

Greetings from Syncfusion. 

We request you to specify height and width as 100% for chart and refresh the chart while resizing the panel. We have prepared sample based on your requirement. Please check with below snippet and sample. 

app.component.css 

#chartcontainer{ 

    width: 100%; 

    height: 100%; 

  } 

 

app.component.html 

<ejs-chart #chart style='display:block;' width="100%" height="100%" align='center'> 

</ejs-chart> 

 

app.component.ts 

onResizeStop(args: any) { 

    if ( args.element && args.element.querySelector('.e-panel-container .e-panel-content ejs-chart') ) { 

      const chartObj = args.element.querySelector('.e-panel-container .e-panel-content ejs-chart').ej2_instances[0]; 

      chartObj.height = '100%'; 

      chartObj.width = '100%'; 

      chartObj.refresh(); 

    } 

  } 

 

 

Sample : https://stackblitz.com/edit/angular-irexzx-zbdld3 

Kindly revert us if you have any concerns. 

Regards, 

Durga G