[Solved] UI/Data Virtualization in Telerik Metro XAML Chart

[Krishna]

Hi,



I'm trying to plot an infinite time series with some linear values on the y-axis and DateTime on the x-axis. The series will basically run infinitely - for example plotting something like all scheduled credit card payments against a DateTime axis.

I want the user to be able to keep scrolling left and right forever, and keep seeing the plot.



I can implement a data source that supports data virtualization as per: http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh780657.aspx and http://mtaulty.com/CommunityServer/blogs/mike_taultys_blog/archive/2012/08/15/from-the-windows-8-camps-gridviews-listviews-and-large-data-sets.aspx.



Now, I need to plot this on a RadCartesianChart.



To test it out initially without DataVirtualization, I've added say 5 yrs worth of data. I want to view 1 month at a time in the chart viewport (with ticks 1 day apart). I then want the user to be able to pan to see the rest of the plot. How do I do this? (At the moment, I've used a pan-zoom behaviour but it tries to fit everything into one screen. Attached is what I have so far.



I've tried with different containers (Grid, StackPanel. Canvas) and with/without ScrollViewer - but I just can't get it to pan horizontally.



So the questions:

1. How do I get the chart to pan horizontally?

2. Does the chart support virtualization for me to implement something like this?



Regards,

Krishna

[Georgi]

Hi Krishna,

Thank you for contacting us, you may refer to the support ticket you have opened regarding the same issue.

I am posting my reply here also in case some other users experience it:

Straight to your questions:

1. You will need to adjust the Zoom-related properties to achieve the desired scenario:

<telerik:RadCartesianChart x:Name="chart" MaxZoom="100, 1" Zoom="55, 1" MinZoom="50, 1">

The Zoom property works in logical units, here is a sample logic:

We have data for 5 years and we want to have 1 month displayed within the viewport. The ratio month/year is approximately 1:11, we have that multiplied by 5 (5 years) and we get a initial zoom factor of approximately 55 along the X-axis. You may also alter the ScrollOffset property to initialize the Viewport position. Note that this property also works in logical units. If you want to position the current view in the middle of the data, assuming you have zoom factor of 50, you will need to specify a value of (-27, 0).

2. Currently the chart does not support data virtualization out-of-the box and it needs all the data in order to calculate its model and to visualize it properly.

What you may do however is to manipulate the data in such a way that allows you to simulate endless feed. You may extend the built-in ChartPanAndZoomBehavior, override its OnManipulationDelta event and check the ScrollOffset property of the owning Chart. If the offset reaches some threshold at the positive X-axis direction you can remove some data from the beginning and add new one at the end. Respectively, you can add data at the beginning and remove it from the end when the ScrollOffset reaches the initial position (0).

I hope this information is useful. Let me know if I can assist you in some other way.

All the best,
Georgi
the Telerik team