Telerik blogs

It is only a few days since the 2012 Q3 release of RadControls for Silverlight and WPF and we have something new to show you. Here in Telerik we really appreciate feedback from you, the customer. Following this feedback we revamped our ChartDataSource to include the most desired features and we also significantly improved performance.

Let’s start with a few words on the ChartDataSource itself. If you are familiar with it you can safely skip this section and move directly to the goodies. The ChartDataSource is a companion control, designed to work together with our new charting solution – the RadChartView. Its primary role is to create a view over large sets of data for easier visualization. We call this sampling. Basically, what it does is it divides your data into sets and applies an aggregate function over them. From these sets the final data points, which are used in the RadChartView, are created. For example, if you have a dataset holding 100 000 items, it will be split into 1000 sets of 100 items and 1 data point will be created for each set using the average of these 100 items. I should note that the number of sets generated can be controlled. Great! What could be better? Well, keep reading.

I am really excited to tell you that we have revamped the ChartDataSource from the ground up to include the most anticipated features. Now you can have multiple series bound to the same data source. This enables scenarios in which you have 1 large data source and you want to create multiple series from it. So basically you need 1 ChartDataSource per each unique data set. Also we now have support for GenericDataPointBindings. The best way to experience the changes is to show them in action.

Let’s draw the Down Jones data for the last 70 years – in total 20 610 records. I will use a line series for each of the Open, High, Low and Close values. The data will be provided by a view model via the Data property. Here is the definition of the ChartDataSource:

<telerik:ChartDataSource Name="dataSource" ItemsSource="{Binding Data}" />

Having the data source in place we now have sampling over this large data set. Now let’s give the data to our 4 series:

<telerik:RadCartesianChart Name="chart">
    <telerik:RadCartesianChart.VerticalAxis>
        <telerik:LinearAxis/>
    </telerik:RadCartesianChart.VerticalAxis>
    <telerik:RadCartesianChart.HorizontalAxis>
        <telerik:DateTimeContinuousAxis/>
    </telerik:RadCartesianChart.HorizontalAxis>
    <telerik:LineSeries ItemsSource="{Binding ElementName=dataSource}" />
    <telerik:LineSeries ItemsSource="{Binding ElementName=dataSource}" />
    <telerik:LineSeries ItemsSource="{Binding ElementName=dataSource}" />
    <telerik:LineSeries ItemsSource="{Binding ElementName=dataSource}" />
</telerik:RadCartesianChart>

Now the only thing missing is the description of the data for each series. I have done that in code behind, but nothing new there. Remember that now the ChartDataSource supports both property and generic data point bindings. When they are in place we have everything needed to display our graphic.

Silverlight charting with RadChartView component

The new ChartDataSource is not part of the official Q3 release. You can get it today in our latest internal build. It will be included in the SP1 of Q3 release that is due later this month. The complete source code for the demo, together with the binaries containing the new ChartDataSource can be found below, so feel free to give it a try. Also, don’t forget to tell us what you think.


Yavor Ivanov
About the Author

Yavor Ivanov

Yavor is a Senior Software Developer on the Telerik UI for Xamarin team. His 10+ years of XAML and WPF experience were gained in the Telerik UI for WPF and Silverlight suite as well as many LoB applications. His workday is a mixed bag of Xamarin, WPF and Angular development. Finding the right solution for the job is his main goal. You can find him on GitHub.

Comments

Comments are disabled in preview mode.