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


At the moment I am using a single chart with two y axes.

If you look at the file YAxesNow_SinExp.png, you can see that the 0 value for sin is at the middle of the image and the 0 for e^x is at the bottom. These two must be aligned so that the zero values are the same on both Axis.

Also, in the same image you can see that the major ticks for e^x are aligned to the major grid lines, but the ticks for sin(x) are not. In my case, the ticks for both axes must also be aligned to the grid lines.

In the file YAxesNeeded_SinExp.png I did a rough sketch of how it should be.

Do you know how I can achieve this?

  • You must to post comments

Thanks for the images – that really clarifies the matter.

Ok by default SciChart tries to zoom to fit the first time you add data to the chart. After this you can change the VisibleRange manually on the Y-Axis.

In the above case you need to set each YAxis to have equal positive, negative visible ranges.

For instance:

// Sinewave visible range
yAxis1.VisibleRange = new DoubleRange(-1.0, 1.0)

// Exponential visible range
yAxis2.VisibleRange = new DoubleRange(-20000, 20000)

By setting the visible range min equal to -max it will ensure the zero line is always in the centre of the chart. Can you try this and let me know how you get on?

Some other properties on the Axis which you may be interested in:

  • AxisBase.AutoTicks: set to false to manually set major, minor delta
  • AxisBase.MaxAutoTicks: constrains number of ticks generated with AutoTicks=true
  • AxisBase.MajorDelta: Major delta spacing
  • AxisBase.MinorDelta: Minor delta spacing
  • Straliciuc
    Hmm.. yes, setting equal positive and negative visible ranges would work in this specific case, but I don't always have equal ranges. The sine wave was just an oversimplified example, in the real scenario the ranges are not equal. I was thinking of writing a custom chart modifier, but since I don't fully understand the API yet I don't know if it's possible to solve the problem in this way. What is your opinion?
  • You must to post comments

I think the only way to do this is to create an algorithm which calculates the desired Minimum, Maximum range on each axis so that the zero crossings are at the same location. The naive approach is as I said, equal and opposite Min/Max values on both axes.

A more complex approach would calculate min, max values where the ratio between positive and negative halves is the same for both axes.

So unknown algorithm taking inputs:

  • Viewport Height (giving axis height)
  • Series Min/Max on Axis 1
  • Series Min/Max on Axis 2

and yielding outputs:

  • VisibleRange Min/Max on Axis 1
  • VisibleRange Min/Max on Axis 2

If you can think of an algorithm to perform this calculation, I can assist to write the code to set the visible ranges on appending data đŸ™‚

  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.