How can I capture mouse input on a scroll bar in a scroll and zoom chart?

[David]

Hi,

I have a chart with a scroll mode of "scroll and zoom" on one axis (the X axis). I also have MouseDown and MouseUp event handlers for the entire chart control.

• The MouseDown and MouseUp events trigger as expected when I click down and release on any area of the chart excluding the scroll bar (and scroll bar thumb) of the scroll and zoom axis.
• If I click on any area of the scroll bar (or scroll bar thumb), the MouseDown event does not trigger.
• If I click on any area of the graph excluding the scroll bar thumb and release on the scroll bar (or scroll bar thumb), the MouseUp event triggers.
• If I click on any area of the scroll bar thumb and release on any area of the graph, the MouseUp event does not trigger.

I would like to be able to capture a MouseDown event on the scroll bar (or scroll bar thumb) and a MouseUp event if a MouseDown event is triggered on the scroll bar thumb. I do not want to disrupt the functionality of the scroll bar (ie. I don't want to do anything like put an transparent control over the scroll bar), I just want to capture any MouseDown and MouseUp event on the chart, irrespective on the scroll bar or scroll bar thumb.

Kind regards,
Dave.

[David]

Hi,

Some additional information:

• If I click on a scroll bar arrow, the MouseDown and MouseUp events do not trigger.

I would also like to be able to capture MouseDown and MouseUp events in this situation.

Kind regards,
Dave.

[Evgenia]

Hi David,

The ScrollBar in ZoomScroll scenario is used to display different range of the displayed data. Why do you need MouseUp/MouseDown functionality for the Scroller of the Chart? If you click on the arrows of the ScrollBar it slides and that's what naturally the scroller should do. Could you elaborate a bit more on this scenario so that we will be able to provide you with more appropriate support?

Kind regards,
Evgenia
the Telerik team

[David]

Hi Evgenia,

Here's a description of the chart I'm building for my client and the corresponding examples from Telerik I'm basing it on:

I have chart that is pre-populated with historical data (using the AddRangeObservableCollection detailed in
http://www.telerik.com/help/silverlight/radchart-performance-tips-and-tricks.html) and that displays live data as it is received (using the LiveDemo chart). I've set the scroll mode on the X axis to "scroll and zoom" so the client can interact with the chart. My problem is that it in runtime, it is difficult to change the scrollbar (to change the zoom or change the range of data being displayed) while the chart is continually updated to display live data.

My idea is when the user starts to interact with the chart (ie. on the MouseDown event), to add code to suppress the display of new data, and then once the user has finished (ie. on the MouseUp event), to add code to display the new data suppressed during the user interaction and restore functionality to display live data again. I have code on the MouseUp and MouseDown events that successfully handle these situations, however the following types of interaction with the chart with the scroll bar do not trigger the MouseUp/MouseDown events and therefore don't trigger the code: 
 

• If I click on any area of the scroll bar (or scroll bar thumb), the MouseDown event does not trigger.

• If I click on any area of the graph excluding the scroll bar thumb and release on the scroll bar (or scroll bar thumb), the MouseUp event triggers.
• If I click on any area of the scroll bar thumb and release on any area of the graph, the MouseUp event does not trigger.
• If I click on a scroll bar arrow, the MouseDown and MouseUp events do not trigger.

 
I'm just trying to capture the MouseUp and MouseDown events in these situations to be able to run my custom code (in this instance, to handle live data update). I'm not doing anything to modify the behaviour of the scrollbar, just the ability to run additional custom code in these situations.

Kind regards,
Dave.

[Evgenia]

Hello David,

Thanks for the detailed explanation.
However I think there is some misunderstanding. Using the Live Data example together with Zooming and Scrolling is not a scenario of good practice at all. By using Scrolling you want to visualize large set of data by portions. On the other side the Live Data example does exactly the same but instead of waiting for the user to scroll it dynamically shows the portions of data on some Time step. What I can suggest is that you use the Zooming and Scrolling functionality and let the user interact with the data by using the scroller. This way he/she would be able to go ahead or back through the data portions. 
I suggest that you use our Zooming and Scrolling demo as a guiding resource for this scenario as well as our documentation topic.

I hope this information is helpful.

Best wishes,
Evgenia
the Telerik team

[David]

Hi,

In the absence of the ability to dynamically capture all MouseDown events for a chart with scroll and zoom to suppress any chart updates, I have added a button to manually stop the chart from updating (so the user can freeze the chart, examine historical data with the scroll and zoom facilities, and then unfreeze the chart to display live data again). I can also capture the Mesentera and MouseLeave events for the chart area (instead of the more desirable MouseDown and MouseUp events, however this causes usability issues (the user mouses over the chart area and doesn't know why the chart has stopped updating), so I may end up removing these events for better usability.

Kind regards,
Dave.