oxyplot - Y axis on both sides of chart

Question

I am using the oxyplot lib to create timeseries Charts. I am trying to create a plot which has the same y-axis on both sides, it works fine as long as I am not interacting with the plot to zoom or pan, here is my code

      model.Axes.Add(new LinearAxis()
      {
        MajorStep = 0.1,
        Minimum = 0,
        Maximum = 1,
        Position = AxisPosition.Left,
        Title = "Title Axis",
        AxisTitleDistance = 10
      });

      model.Axes.Add(new LinearAxis()
      {
        Key = "RightYAxis"
        MajorStep = 0.1,
        Minimum = 0,
        Maximum = 1,
        Position = AxisPosition.Right
      });

      DateTimeAxis dta = new DateTimeAxis()
      {
        Key = "DateTimeAxis",
        IntervalType = SetDateTimeIntervalType(minDate, maxDate),
        StringFormat = "dd/MM/yyyy",
        Position = AxisPosition.Bottom,
        Minimum = DateTimeAxis.ToDouble(minDate),
        Maximum = DateTimeAxis.ToDouble(maxDate),
        Title = "Date",
        AxisTitleDistance = 10
      };
      dta.AxisChanged += new EventHandler<AxisChangedEventArgs>(AxisChanged);
      model.Axes.Add(dta);

When I interact with the plot, only the left y axis and the bottom axis are scaling appropriately. When I add the right y axis before the left y axis, the bottom and right side axis are scaling.

What setting do I need to set, to scale both y axis accordingly and not just one?

Döharrrck · Accepted Answer · 2020-10-30T13:00:39.100

I don't think that there is a build-in setting for this. I had similar problem in the past and also looked for such a feature but didn't find one. Also there is no such example in the OxyPlot demo browser. The straight forward - yet not very elegant way - is to attach an event handler also to the left axis which sets the minimum and maximum to the right one. Your example would then look like this:

  Axis leftAxis = new LinearAxis()
  {
    MajorStep = 0.1,
    Minimum = 0,
    Maximum = 1,
    Position = AxisPosition.Left,
    Title = "Title Axis",
    AxisTitleDistance = 10
  });

  leftAxis.AxisChanged += LeftAxis_AxisChanged;
  model.Axes.Add(leftAxis);

  model.Axes.Add(new LinearAxis()
  {
    Key = "RightYAxis"
    MajorStep = 0.1,
    Minimum = 0,
    Maximum = 1,
    Position = AxisPosition.Right
  });

  DateTimeAxis dta = new DateTimeAxis()
  {
    Key = "DateTimeAxis",
    IntervalType = SetDateTimeIntervalType(minDate, maxDate),
    StringFormat = "dd/MM/yyyy",
    Position = AxisPosition.Bottom,
    Minimum = DateTimeAxis.ToDouble(minDate),
    Maximum = DateTimeAxis.ToDouble(maxDate),
    Title = "Date",
    AxisTitleDistance = 10
  };
  dta.AxisChanged += new EventHandler<AxisChangedEventArgs>(AxisChanged);
  model.Axes.Add(dta);

with the event handler looking like

    private void LeftAxis_AxisChanged(object sender, AxisChangedEventArgs e)
    {
        Axis leftAxis = sender as Axis;
        Axis rightAxis = leftAxis.PlotModel.Axes.First(a => a.Position == AxisPosition.Right);

        rightAxis.Maximum = leftAxis.ActualMaximum;
        rightAxis.Minimum = leftAxis.ActualMinimum;
    }

the extra step to declare the axisChanged function is sad, especially in my case when i have multiple charts with the same behavoir, but it works nevertheless, thanks — Markus, Nov 03 '20 at 08:32
saddly the interaction with just the right axis is not workling and will require additional events... — Markus, Nov 03 '20 at 08:44
Right, with two event handlers the code gets really ugly. I even need boolean flags to avoid that the two event handlers call each other and cause a StackOverflowException. Also I had to replace the last two lines of the event handler with `rightAxis.Zoom(leftAxis.ActualMaximum, leftAxis.ActualMinimum);` to make it work. I can update my answer with that change if required. — Döharrrck, Nov 03 '20 at 09:59
Also I would recommend to wrap everything into one class if you have multiple of these plots in your application. — Döharrrck, Nov 03 '20 at 10:02

oxyplot - Y axis on both sides of chart

1 Answers1