MVVM binding to RadChart ...

[Rob Ainscough]

This is my first usage or RadChart and I wen thru the online documentation/examples but can't seem to get the RadChart binding to work.  I've verified my observableCollection and data values are there, just not binding.  I'm probably missing something easy ... here is the XAML:

 

<telerik:RadChart x:Name="SizeTrendingRadChart" Grid.Row="2" Grid.RowSpan="4" Grid.Column="7" Grid.ColumnSpan="2" Margin="2" ItemsSource="{Binding Path=Sizes}">
    <telerik:RadChart.DefaultView>
        <telerik:ChartDefaultView>
            <telerik:ChartDefaultView.ChartTitle>
                <telerik:ChartTitle Content="Market Trend" HorizontalAlignment="Center" Height="20" FontSize="9" Background="{x:Null}" BorderBrush="{x:Null}" Foreground="Black" OuterBorderBrush="{x:Null}" Padding="1"  />
            </telerik:ChartDefaultView.ChartTitle>
            <telerik:ChartDefaultView.ChartLegend>
                <telerik:ChartLegend Visibility="Collapsed" />
            </telerik:ChartDefaultView.ChartLegend>
        </telerik:ChartDefaultView>
    </telerik:RadChart.DefaultView>
    <telerik:RadChart.SeriesMappings>
        <telerik:SeriesMapping LegendLabel="Rate" CollectionIndex="0">
            <telerik:SeriesMapping.SeriesDefinition>
                <telerik:LineSeriesDefinition ShowItemLabels="True"/>
            </telerik:SeriesMapping.SeriesDefinition>
            <telerik:SeriesMapping.ItemMappings>
                <telerik:ItemMapping DataPointMember="YValue" FieldName="{Binding CurrentSizeRate}"/>
                <telerik:ItemMapping DataPointMember="XValue" FieldName="{Binding TotalSizeRentRates}"/>
            </telerik:SeriesMapping.ItemMappings>
        </telerik:SeriesMapping>
    </telerik:RadChart.SeriesMappings>
</telerik:RadChart>

I basically used your documentation example and just adjusted for my needs, but I'm not seeing my data in the Chart.  No errors, just nothing is displayed.

Any suggestions?

Thanks, Rob.

 

[Martin Ivanov]

Hello Rob,

RadChart is our old charting control which has many known issues and limitations. This is why we created the new RadChartView suite which has better implementation and improved performance. Also, the new suite is very flexible and easier to set up. You can read about the differences between the controls in the RadChart vs. RadChartView help article. In general I recommend you to use RadChartView instead of RadChart.

You can display your data with the RadCartesianChart, which is part of the RadChartView suite, with the following definition:

<telerik:RadCartesianChart x:Name="SizeTrendingRadChart">
    <telerik:RadCartesianChart.VerticalAxis>
        <telerik:LinearAxis />
    </telerik:RadCartesianChart.VerticalAxis>
    <telerik:RadCartesianChart.HorizontalAxis>
        <telerik:CategoricalAxis />
    </telerik:RadCartesianChart.HorizontalAxis>

    <telerik:LineSeries ValueBinding="CurrentSizeRate" CategoryBinding="TotalSizeRentRates" ItemsSource="{Binding Path=Sizes}" />
</telerik:RadCartesianChart>

However, as I can see you want to display numbers in both dimensions (X axis, Y axis) so you can consider using ScatterLineSeries instead of LineSeries. In addition you can take a look at the Create Data-Bound Chart help article.

Please give the new chart a try and let me know if it works for you.

Regards,
Martin
Telerik

[Rob Ainscough]

Hi Martin,

I was able to resolve my issue, ItemsSource needed to be under the SeriesMapping element and the FieldName need to NOT have "{Binding ..." prefix, just the name of the property being bound.

 

I will take a look at RadChartView, hopefully it's easier to implement than RadChart.

 

Cheers, Rob.