[Solved] No data series on RadChart the second time we enter page

[Justin]

Hello. My company recently purchased the Telerik suite. We are using Silverlight with the MVVM model. We have a ViewModel that is used by multiple pages. One of our pages is using a RadChart (a bar graph.) The first time we go into the page with the RadChart, it displays the chart correctly. Then we go to another page that uses the same view model. When we come back into the first page, the RadChart doesn't display. It says "No Data Series."

Here is the XAML code for our chart:

<telerik:RadChart Grid.Column="1" x:Name="barChart" ItemsSource="{Binding BarChartData}" SeriesMappings="{Binding BarChartSeriesMappings}">
    <telerik:RadChart.DefaultView>
        <telerik:ChartDefaultView>
            <telerik:ChartDefaultView.ChartLegend>
                <telerik:ChartLegend Name="AssetStatusLegend" Background="Transparent" BorderBrush="Transparent" Header=" "/>
            </telerik:ChartDefaultView.ChartLegend>
            <telerik:ChartDefaultView.ChartArea>
                <telerik:ChartArea ItemWidthPercent="50"
                                   EnableAnimations="False"
                                   LegendName="AssetStatusLegend"
                                   Command="{Binding BarChartAreaClickCommand}">
                    <telerik:ChartArea.AxisX>
                        <telerik:AxisX  AxisName="Count"/>
                    </telerik:ChartArea.AxisX>
                    <telerik:ChartArea.AxisY>
                        <telerik:AxisY  />
                    </telerik:ChartArea.AxisY>
                </telerik:ChartArea>
            </telerik:ChartDefaultView.ChartArea>
        </telerik:ChartDefaultView>
    </telerik:RadChart.DefaultView>
</telerik:RadChart>

In the LoadData function for the view model (we call this from the OnNavigatedTo event of the XAML code behind), we set BarChartData like this:

BarChartData = new QueryableCollectionView(barChartList);

In the code block above, barChartList is a List whose type is a class we have defined. Right below that line, we call the function InitializeBarChartSeriesMappings to tell the graph how to lay out the data. Related code is here:

private void InitializeBarChartSeriesMappings()
{
    SeriesMappingCollection seriesMappings = new SeriesMappingCollection();
    StackedBarSeriesDefinition seriesDefinition1 = CreateBarSeriesDefinition();
    SeriesMapping seriesMapping1 = this.CreateSeriesMapping("Started", seriesDefinition1, "Count", ChartAggregateFunction.Sum);
    seriesMapping1.GroupingSettings.GroupDescriptors.Add(new ChartGroupDescriptor("TaskTypeName"));
    seriesMapping1.SortDescriptors.Add(new ChartSortDescriptor("TaskTypeName", ListSortDirection.Descending));
    seriesMappings.Add(seriesMapping1);
    SeriesDefinition seriesDefinition2 = CreateBarSeriesDefinition();
    SeriesMapping seriesMapping2 = this.CreateSeriesMapping("Pending", seriesDefinition2, "Count", ChartAggregateFunction.Sum);
    seriesMapping2.GroupingSettings.GroupDescriptors.Add(new ChartGroupDescriptor("TaskTypeName"));
    seriesMapping2.SortDescriptors.Add(new ChartSortDescriptor("TaskTypeName", ListSortDirection.Descending));
    seriesMappings.Add(seriesMapping2);
    BarChartSeriesMappings = seriesMappings;
}
private static StackedBarSeriesDefinition CreateBarSeriesDefinition()
{
    HorizontalStackedBarSeriesDefinition seriesDefinition = new HorizontalStackedBarSeriesDefinition();
    seriesDefinition.ShowItemLabels = true;
    seriesDefinition.LabelSettings.LabelDisplayMode = LabelDisplayMode.Inside;
    return seriesDefinition;
}
private SeriesMapping CreateSeriesMapping(string product, SeriesDefinition seriesDefinition, string yValueField, ChartAggregateFunction aggFunction)
{
    SeriesMapping result = new SeriesMapping();
    result.LegendLabel = product;
    result.SeriesDefinition = seriesDefinition;
    result.ItemMappings.Add(new ItemMapping("TaskTypeName", DataPointMember.XCategory));
    result.ItemMappings.Add(new ItemMapping(yValueField, DataPointMember.YValue, aggFunction));
    result.FilterDescriptors.Add(new Telerik.Windows.Data.FilterDescriptor("AssetStatus", Telerik.Windows.Data.FilterOperator.IsEqualTo, product));
    result.GroupingSettings.ShouldFlattenSeries = true;
    result.GroupingSettings.GroupDescriptors.Add(new ChartGroupDescriptor("TaskTypeName"));
    return result;
}

Related property definitions in the code are here:

private QueryableCollectionView barChartData;
public QueryableCollectionView BarChartData
{
    get
    {
        return barChartData;
    }
    set
    {
        if (barChartData != value)
        {
            barChartData = value;
            NotifyPropertyChanged("BarChartData");
        }
    }
}
private SeriesMappingCollection barChartSeriesMappings;
public SeriesMappingCollection BarChartSeriesMappings
{
    get
    {
        return barChartSeriesMappings;
    }
    set
    {
        if (barChartSeriesMappings != value)
        {
            barChartSeriesMappings = value;
            NotifyPropertyChanged("BarChartSeriesMappings");
        }
    }
}

As I said before, the chart is displaying great the first time we go into the page. But as soon as we go into another page that uses the same view model and come back into the first page, it says "No Series Data." I have a breakpoint in the LoadData function, and I have verified that it is being hit each time we go into the page. Does anyone know why our graph isn't showing the second time we go into the page? Thanks in advance.

[Justin]

I have duplicated this problem in a bare-bones test project. I was going to update the zip file to this forum, but I was unable to do so. It says: "File is not of correct type. Try again." Could you please provide instructions as to either how to upload this file or how to open a support ticket? Thanks.

[Yavor]

Hello Justin,

In the forums, you can only upload screenshots.
To send us the sample project, you can open a formal support ticket, and attach the project there. We will review it locally, and get back to you with more information on the matter.

Regards,
Yavor
the Telerik team

[Justin]

For those who may Google this in the future, here is the answer. I submitted a support ticket for this, and here is Telerik's answer. The bottom line is that the SeriesMappings need to be resources for the page defined in the XAML as opposed to be defined in the code behind, where they were before.

Thank you for contacting us and for the project. I was able to reproduce the issue and after digging a bit I found the reason for this behavior. The DataContext is the same object during the entire lifecicle. It holds the SeriesMapping objects for the chart. However, once they are added, they are associated with the instance of the ChartArea, which holds their DataSeries. On subsequent use of the page this instance is not valid anymore. In order to avoid this it would be good to re-created the SeriesMappings too. I have attached an updated version of the project (binaries stripped) where the SeriesMappings are defined as resources for the page. You can further update this to keep the SeriesMappings as page resources, but bind their values like ItemMapping.FieldName to properties in the viewmodel. Hope this helps.