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

0
0

From example, I know I can bind and generate X Y axes in view model.
I want the left and right Y axes value are exactly the same and just use label provider to change the

I can find something similar in forum.
https://www.scichart.com/questions/wpf/faq-how-to-have-two-yaxis-on-left-and-right-with-the-same-visiblerange-mirrored-yaxis

But I am not sure how to do the same thing using axisviewmodel

xaml:

view model

       public  ObservableCollection<IAxisViewModel> YAxes {get; set;}

       YAxes = new ObservableCollection<IAxisViewModel>();
       var yNumAxis = new NumericAxisViewModel
       {

            AutoRange = AutoRange.Always,
            DrawLabels = true,
            AxisAlignment = AxisAlignment.Left,
            TickProvider = new CustomTickProvider(5),
            TextFormatting = "0.0#",
            GrowBy = new DoubleRange(0.1, 0.1)
        };

        YAxes.Add(yNumAxis);

        var yAxis2 = new NumericAxisViewModel
        {
            Id = "SecondaryAxis",
            AutoRange = AutoRange.Always,
            DrawLabels = true,
            AxisAlignment = AxisAlignment.Right,
            TickProvider = new CustomTickProvider(5),
            LabelProvider = new CustomLabelProvider(10),
            TextFormatting = "0.0#",
            GrowBy = new DoubleRange(0.1, 0.1)
        };


        YAxes.Add(yAxis2);
Version
6
  • You must to post comments
0
0

Hi Vincent

I’ve created a new example showing how to mirror the YAxis on left & right of the chart using our MVVM API. You can find this here on Github.

How the example works:

You define your Axis using our AxesBinding Markup Extension as follows.

<s:SciChartSurface XAxes="{s:AxesBinding XAxis}" YAxes="{s:AxesBinding YAxis}">

    <s:SciChartSurface.ChartModifier>
        <s:ModifierGroup>
            <s:ZoomPanModifier ClipModeX="None"/>
            <s:ZoomExtentsModifier/>
        </s:ModifierGroup>
    </s:SciChartSurface.ChartModifier>
</s:SciChartSurface>

public class MainViewModel : INotifyPropertyChanged
{
    private IRange _visibleRange;

    public MainViewModel()
    {
        XAxis.Add(new NumericAxisViewModel());
        YAxis.Add(new NumericAxisViewModel() { AxisAlignment = AxisAlignment.Right, StyleKey = "YAxisStyle"});
        YAxis.Add(new NumericAxisViewModel() { AxisAlignment = AxisAlignment.Left, Id="LeftAxis", StyleKey = "YAxisStyle"});
    }

    public ObservableCollection<IAxisViewModel> XAxis { get; } = new ObservableCollection<IAxisViewModel>();
    public ObservableCollection<IAxisViewModel> YAxis { get; } = new ObservableCollection<IAxisViewModel>();

    public IRange YVisibleRange
    {
        get => _visibleRange;
        set
        {
            _visibleRange = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    [NotifyPropertyChangedInvocator]
    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

Notice I have set the StyleKey property on the YAxis ViewModels. This StyleKey is also defined in XAML as follows:

 <Window.Resources>
    <mirroredYAxis:MainViewModel x:Key="mvm"/>
    <Style x:Key="YAxisStyle" TargetType="{x:Type s:AxisBase}">
        <Setter Property="VisibleRange" Value="{Binding YAxisVisibleRange, Mode=TwoWay}"/>
        <Setter Property="TextFormatting" Value="0.00"/>
        <Setter Property="MaxAutoTicks" Value="5"/>
    </Style>
</Window.Resources>

This allows you to apply a style, or binding to an Axis in XAML when the Axis itself is declared as a ViewModel using our MVVM API.

Let me know if this helps,

Best regards,
Andrew

  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.