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
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Chart Data and Range Selector slider overlap

Thread ID:





141001 Nov 18,2018 08:37 PM UTC Nov 21,2018 11:22 AM UTC Xamarin.Forms 1
Tags: SfDateTimeRangeNavigator
Asked On November 19, 2018 12:47 AM UTC


I tried to work with the the Range Navigator, supplied as an example. However, both the chart and the time range slider are over lapping. I then tried to take a sample from the forum at, https://www.syncfusion.com/forums/128180/how-to-apply-custom-font-to-x-axis-labels-in-datetimerangenavigator and still I see the same problem.

I tried it both on the emulator and on an android phone. Interestingly, the RangeNavigator example on the "Syncfusion Controls Explorer" app, works, as desired.


Visual Studio 2017

Emulator : Android

Phone : Android Based

Any help will be appreciated

Below is the Code

1. SamplePage.xaml.cs

using System;

using System.Collections.Generic;

using Syncfusion.SfChart.XForms;

using Xamarin.Forms;

using Syncfusion.RangeNavigator.XForms; 

using Xamarin.Forms.Internals;

namespace RangeExample


    [Preserve(AllMembers = true)]

    public partial class SamplePage : ContentPage


        public SamplePage()




            ((SfChart)RangeNavigator.Content).Series.Add(new SplineAreaSeries() { ItemsSource = series.ItemsSource, XBindingPath = "XValue", YBindingPath = "YValue" });


        void nac_RangeChanged(object sender, Syncfusion.RangeNavigator.XForms.RangeChangedEventArgs e)


            dateTimeAxis.Minimum = e.ViewRangeStartDate;

            dateTimeAxis.Maximum = e.ViewRangeEndDate;




2. SamplePage.xaml





























                          XBindingPath="XValue" YBindingPath="YValue"/>






                          XBindingPath="XValue" YBindingPath="YValue" HeightRequest = "150">








3. RangeSelectorViewModel.cs

using System;

using System.Collections.ObjectModel;

using Syncfusion.SfChart.XForms;

using Xamarin.Forms.Internals;

namespace RangeExample


    [Preserve(AllMembers = true)]

    public class RangeSelectorViewModel


        public ObservableCollection DateTimeRangeData { get; set; }

        public RangeSelectorViewModel()


            DateTimeRangeData = new ObservableCollection


                new ChartDataPoint(new DateTime(2015, 01, 1), 14),

                new ChartDataPoint(new DateTime(2015, 02, 1), 54),

                new ChartDataPoint(new DateTime(2015, 03, 1), 23),

                new ChartDataPoint(new DateTime(2015, 04, 1), 53),

                new ChartDataPoint(new DateTime(2015, 05, 1), 25),

                new ChartDataPoint(new DateTime(2015, 06, 1), 32),

                new ChartDataPoint(new DateTime(2015, 07, 1), 78),

                new ChartDataPoint(new DateTime(2015, 08, 1), 100),

                new ChartDataPoint(new DateTime(2015, 09, 1), 55),

                new ChartDataPoint(new DateTime(2015, 10, 1), 38),

                new ChartDataPoint(new DateTime(2015, 11, 1), 27),

                new ChartDataPoint(new DateTime(2015, 12, 1), 56),

                new ChartDataPoint(new DateTime(2015, 12, 31), 35)





Attachment: Screen_Shot_cee45d6c.zip

Michael Prabhu M [Syncfusion]
Replied On November 21, 2018 11:22 AM UTC

Hi Akash, 

Greetings from Syncfusion, we have analyzed your query and we are not able to see the code added in SamplePage.xaml file, since most of the lines are blank. The chart and range navigator control will not be overlapped if it is positioned properly in its parent layout. So, it will be good if you post that code again or provide us the sample as an attachment in this forum to investigate further. You can also refer the code that we have used in "Syncfusion Controls Explorer" from the following location. 



This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon