Draw chart in button click

Question

Hi,I am using EJ2 Sync Fusion Charts with Angular 6 to create a Scatter chart as below sample.Scatter Chart with ej2 Sync FusionI want to draw the chart in the button click which is not happening at the moment but when the particular code implements inside the ngOnInit lifecycle hook that works.Please be noted that other bindings(e.g. title) are working fine and data is being retrieved in both cases. Changed files are attached.Your early response on this will be highly appreciated. Thanks in advance.Attachment: ScatterChart_6ed51e78.zip

Baby Palanidurai · Answer

Hi Lakshitha, 

Thanks for using Syncfusion products, 

    We have analyzed your query and found that the data bind are working for Axis, Title, Tooltip, theme, ChartArea, Size, legend, zooming, selection features in chart. But for changes in series property after the component is initialized, we have to refresh the chart. For example, if you want change the series collection data source in the button click, you can bind the data source to chart series and refresh the charts. 

Please find the code snippet below to achieve this requirement, 





@ViewChild('chart') 
  public chart: ChartComponent; 

public PlotChart(): void { 
     
    this.chart.series[0].dataSource = ChartData.prototype.getScatterData().series1; 
    this.chart.series[1].dataSource = ChartData.prototype.getScatterData().series2; 
    this.chart.refresh() 
  } 
} 

Screenshot: 
  

Sample for your reference can be find from below link, 
 http://www.syncfusion.com/downloads/support/forum/137595/ze/sample1986882101 
Kindly revert us, if you have any concerns. 


Thanks, 
Baby