SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, and now iOS Charting & Android Chart Components

Welcome to the SciChart Community Forums!

Please use the forums below to ask questions about SciChart. Take a moment to read our Question asking guidelines on how to ask a good question and our support policy. We also have a tag=SciChart on Stackoverflow.com where you can earn rep for your questions!

Please note: SciChart team will only answer questions from customers with active support subscriptions. Expired support questions will be ignored. If your support status shows incorrectly, contact us and we will be glad to help.

0 votes
523 views

Dear all,

I am trying to load my chart with a default zoom factor value. For that I have follow and modify the exemple shown by using key stroke.

My modifiier class is defined as below :

 public class SimpleZoomInOutModifier : ChartModifierBase
{
    public static readonly DependencyProperty ZoomFractionProperty 
        = DependencyProperty.Register("ZoomFraction", typeof(double), typeof(SimpleZoomInOutModifier), new PropertyMetadata(0.1));

    public double ZoomFraction
    {
        get { return (double)GetValue(ZoomFractionProperty); }
        set { SetValue(ZoomFractionProperty, value); }
    }

    void SciChart_PreviewKeyDown(object sender, KeyEventArgs e)
    {
        double factor = 0;

        if (e.Key == Key.Up)
        {
            // On CTRL+, Zoom In
            factor = -ZoomFraction;
        }
        if (e.Key == Key.Down)
        {
            // On CTRL-, Zoom Out
            factor = ZoomFraction;
        }

        using (ParentSurface.SuspendUpdates())
        {
            // Zoom the XAxis by the required factor
            XAxis.ZoomBy(factor, factor, TimeSpan.FromMilliseconds(500));

            // Zoom the YAxis by the required factor
            YAxis.ZoomBy(factor, factor, TimeSpan.FromMilliseconds(500));

            // Note.. can be extended for multiple YAxis XAxis, just iterate over all axes on the parent surface
        }
    }

    public override void OnAttached()
    {
        base.OnAttached();
        var scichart = ((SciChartSurface)ParentSurface);

        var mainWindow = FindLogicalParent<UserControl>(scichart);

        mainWindow.PreviewKeyDown -= SciChart_PreviewKeyDown;
        mainWindow.PreviewKeyDown += SciChart_PreviewKeyDown;
        mainWindow.Loaded += SciChart_Loaded; 
    }

    private void SciChart_Loaded(object sender, RoutedEventArgs e)
    {
        double factor = 0;
        // On CTRL+, Zoom In
        factor = -ZoomFraction;

        using (ParentSurface.SuspendUpdates())
        {
            // Zoom the XAxis by the required factor
            XAxis.ZoomBy(factor, factor, TimeSpan.FromMilliseconds(500));

            // Zoom the YAxis by the required factor
            YAxis.ZoomBy(factor, factor, TimeSpan.FromMilliseconds(500));

            // Note.. can be extended for multiple YAxis XAxis, just iterate over all axes on the parent surface
        }
    }

From the code above, the zoom in by using Up and Down keys is working perfectly well but when I try to force the zoom in inside the chart_loaded event, nothing happen.

Any idea what I am doing wrong ?

regards

  • sc sc asked 10 months ago
  • last active 10 months ago
0 votes
800 views

I am trying to call the ZoomBy() method of SciChart control from ViewModel. The ZoomBy() is easily available in the xaml.cs file like below:

// TODO: Need to implement zoom using MVVM
    private void BtnZoomIn_Click(object sender, RoutedEventArgs e)
    {
        TemperatureGraph.ChartModifier.XAxis.ZoomBy(-0.1, -0.1);
    }

The same functionality I need to implement using the ViewModel pattern.

However the ZoomExtents method is easily being called using ViewportManager of SciChart control. E.g. below: XAML file

<RocheButton Name="BtnZoomOut" DockPanel.Dock="Top" Icon="{IconResource Icon=ZoomOut}" HorizontalAlignment="Right" Command="{Binding ZoomOutCommand}" />    
<s:SciChartSurface x:Name="TemperatureGraph" Grid.Column="0" s:ThemeManager.Theme="BrightSpark"  
                           RenderableSeries="{s:SeriesBinding TemperatureGraphViewModel}" DockPanel.Dock="Bottom"
                           ViewportManager="{Binding ViewportManager}">

And the ViewModel Code:

public class TemperatureSummaryGraphViewModel : ViewModelBase
    {
        #region Private Members

        private IXyDataSeries<TimeSpan, double> TemperatureDataSeries = new XyDataSeries<TimeSpan, double>();
        private IXyDataSeries<TimeSpan, double> AcquisitionPointDataSeries = new XyDataSeries<TimeSpan, double>();
        private DefaultViewportManager _viewportManager = new DefaultViewportManager();
        private ICommand _zoomOutCommand;

        #endregion

        #region Constructor

        public TemperatureSummaryGraphViewModel()
        {
            ZoomOutCommand = new DelegateCommand(() => ZoomOutTemperatureGrpah());
            GenerateDummySeries();

            TemperatureGraphViewModel.Add(new LineRenderableSeriesViewModel()
            {
                DataSeries = TemperatureDataSeries,
                StyleKey = "LineSeriesStyle0"
            });

            TemperatureGraphViewModel.Add(new XyScatterRenderableSeriesViewModel()
            {
                DataSeries = AcquisitionPointDataSeries,
                StyleKey = "ScatterSeriesStyle0"
            });
        }

        #endregion

        #region Public Properties

        public ObservableCollection<IRenderableSeriesViewModel> TemperatureGraphViewModel { get; } = new ObservableCollection<IRenderableSeriesViewModel>();

        public IViewportManager ViewportManager
        {
            get
            {
                return _viewportManager;
            }

            set
            {
                if (ReferenceEquals(value, _viewportManager))
                {
                    return;
                }

                _viewportManager = (DefaultViewportManager)value;
                OnPropertyChanged("ViewportManager");
            }
        }

        public ICommand ZoomOutCommand
        {
            get
            {
                return _zoomOutCommand;
            }

            set
            {
                if (ReferenceEquals(value, _zoomOutCommand))
                {
                    return;
                }

                _zoomOutCommand = value;
                OnPropertyChanged(nameof(ZoomOutCommand));
            }
        }

        #endregion

        #region Public Methods

        /// <summary>
        /// To generate dummy data
        /// // TODO: Need to integrate it with RunEditor with the actual data
        /// </summary>
        public void GenerateDummySeries()
        {
            double y = 80.5, yVar = 30.0;

            TemperatureDataSeries.Append(TimeSpan.FromMinutes(1), 40.0);
            TemperatureDataSeries.Append(TimeSpan.FromMinutes(2), 80.5);
            for (int x = 2; x < 50; x++)
            {
                TemperatureDataSeries.Append(TimeSpan.FromMinutes(x), y);

                yVar *= -1;
                y += yVar;
            }

            for (var i = 5.4; i < 50; i += 2)
            {
                AcquisitionPointDataSeries.Append(TimeSpan.FromMinutes(i), 60.0);
            }
        }

        public void ZoomOutTemperatureGrpah()
        {
            _viewportManager.ZoomExtents();
        }

        #endregion
    }
}

This code is working fine and zooming out the scichart control to 100%.

I want to implement the same using the ZoomBy().

Please help!

Showing 2 results
This template supports the sidebar's widgets. Add one or use Full Width layout.