How to aggregate the series?

Hi team,

I came to some troubles of rendering an aggregated chart, for example we have data like
{
   "items": [
      {
        "site": "A Site",
          "month": "2019-01-01",
          "value": 20
        },
      {
        "site": "B Site",
          "month": "2019-01-01",
          "value": 30
        },
      {
        "site": "C Site",
          "month": "2019-01-01",
          "value": 10
        },
      {
        "site": "A Site",
          "month": "2019-02-01",
          "value": 23
        },
      {
        "site": "B Site",
          "month": "2019-02-01",
          "value": 34
        },
      {
        "site": "C Site",
          "month": "2019-02-01",
          "value": 15
        }
    ],
    "count": 6 
  },

And I want to present the sum of all sites on each month, for column chart, I can use
<EjsChart>
    <EjsDataManager Url="@URL" Adaptor="Adaptors.WebApiAdaptor" Offline="false"></EjsDataManager>
    <ChartPrimaryXAxis ValueType="Syncfusion.EJ2.Blazor.Charts.ValueType.Category"></ChartPrimaryXAxis>
    <ChartSeriesCollection>
        <ChartSeries XName="month" YName="value" Type="ChartSeriesType.StackingColumn">
        </ChartSeries>
    </ChartSeriesCollection>
</EjsChart>
as a workaround, but if I want to show an aggregated line chart, that trick won't work.

Could you provide me an example as adding some Query attributes to ChartSeries to aggregate the value over all sites?

Regards

1 Reply

DG Durga Gopalakrishnan Syncfusion Team March 6, 2020 12:33 PM UTC

Hi Feifan, 

We have analysed your query. Your requirement can be achieved by specifying chart series type as StackingLine. We have an online demo link. Please check with below code snippet and sample. 

Code Snippet 
 
<EjsChart>      <ChartSeriesCollection>            <ChartSeries Type="ChartSeriesType.StackingLine">            </ChartSeries>     </ChartSeriesCollection>  </EjsChart> 
 
Demo Link 

Please revert us, if you have any concerns. 

Regards, 
Durga G

Loader.
Up arrow icon