For a documentation article about this topic, please see Axis Alignment - Setting Axis Alignment.

Creating a Chart with Multiple X and Y Axes

SciChart supports unlimited X Axes and Y Axes amount on a Chart. When more than one X or Y Axes is required, an alternative properties, SciChartSurface.YAxes and SciChartSurface.XAxes must be used instead of SciChartSurface.XAxis and SciChartSurface.YAxis.

Combinations may be used, e.g. use the SciChartSurface.YAxes property to define 2 or more Y Axes, but SciChartSurface.XAxis property to define a single X Axis, and vice versa.

NOTE: Please note that it is required to apply a unique string ID to every axis in the same collection if there are multiple X Axes or Y Axes. There is the Axis.Id property for this.

A chart with multiple Axes can be declared like shown below:

C#

var scs = new SciChartSurface();

var yAxisLeft = new NumericAxis() { Id="LeftYAxis", AxisAlignment = AxisAlignment.Left };
var yAxisRight = new NumericAxis() { Id="RightYAxis", AxisAlignment = AxisAlignment.Right }; 
var xAxisBottom = new DateTimeAxis() { Id="BottomXAxis", AxisAlignment = AxisAlignment.Bottom}; 
var xAxisTop = new DateTimeAxis() { Id="TopXAxis", AxisAlignment = AxisAlignment.Top};

scs.XAxes.Add(xAxisBottom); 
scs.XAxes.Add(xAxisTop); 
scs.YAxes.Add(yAxisLeft); 
scs.YAxes.Add(yAxisRight);

XAML

<!-- Define the SciChartSurface, using a theme from the predefined list -->
<s:SciChartSurface x:Name="sciChartSurface" 
                    s:ThemeManager.Theme="Chrome">
            
    <s:SciChartSurface.RenderableSeries>
        <!-- Omitted for Brevity  -->
    </s:SciChartSurface.RenderableSeries>

    <!-- Defines the XAxes -->
    <s:SciChartSurface.XAxes>
        <s:DateTimeAxis AxisAlignment="Bottom" Id="BottomXAxis"/>
        <s:DateTimeAxis AxisAlignment="Top" Id="TopXAxis"/>
    </s:SciChartSurface.XAxes>

    <!-- Defines the YAxes  -->
    <s:SciChartSurface.YAxes>
        <s:NumericAxis AxisAlignment="Left" Id="LeftYAxis"/>
        <s:NumericAxis AxisAlignment="Right" Id="RitghYAxis"/>
    </s:SciChartSurface.YAxes>

</s:SciChartSurface>

The resulting chart may look like on the screenshot below:

Further Reading

SciChart provides other capabilities to layout a chart also. For further information on please see the following documentation articles:

• Axis Alignment - Setting Axis Alignment
• Axis Alignment - Rotating a Chart Vertically
• Axis Alignment - Placing Axis Central in the Chart

There are also several examples in SciChart Examples Suite that demo axis layout possibilities:

• Multiple XAxis
• Multiple YAxis
• Seconday YAxis
• Vertical Charts
• Vertically Stacked YAxes
• Polar Chart With Multiple Axis