Removing and adding back a series in SfChart does not display data for the series

[Michael Aston]

If a series is dynamically removed from a SfChart and then added back, the series is added but the data for the series is not displayed. See attached video.

<div style="height:100%; width:100%">

    <SfSpinner CssClass="e-spin-overlay" ZIndex="2000" Visible=true @ref=@SpinnerObj />

    @if (this.DashBoardTileDataObj?.TargetOfEvaluationOverdue != null && this.DashBoardTileObj?.Settings != null)

    {

        <SfChart @ref=@ChartObj>

            <ChartArea><ChartAreaBorder Width="0"></ChartAreaBorder></ChartArea>

            <ChartEvents OnExportComplete=@GetChartImage Loaded=@OnLoaded></ChartEvents>

            <ChartPrimaryXAxis ValueType="Syncfusion.Blazor.Charts.ValueType.Category">

                <ChartAxisMajorGridLines Width="0"></ChartAxisMajorGridLines>

            </ChartPrimaryXAxis>

            <ChartPrimaryYAxis>

                <ChartAxisLineStyle Width="0"></ChartAxisLineStyle>

                <ChartAxisLabelStyle Color="transparent"></ChartAxisLabelStyle>

                <ChartAxisMajorGridLines Width="0"></ChartAxisMajorGridLines>

                <ChartAxisMajorTickLines Width="0"></ChartAxisMajorTickLines>

            </ChartPrimaryYAxis>

            <ChartSeriesCollection>

                @if (this.DashBoardTileObj.Settings.Where<DashBoardTileSetting>(x => x.SettingId.Equals(DashBoardTileSetting.TileSettingType.TargetOfEvaluationOverdueControlWeakness)).First().BoolValue == true)

                {

                    <ChartSeries [email protected] XName="TimePeriod" YName="ControlWeakness" [email protected]("Control weakness") Type="ChartSeriesType.Column">

                        <ChartSeriesAnimation Enable=@Animation></ChartSeriesAnimation>

                        <ChartMarker>

                            <ChartDataLabel Visible="true" [email protected]>

                                <ChartDataLabelFont FontWeight="600" Color="#ffffff"></ChartDataLabelFont>

                            </ChartDataLabel>

                        </ChartMarker>

                    </ChartSeries>

                }

                @if (this.DashBoardTileObj.Settings.Where<DashBoardTileSetting>(x => x.SettingId.Equals(DashBoardTileSetting.TileSettingType.TargetOfEvaluationOverdueSpecialCircumstances)).First().BoolValue == true)

                {

                    <ChartSeries [email protected] XName="TimePeriod" YName="SpecialCirumstances" [email protected]("Special cirumstances") Type="ChartSeriesType.Column">

                        <ChartSeriesAnimation Enable=@Animation></ChartSeriesAnimation>

                        <ChartMarker>

                            <ChartDataLabel Visible="true" [email protected]>

                                <ChartDataLabelFont FontWeight="600" Color="#ffffff"></ChartDataLabelFont>

                            </ChartDataLabel>

                        </ChartMarker>

                    </ChartSeries>

                }

                @if (this.DashBoardTileObj.Settings.Where<DashBoardTileSetting>(x => x.SettingId.Equals(DashBoardTileSetting.TileSettingType.TargetOfEvaluationOverdueBusinessImpact)).First().BoolValue == true)

                {

                    <ChartSeries [email protected] XName="TimePeriod" YName="BusinessImpact" [email protected]("Business impact") Type="ChartSeriesType.Column">

                        <ChartSeriesAnimation Enable=@Animation></ChartSeriesAnimation>

                        <ChartMarker>

                            <ChartDataLabel Visible="true" [email protected]>

                                <ChartDataLabelFont FontWeight="600" Color="#ffffff"></ChartDataLabelFont>

                            </ChartDataLabel>

                        </ChartMarker>

                    </ChartSeries>

                }

                @if (this.DashBoardTileObj.Settings.Where<DashBoardTileSetting>(x => x.SettingId.Equals(DashBoardTileSetting.TileSettingType.TargetOfEvaluationOverdueLevelThreat)).First().BoolValue == true)

                {

                    <ChartSeries [email protected] XName="TimePeriod" YName="LevelOfThreat" [email protected]("LevelOfThreat") Type="ChartSeriesType.Column">

                        <ChartSeriesAnimation Enable=@Animation></ChartSeriesAnimation>

                        <ChartMarker>

                            <ChartDataLabel Visible="true" [email protected]>

                                <ChartDataLabelFont FontWeight="600" Color="#ffffff"></ChartDataLabelFont>

                            </ChartDataLabel>

                        </ChartMarker>

                    </ChartSeries>

                }

                @if (this.DashBoardTileObj.Settings.Where<DashBoardTileSetting>(x => x.SettingId.Equals(DashBoardTileSetting.TileSettingType.TargetOfEvaluationOverdueCriticality)).First().BoolValue == true)

                {

                    <ChartSeries [email protected] XName="TimePeriod" YName="Criticality" [email protected]("Criticality") Type="ChartSeriesType.Column">

                        <ChartSeriesAnimation Enable=@Animation></ChartSeriesAnimation>

                        <ChartMarker>

                            <ChartDataLabel Visible="true" [email protected]>

                                <ChartDataLabelFont FontWeight="600" Color="#ffffff"></ChartDataLabelFont>

                            </ChartDataLabel>

                        </ChartMarker>

                    </ChartSeries>

                }

            </ChartSeriesCollection>

            <ChartTooltipSettings Enable="true"></ChartTooltipSettings>

        </SfChart>

    }

</div>

Attachment: 20210427_11h02_19_bd731ef6.zip

[Durga Gopalakrishnan]

Hi Michael, 

  

We have ensured your reported scenario with attached video, unfortunately, we are unable to replicate an issue from our end. We have attached tested sample for your reference.  

  

Code Snippet :  

  

<SfChart>     

    <ChartSeriesCollection> 

        @foreach (ChartSeries series in seriesCollection) 

        { 

            <ChartSeries DataSource="@series.DataSource" Name="@series.Name" XName="@series.XName" YName="@series.YName" Type="ChartSeriesType.Column"> 

            </ChartSeries> 

        } 

    </ChartSeriesCollection> 

</SfChart> 

@code{ 

void ChartSeriesAdd() 

    { 

        seriesCollection.Add( 

             new ChartSeries 

             { 

                 XName = "X", 

                 YName = "Y3", 

                 Type = ChartSeriesType.Column, 

                 Name = "Series", 

                 DataSource = this.MedalDetails 

             } 

        ); 

    } 

    void ChartSeriesRemove() 

    { 

        if (seriesCollection.Count > 0) 

            seriesCollection.Remove(seriesCollection[seriesCollection.Count - 1]); 

    } 

} 

  

Screenshots :  

  

Adding Series 

 

 

Removing Series 

  

 

 

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/AddRmvSeries168512384.zip 

  

UG : https://blazor.syncfusion.com/documentation/chart/how-to/add-remove/ 

  

If you are still facing the problem, please try to replicate an issue in above sample or provide us an issue reproduced sample, so that it will be helpful for us to proceed further. 

  

Regards, 

Durga G