2 Charts Synchronization

[Marc]

I need to have 2 charts (one on top of the other) and I also need to use the zoom feature. Is there any client events for RadChart I can use to synchronize both charts when the user zoom or scroll the content in the X-Axis (date/time axis)?

Thanks

[Yavor]

Hello,

To see more information along the lines of the requested functionality, please refer to the following article:

http://www.telerik.com/help/aspnet-ajax/chart-client-side-api.html

It elaborates on both how to get the zoom/scroll coordinates, and trigger scrolling from the client. I hope it gets you started properly.

Regards,
Yavor
Telerik

[Marc]

Hi, I had already saw this help topic but there is only properties and methods but no events describes at all in the help for this control.

I looked deeper and I found something...I found a way to access the DOM element who have the scroll bars and I attached my OnScoll event so I am able to be triggered when the user scroll (I didn't try the complete solution, I just found a way to be get notifiied).

Here is my code:

var radChart = $get("<%= radChart.ClientID %>");
var div = $telerik.$(radChart).find("[id$='_rcPlotArea']")[0];
div.onscroll = function () {
     // Do something here...
}

Can you tell me if doing that will break something in the RadChart behavior or is it a simpler way to do it.

Thanks.

[Yavor]

Hi,

In the article mentioned previously, you can use the chart.scroll and chart.zoom methods to sync the charts. You can pair this with chart.get_xScrollOffset() and chart.get_yScrollOffset(), to determine the coordinates for the first chart.
Let me know how this approach meets your requirements.

Regards,
Yavor
Telerik