Extending RadChart for better MVVM binding

Requirements
RadControls            version	2010_3_1314
.NET version	4.0
Visual Studio version	2010
programming language	C#
browser support	all browsers supported by RadControls

PROJECT DESCRIPTION

I would like to use RadChart with one Binding variable (IEnumerable of IEnumerables) and a datatemplate to define the data series.
The way RadChart is Today, you can't do that since SeriesMapping is not a FrameworkElement and you can't define it on your xaml.

The solution is creating a wrapper class that derives from FrameworkElement and exposes SeriesMapping properties as DependencyProperties.

This makes RadChart 100% MVVM friendly, the same way MultiChart is.
If you need other SeriesMapping properties, just add them to the SeriesMappingWrapper as a normal property or as a DependencyProperty if you need binding support.

Check this thread and this for more information about the concept.

Happy coding!

Hello Andre,

Thank you for this submission. The good news is that beginning Q1 2011 series mappings are freezables in WPF and will receive their inheritance context and can be used with bindings to view models. Furthermore this should already be working for silverlight since Q3 release.

Best wishes,
Vladimir Milev
the Telerik team

Hi Vladimir, you mentioned multiple series binding with MVVM would work for silverlight with Q3 release. Can you provide an example with code where a collection of collections can be bound to a RadChart instance? It's important that it works with live data.

I used the approach of Andre but unfortunatelly, my chart does not update the view after the data has changed. Instead, it displays "no data series".

thank you in advance
Sebastian

Hi,

You can use this example as a starting point: http://demos.telerik.com/silverlight/#Chart/MultipleDataSources

It shows how to have different series mappings in code and have each one bound to a different data source.

Kind regards,
Vladimir Milev
the Telerik team

Hi, the problem is solved thanks to the telerik support team (I created a ticket for this). It's important to use the DefaultView with the MvvmRadChart component! The following snippet gives you an idea.

<TelerikChart:MvvmRadChart x:Name="RadChartUC"
            SeriesSource="{Binding ChartDatapointRegions}"
            SeriesTemplateSelector="{StaticResource chartTemplateSelector}">    
                <TelerikChart:MvvmRadChart.DefaultView>
                    <telerik:ChartDefaultView>
                        <telerik:ChartDefaultView.ChartTitle>
                            <telerik:ChartTitle Content="{Binding ChartTitle}"/>
                        </telerik:ChartDefaultView.ChartTitle>
                        <telerik:ChartDefaultView.ChartArea>
                            <telerik:ChartArea>
                               <telerik:ChartArea.AxisX>
                                    <telerik:AxisX Title="{Binding ChartAxisXTitle}"/>
                                </telerik:ChartArea.AxisX>
                                <telerik:ChartArea.AxisY>
                                    <telerik:AxisY
                                Title="{Binding ChartAxisYTitle}">
                                    </telerik:AxisY>
                                </telerik:ChartArea.AxisY>
                            </telerik:ChartArea>
                        </telerik:ChartDefaultView.ChartArea>
                    </telerik:ChartDefaultView>
                </TelerikChart:MvvmRadChart.DefaultView>
        </TelerikChart:MvvmRadChart>