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. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to make in a chart a horizontal scroll when there are many columns and mantain static the Y-Axe (UWP)

Thread ID:

Created:

Updated:

Platform:

Replies:

124457 Jun 10,2016 05:28 PM UTC Jun 17,2016 03:59 AM UTC UWP 9
loading
Tags: SfChart
Daniel
Asked On June 10, 2016 05:28 PM UTC

Hi everybody,

I searched unsuccessfully an example where in a column chart include a horizontal scroll when there are many columns and mantain static the Y-Axe when scrolling in UWP. Is there any way to do it?

Thanks.

Regards.

Rachel A [Syncfusion]
Replied On June 13, 2016 09:16 AM UTC

Hi Daniel, 

Thanks for contacting Syncfusion support. 

1. To horizontally scroll in the SfChart you can enable the scroll bar using the below code snippet. 

XAML 
 
          <chart:SfChart.PrimaryAxis> 
                <chart:CategoryAxis EnableScrollBar="True"></chart:CategoryAxis> 
            </chart:SfChart.PrimaryAxis> 
 
 

Refer the below UG documentation link to know more information about scrollbar. 


2.We can also zoom along x axis keeping the y axis as static using the below code snippet. 

XAML 
           <chart:SfChart.Behaviors> 
                <chart:ChartZoomPanBehavior ZoomMode="X"></chart:ChartZoomPanBehavior> 
            </chart:SfChart.Behaviors> 

 

Please refer the below UG documentation like to know about zooming. 



Regards, 
Rachel. A 

 


Daniel
Replied On June 13, 2016 03:19 PM UTC

Thanks Raquel... 

Works with the code that you passed me but what I wanted more-less, for example, this graph with many columns:

Original Graph

Make only visible 5 or 6 columns of data with their label below when loaded the graph... something like this:



Thanks again,

Regards.

Rachel A [Syncfusion]
Replied On June 14, 2016 05:46 AM UTC

Hi Daniel, 

Thanks for the update. 

We can achieve this requirement by  setting the VisibleMinimum and VisibleMaximum values in the ActualRangeChanged event arguments as in the below code snippet. 


XAML 

  <chart:SfChart.PrimaryAxis> 
                <chart:CategoryAxis EnableScrollBar="True" ActualRangeChanged="CategoryAxis_ActualRangeChanged"  ></chart:CategoryAxis> 
            </chart:SfChart.PrimaryAxis> 

C# 

private void CategoryAxis_ActualRangeChanged(object sender, ActualRangeChangedEventArgs e) 
        { 
            e.VisibleMinimum = Convert.ToDouble(e.ActualMinimum) + 6; 
            e.VisibleMaximum = Convert.ToDouble(e.ActualMaximum) - 6; 
        } 


Also, we have prepared the sample for your reference and you can download the sample from the following location. 


Regards, 
Rachel. A 


Daniel
Replied On June 14, 2016 02:09 PM UTC

Hi Rachel...

Thanks for the update, I testing the example that you attached and it is almost what I need but the only problem is that i can move the scroll to view the others column (always stay in the same place if I try to move the horizontal scroll)

Regards,

Daniel

Rachel A [Syncfusion]
Replied On June 15, 2016 04:51 AM UTC

Hi Daniel, 
 
Thanks for the update. 
 
We can check whether the scrollbar is dragged using IsScrolling value in ActualRangeChanged event arguments. 
 
Please find the below sample for your reference and you can download the sample from the following location. 
 
 
Regards, 
Rachel. A 
 


Daniel
Replied On June 15, 2016 04:53 PM UTC

Thanks Rachel... works very well, that was the trick. I made some adjustments with the last attached solution and it worked with my application.



The last thing that I couldn't do, in my app and also in the last attached solution, is enable the scroll in the Mobile emulator. I put the property "EnableTouchMode" but not responding the chart to move. How I can make this work?

Thanks again.

Regards,

Daniel.

Rachel A [Syncfusion]
Replied On June 16, 2016 08:48 AM UTC

Hi Daniel, 
 
Thanks for the update. 
 
As the mobile view is small the scrollbar is not applicable, so we have no scrollbar support in mobile platforms. We can achieve your requirement by adding zoom pan behavior in SfChart for mobile view. We have prepared the sample for your reference and you can download the sample from the following location. 
 
 
Refer the below UG link to know about zooming behavior. 
 
 
Regards, 
Rachel. A 


Daniel
Replied On June 16, 2016 03:54 PM UTC

Works perfectly in mobile and desktop.

Thanks for all Raquel.

Regars, Daniel

Rachel A [Syncfusion]
Replied On June 17, 2016 03:59 AM UTC

Hi Daniel, 

Thanks for the update. 

Please let us know if you need any further assistance . 
  
Regards, 
Rachel. A 


CONFIRMATION

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.

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

;