Remove individual series from series array

[Zack]

So I'm using a polar chart and it works great except if the user sets something where the series decreases in categories. e.g.

Series = [

    {

      points: [{x: 'Calving', y: null}]

    },

    {

      points: [{x: 'Wellness', y: null}]

    },

    {

      points: [{x: 'Type', y: null}]

    }

]

Series = [

    {

      points: [{x: 'Wellness', y: null}]

    },

    {

      points: [{x: 'Type', y: null}]

    }

]

I get an error saying that "Cannot read property 'dataSource' of undefined". I'm relatively sure it's iterating over the old array to look for changes, only problem being the array is now smaller. 

Html looks like this 

      <ej-chart #chart *ngIf="chartData.length > 0" 

                [series]="chartData" 

                class="polar-chart" 

                [primaryXAxis]="primaryXAxis" 

                [commonSeriesOptions]="commonSeriesOptions"

                [primaryYAxis]="primaryYAxis"></ej-chart>

Then after some manipulation of chartData I call this.chart.widget.redraw();

Works great with new points and with changes to existing points, reducing points seems to be the issue

[Zack]

It's not points I need to remove! I need to be able to decrease the length of the series array. I've changed the model using splice but that doesn't seem to work.

[Dharanidharan Dharmasivam]

Hi Zack, 

Thanks for contacting Syncfusion support.  

We have analyzed your query. We have achieved your requirement of removing series in a button click. In this we have five series initially, you need to specify the series index value in the text box and click on remove series button, then the specified series will be removed from the chart. Find the code snippet below. 

Angular 2: 

<button  (click)="removeSeries()">Remove Series</button> 

removeSeries() { 

        let seriesIndex = parseInt($('#selection')[0]['value']); 

        let chartObj = this.Chart.widget; 

        chartObj.model.series.splice(seriesIndex, 1) 

        chartObj.redraw(); 

    } 

Screenshot before removing series: 

 

Screenshot after removing 2^nd series: 

 

Sample for reference can be find from the below link: 

http://www.syncfusion.com/downloads/support/forum/129370/ze/Sample_(2)479489808  

 

Thanks, 

Dharani. 

[Zack]

That worked! I was trying to do the same thing but with just the model 

What's the difference between the two 

 this.Chart.widget.model.series

 this.Chart.model.series

[Dharanidharan Dharmasivam]

Hi Zack, 

Thanks for your revert. 

this.Chart.model will be created before the component is loaded and it hold all the default values of the control. And this.Chart.widget.model will be created after the component is loaded and it holds the instance of chart. 

Thus changing the value in this.Chart.model will not take any effect on chart. Since this.Chart.widget.model holds the chart instance, changing the value of the properties in it, will make effect on the rendered chart.  

So, kindly use this.Chart.widget.model to redraw the chart component. 

Thanks, 

Dharani.