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

1 vote


I have used WPF Chart Vertically Stacked YAxis example:
WPF Chart Vertically Stacked YAxis | Fast, Native, Charts for WPF (

and WPF Chart Multiple YAxis example:
WPF Chart Multiple YAxis | Fast, Native, Charts for WPF (

I have managed to achieve both individually but now essentially I would like to combine them.

I have been trying to alter the Right Axes Panel Template to allow this but it seems to only allow one or the other.

My main difference from the examples is that I have a collection of Yaxes of NumericAxisViewModel type in my viewmodel that is decided by the user at runtime before creating the chart and so is not defined in the xaml and bound with the YAxes property on the surface using AxesBinding.

I want to be able to vertically stack some of the Yaxes and have the rest stack horizontally side by side on the same axis alignment side, in my case the right side.

Is this something that is possible? If so how do I achieve this?

Let me know if you need any more info.


1 vote


I have a SciChart with multiple y-axes. Thanks to the ZoomPanModifier the user can pan the whole chart by dragging (holding the left mouse button down and moving the mouse). Good! But it should also be possible for the user to pan a certain axis (meaning : changing the min and max values of the axis) and that doesn’t seem to be possible with the built-in ChartModifiers.

So then I thought, no problem, I make my own ChartModifier to handle this (I already implemented two other modifiers for other mouse interactions before, so I get the hang of this :-)). But I don’t get this to work correctly.

My first attempt was to derive from ChartModifierBase and then handle events like OnModifierMouseDown and OnModifierMouseUp. Problem there is that OnModifierMouseUp doesn’t get called when the mouse is not over the chart surface anymore. That is a problem because the user can release the mouse button when the mouse is over another part of the WPF window or even outside of the application window and somewhere else on the screen.

My second attempt was to inherit from ZoomPanModifierBase because the ZoomPanModifier handles these ‘mouseups’ correctly. I try by overriding the Pan(System.Windows.Point currentPoint, System.Windows.Point lastPoint, System.Windows.Point startPoint) method but this method only gets called when the panning starts on the chart area itself, not on one of the axes, so it doesn’t seem to be a solution either.

 public class AxisPanModifier : ZoomPanModifierBase
    public override void Pan(System.Windows.Point currentPoint, System.Windows.Point lastPoint, System.Windows.Point startPoint) {
        // Does not get called when the dragging starts on an axis.

Can someone give me a tip on how to proceed or does someone already have a solution for this ? Thanks for any help in advance. đŸ™‚

Best greetings,

  • srillaert asked 8 years ago
  • last active 8 years ago
1 vote

I made an example based on the “Vertically Stacked Axes” from SciChart Examples. The main difference is that I can add DataSeries / YAxes on the fly.

The problem is that when DrawMajorGridLines, DrawMinorGridLines are turned ON the are drawn only at the first trace.

  • Jan Kaiser asked 8 years ago
  • last active 7 years ago
1 vote

I need axes as described below. I can either modify your existing axis control or add my own in a canvas next to the SciChartSurface. So far I have been unable to modify your existing axis to fit my needs. A Y axis should look like this typical logarithmic axis (range 2 to 2000):

|-----------------  Resistivity ------------------|
2                                                2000

The specifications are
1.) Tick marks only at the end
2.) Title straddles the axis
3.) One axis per curve on the chart
4.) Axis uses same color as curve
5.) Axis uses same dash pattern as curve
6.) The edge of the chart is not an axis

This is basically a combination of a legend with multiple axes. I have not been able to get this effect with existing controls, so I have started to make my own in a canvas. To do this I need to line up my two tick marks with the edges of the chart. How can I obtain the location of the edges?

0 votes

Have a good day!
Is there any way to make two and more axis to take place in the same position (one overlays another).
I’ve tried to do this using margin, but the surface had moved to the left border (picture 1).

<visuals:NumericAxis VisibleRange="{Binding YVisibleRange, Mode=TwoWay}" 
            <visuals:NumericAxis DrawLabels="True" 

            <visuals:NumericAxis DrawLabels="True" 

Thanks in advance!

  • Egor asked 8 years ago
  • last active 8 years ago
0 votes

I’ve had great success showing pixel values of a 2D image using the UniformDataSeries3D type. What I’d like to do now is display a subset of the pixel values in an image using a rectangular region of interest. However, it seems that the axes always start from 0. If I want to have the axes to not begin at value 0, will I have to calculate points for the whole image and zoom in? Or is there a way to set what the starting value of the axes are (while still indexing the values at index 0)

0 votes

How to programmatically add Scrollbars to MVVM instantiated axes?

I added DateTimeAxisViewModel and NumericAxisViewModel to my code. That works from so far. A way to add scrollbars i couldnt find a some tries.

Are there some ways to get this done? Maybe change the templates of the axes or the chart?

Best regards

0 votes

Currently we have two graph surfaces with two Y axes on each side and we need all of the Y axes to have fixed width size. Until now we were achieving that like this:
topGraphSurface.LeftAxisAreaForcedSize = 45;
topGraphSurface.RightAxisAreaForcedSize = 45;
bottomGraphSurface.LeftAxisAreaForcedSize = 45;
bottomGraphSurface.RightAxisAreaForcedSize = 45;

but since updating to the new SciChart v3 we get the error “SciChartSurface does not contain a definition for (Left)AxisAreaForcedSize”. I couldn’t find any information about this in the Migration guide, so is there a way to achieve this in the new version?

0 votes

Hello SciChart-Team,
we had the requirement to show the zero line when there are negative values ​​in the chart.
We noticed the following things, especially in connection with the main grid lines.
There are some side effects at certain sizes of the window:
When the gridlines are on(see screenshot 1):
1. Grid line and tick are not on the same level (Only for certain sizes)
2. The grid line and horizontal annotation line (green) are not aligned either (Only at certain sizes)
3. The axis line (defined via BorderThickness) is also not aligned with the grid line (regardless of the size of the control).And the bottom tick is never aligned with the major grid line

If the major grid lines are switched off, the zero annotation line is not aligned to the ticks for certain sizes of the control (see screenshot 2)

It looks like different algorithms were used to calculate the line position of the ticks, grid lines and line annotations.

The problem was detected on the monitor with 100% scaling. On a 4K monitor with scaling > 100%, the problem became even more apparent

Do you have any suggestion how to solve the problem?

I’ve attached a modified example project in which the behavior can be reproduced.

Silvester Schneidt

1 vote

I want to put multiple Line Charts on a standard WPF TabControl. One Chart per tab.
Each tab should show a different chart with, in general, a different range on its X axis.
After a chart on a tab has been panned or zoomed, then after switching to another tab and then returning to the original tab, then the original X axis values should be preserved.
My problem is that I end up with a behaviour that looks like all the charts share one X axis.

So my question is how can I achieve the desired behaviour?
I did try databinding XAxis and, later, XAxes, but I ended up with the same behaviour.
Thanks in advance to anyone that can help me out with this.

Here is the briefest example I could construct that displays the problem.
It simply displays 3 tabs with different ranges of X values and AutoRange set to “Once”.
When it runs, all 3 charts are displayed with the same X axis range which is only correctly autoranged for the first tab.
The attached images are screenshots of the three tabs.

Here is my XAML:

    xmlns:local="clr-namespace:SciTest" xmlns:s="" x:Class="SciTest.MainWindow"
    Title="MainWindow" Height="300  " Width="500">

    <TabControl ItemsSource="{Binding}">
            <!--This dictates what goes in the Tab header-->
                <TextBlock Text="{Binding Title}" />
            <!--This dictates what goes in the tab page-->
                <s:SciChartSurface RenderableSeries="{Binding RSeries}">
                        <s:NumericAxis AutoRange="Always"/>

And here is the code-behind for the Data Context

    class RSeriesSource
    public String Title { get; set; }
    public ObservableCollection<IRenderableSeries> RSeries{get;set;}
    static Random rnd = new Random(); //for generating example data
    public RSeriesSource()
        RSeries = new ObservableCollection<IRenderableSeries>();
    public static RSeriesSource Example(int n)
        RSeriesSource res = new RSeriesSource();
        res.Title = "S" + n.ToString();
        return res;

    FastLineRenderableSeries AddRS(int offset)
        XyDataSeries<Double, Double> Series = new XyDataSeries<Double, Double>();
        for (int ix = 0; ix < 10; ix++)
            Series.Append(offset * 5 + ix, offset + rnd.NextDouble());
        FastLineRenderableSeries res = new FastLineRenderableSeries();
        res.DataSeries = Series;
        //if (yAx != null)
        //    res.YAxisId = yAx.Id; //Use the Id NOT the axis
        return res;

class RSeriesSourceList : ObservableCollection<RSeriesSource>
    public RSeriesSourceList()
        for (int i = 0; i < 3; i++)
            Add( RSeriesSource.Example(i));
0 votes

We have 2 graph surfaces with 2 Y axes on each side, but the label formatting of the axes is different. That makes the axes widths different and therefore both the graphs appear as they have different widths. Is there a way to make the axis widths fixed so the graphs can be the same size?

0 votes

Does SciChart provide a built-in way to display multiple data series on the same 3D chart where the series do not share a common unit or order of magnitude? On a 2D chart I would use a second y-axis via the YAxes collection but I can’t find an equivalent property on the SciChart3DSurface class.

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