Use a table column as a delimimter for chart series

[Matthias]

Hello

Is it possible to use a table column as a delimimter for chart series.

I have a table like this:

I want to add a chart series for each category.

If I have understood correctly, the table should look like this in order to be displayed correctly by syncfusion:

Can I display the chart without reformatting the table? In this case I would have to teach syncfusion that the category column is the separator.

Regards,

Matthias

[Durga Gopalakrishnan]

Hi Matthias, 

Greetings from Syncfusion. 

We suggest you to split the data into separate array based on category in chart load event and assign its values to each series data source. We have prepared sample based on your requirement.  

Code Snippet : 

<ChartComponent load={this.load.bind(this)}> 

</ChartComponent> 

load(args){ 

      let data1 = [], data2 =[]; 

      for(let i = 0; i<data.length; i++){ 

        if(data[i].Category == "Temperature") 

            data1.push(data[i]); 

        else 

            data2.push(data[i]); 

      } 

      args.chart.series[0].dataSource = data1; 

      args.chart.series[1].dataSource = data2; 

    }; 

Screenshot :  

 

Sample : https://stackblitz.com/edit/react-b68dmv-zymdee 

Kindly revert us if you have any concerns. 

Regards, 

Durga G 

[Matthias]

Hi,

Thank you very much for the answer.

I had now also achieved the result with the DataManager query.
However, the proposed solution will probably be the better one.

[Durga Gopalakrishnan]

Hi Mat, 

Most welcome. Please get back to us if you need any further assistance. We are always happy in assisting you. 

Regards, 

Durga G