We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

Scroll to Next Range

How do I give the user the option to load the next day or previous day chart from a "range navigation" that is showing currently the previous day's data? Thank you.
SfDateTimeRangeNavigator rangeNavigator = new SfDateTimeRangeNavigator(this);
rangeNavigator.TooltipFormat = "HH:mm aa";
rangeNavigator.LayoutParameters = new ViewGroup.LayoutParams(1280, 230);
rangeNavigator.Minimum = new GregorianCalendar(2016, 8, 16, 4, 0).Time;
rangeNavigator.Maximum = new GregorianCalendar(2016, 8, 15, 4, 0).Time;
rangeNavigator.ScrollChange += RangeNavigator_ScrollChange;
rangeNavigator.RangeChanged += RangeNavigator_RangeChanged;
rangeNavigator.LongClick += RangeNavigator_LongClick;
(rangeNavigator.Content as SfChart).Series.Add(new SplineSeries() { DataSource = data });

5 Replies

YP Yuvaraj Palanisamy Syncfusion Team September 19, 2016 01:43 PM UTC

Hi Albert K, 
Thanks for contacting Syncfusion support. 
Please refer the following code snippet to view the chart area with expected range using RangeChanged event of SfDateTimeRangeNavigator. Also we have prepared a sample for your reference. Please find the sample from the below location. 
Code Snippet:                                       
SfDateTimeRangeNavigator rangeNavigator = new SfDateTimeRangeNavigator(this);    
rangeNavigator.RangeChanged += RangeNavigator_RangeChanged; 
private void RangeNavigator_RangeChanged(object sender, SfDateTimeRangeNavigator.RangeChangedEventArgs e) 
       (chart.PrimaryAxis as DateTimeAxis).Minimum = e.P0; 
       (chart.PrimaryAxis as DateTimeAxis).Maximum = e.P1; 
Please let us know if you have any further queries regarding this.   

AK Albert K September 20, 2016 12:38 AM UTC


Thank you for the sample.  What i want is for the range navigator (SfDateTimeRangeNavigator) to show just one day, then have the ability to move to the previous or next day.  Is that possible?  Thank you.

YP Yuvaraj Palanisamy Syncfusion Team September 20, 2016 02:44 PM UTC

Hi Albert K,  
We have already provided a sample which will load one-day data initially and you can navigate to next/previous day data with navigation. 
If your requirement is different from this, we kindly request you to provide more details for assisting you with most appropriate solution. 

AK Albert K September 21, 2016 01:11 AM UTC


I have enclosed an image of what I have done.  What I want to achieve is, How do I implement a way to scroll to the previous/next day?   The current chart "range navigator" is showing the full 24 hours of the day.  Thank you. 

Attachment: Screenshot_1_a366632b.zip

YP Yuvaraj Palanisamy Syncfusion Team September 21, 2016 04:35 PM UTC

Hi Albert K,   
We have prepared a workaround sample as per your requirement. Please find the sample from the below location. 
Please let us know if you have any concerns. 

Live Chat Icon For mobile
Up arrow icon