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 Automatic zoom on visible bars

Thread ID:

Created:

Updated:

Platform:

Replies:

129492 Mar 21,2017 11:24 PM UTC Mar 23,2017 10:29 AM UTC WPF 3
loading
Tags: SfChart
Luca De Marco
Asked On March 21, 2017 11:24 PM UTC

Good Evening,

Is it possible, on a CandleSeries chart to zoom automatically the Y axis based on the candles visible on screen, so that when the chart is panned along the X axis the candles are zoomed automatically on the Y axis to use all the available height using the lowest shadow and the higher shadow as Minimum and Maximum?

I suppose that if there is a way to get the visible candles, I could set the Minimum and Maximum values of the axis...

I hope I have been clear,

Thanks in advance,
Luca

Devi Aruna Maharasi Murugan [Syncfusion]
Replied On March 22, 2017 01:13 PM UTC

Hi Luca, 
  
Thanks for contacting Syncfusion Support. 
  
We have achieved your requirement (the candles are zoomed automatically on the Y axis to use all the available height) by using the PanChanging event of SfChart. Please refer the below code snippet, 
 
public partial class MainWindow : Window 
{ 
     TestingValuesCollection collection; 
     ObservableCollection<TestingValues> selectedValue { get; set; } 
     public MainWindow() 
       { 
         InitializeComponent(); 
         collection = new TestingValuesCollection(); 
         candle.ItemsSource = collection.TestingModel; //setting series items source 
         selectedValue = new ObservableCollection<TestingValues>(); 
      } 
 
        private void SfChart_PanChanging(object sender, PanChangingEventArgs e) 
        { 
             
            if (selectedValue.Count > 0) 
                selectedValue.Clear(); 
            var primaryAxis = (sender as SfChart).PrimaryAxis as CategoryAxis; 
            var start = Math.Round(primaryAxis.VisibleRange.Start); 
            var end = Math.Round(primaryAxis.VisibleRange.End); 
            for (int i = (int)start; i < (int)end; i++) 
                selectedValue.Add(collection.TestingModel[i]); 
            var max = (from values in selectedValue select values.Y).Max(); 
            var min = (from values in selectedValue select values.Y1).Min(); 
            yAxis.Minimum = min; // setting Minimum for SecondaryAxis 
            yAxis.Maximum = max; //setting Maximum for SecondaryAxis 
        } 
    } 
  
We have prepared the demo sample for your reference and it can be downloaded from below link, 
  
Sample: CandleZooming 
  
Please refer the below documentation link to more about the event present in SfChart 
  
  
Regards, 
Devi 


Luca De Marco
Replied On March 22, 2017 10:38 PM UTC

Thank you very much!

As usual your example worked as a charm, but I had to change my prmary Axis from DateTime to Category, otherwise Start and End had values completely different than my collection Length...

The same happens if I change the PrimaryAxis of your example to a DateTimeAxis

Luca

Devi Aruna Maharasi Murugan [Syncfusion]
Replied On March 23, 2017 10:29 AM UTC

Hi Luca, 
  
Thanks for your update. 
  
We have modified the sample by using DateTimeAxis as PrimaryAxis of chart. Please find the code snippet, 
 
private void SfChart_PanChanging(object sender, PanChangingEventArgs e) 
  { 
             
      if (selectedValue.Count > 0)  
            selectedValue.Clear(); 
      var primaryAxis = (sender as SfChart).PrimaryAxis as DateTimeAxis; 
      var start = primaryAxis.VisibleRange.Start.FromOADate(); 
      var end = primaryAxis.VisibleRange.End.FromOADate(); 
 
      foreach(var item in collection.TestingModel) 
        { 
           if(item.Date >= start.Date && item.Date <= end.Date) 
                selectedValue.Add(item); 
 
        }               
        var max = (from values in selectedValue select values.Y).Max(); 
        var min = (from values in selectedValue select values.Y1).Min(); 
        yAxis.Minimum = min;  
        yAxis.Maximum = max;  
  } 
  
  
Kindly download the sample from below link, 
  
Sample: CandleZooming 
  
Regards, 
Devi 





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

;