Multi series chart from remote data

Hi,

I am trying to implement a line chart creating series dinamically, but all examples I found are using static series. I have already try to use addSeries but no success!
I receive data from an ajax function:

let grafDados;
let ajax = new ej.base.Ajax(URL, "GET");
ajax.send();
ajax.onSuccess = function (data) {
let grade = JSON.parse(data);
grid.dataSource = grade.grid;
showGraphs(grade);

};

And then I create the chart:

function showGraphs (chartData) {
var chart = new ej.charts.Chart({
title: chartData.campos.titulo ,// tituloGrafico,
legendSettings: {
visible: true
},
tooltip: {
enable: true
},
primaryXAxis: {
valueType: 'Category',
title: 'Datas das Medições',
labelFormat: 'y',
intervalType: 'Years'
},
primaryYAxis: {
labelFormat: '{value}',
title: chartData.campos.label_vertical
},
series: [{
// dataSource for chart series
dataSource: chartData.chart,
name:'Sales',
xName: 'month',
yName: 'sales',
type: 'Line',
emptyPointSettings: {
mode: 'Average',
fill: 'pink'
}
}]
}, '#element');
}

My need is to create series dynamically and change the method series in showGraphs function.
Do you mind help me with that?



1 Reply 1 reply marked as answer

DG Durga Gopalakrishnan Syncfusion Team December 11, 2020 03:26 PM UTC

Hi Alselmo,

Greetings from Syncfusion.

We have validated your reported scenario with attached code snippet. For dynamic series update, you can use addSeries and removeSeries methods to add and remove the chart series. We have already included the sample in UG. Please find the link below.


Please revert us if you have any questions.

Regards,
Durga G


Marked as answer
Loader.
Up arrow icon