How to Automatic zoom on visible bars

[Luca De Marco]

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]

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 

  

Link: https://help.syncfusion.com/wpf/sfchart/area#chart-events 

  

Regards, 

Devi 

[Luca De Marco]

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]

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