SciChart supports placing axes in the centre of a chart:

The Layout System

This requires a customization of the default LayoutManager. This class is responsible for positioning axes on a chart. The layout process consists of two passes for every axis, a measure pass and a layout pass. The LayoutManager conducts this process, doing calculations and providing all the necessary data to its IAxisLayoutStrategy fields. Every IAxisLayoutStrategy field handles a specific AxisAlignment case and is responsible for placing axes with corresponding AxisAlignment  inside the boundaries provided by the LayoutManager.

The layout takes place in the LayoutManager.onLayoutChart() method. It orderly calls IAxisLayoutStrategy.measureAxes() and outStrategy.layoutAxes() during the measure and layout passes and returns evaluated viewport size as the result.

The layout process is triggered by a SciChartSurface in response to different state changes. It is an essential part of a render process.

Customizing Layout of Axes

Usually you don't need to create a custom LayoutManager, but rather to provide a custom IAxisLayoutStrategy for a specific AxisAlignment mode, e.g. for bottom axes layout or right axes layout, or both. It is possible to extend an existing IAxisLayoutStrategy class and change its behavior to better serve your purposes. Please find a list of the existing strategies below:

• TopAlignmentOuterAxisLayoutStrategy
• TopAlignmentInnerAxisLayoutStrategy
• BottomAlignmentOuterAxisLayoutStrategy
• BottomAlignmentInnerAxisLayoutStrategy
• LeftAlignmentOuterAxisLayoutStrategy
• LeftAlignmentInnerAxisLayoutStrategy
• RightAlignmentOuterAxisLayoutStrategy
• RightAlignmentInnerAxisLayoutStrategy

Pinned Axes

The following code extends the TopAlignmentOuterAxisLayoutStrategy class and makes the stack of the top-aligned X axes to start exactly at the center of a chart:

private static class CenteredTopAlignmentAxisLayoutStrategy extends TopAlignmentOuterAxisLayoutStrategy {
 private int chartAreaWidth, chartAreaHeight;
@Override
 public void measureAxes(int availableWidth, int availableHeight, ChartLayoutState chartLayoutState) {
     super.measureAxes(availableWidth, availableHeight, chartLayoutState);

    chartAreaWidth = availableWidth;
     chartAreaHeight = availableHeight;
 }

@Override
 public void layoutAxes(int left, int top, int right, int bottom) {

     // pin the stack of the top-aligned X Axes to the center of a chart
     final int topCoord = chartAreaHeight/2;

     layoutFromTopToBottom(left, topCoord, right, axes);
 }
}

To apply the newly created layout strategy, create a new DefaultLayoutManager instance and set the corresponding field. It can be done using the DefaultLayoutManager.Builder helper. Then assign the LayoutManager to a SciChartSurface:

SciChartSurface chart = new SciChartSurface(getActivity());
chart.setLayoutManager(new DefaultLayoutManager.Builder()
     .setTopOuterAxesLayoutStrategy(new CenteredTopAlignmentAxisLayoutStrategy())
     .build());

 In the result,  the X Axis should be placed at the center of a chart. It should look very similar to this:

Floating Axes

Another possible scenario, floating axes, can be found in the example called Shifted Axes from the SciChart Android Example Suite. In this case each axis is pinned to 0 value of the other axis. To achieve this, the pixel coordinate of 0 data value is looked for during every layout pass, using the Coordinate Transformation API:

private static class CenteredTopAlignmentAxisLayoutStrategy extends TopAlignmentOuterAxisLayoutStrategy {
 private final IAxis yAxis;
private CenteredTopAlignmentAxisLayoutStrategy(IAxis yAxis) {
     this.yAxis = yAxis;
 }

@Override
 public void layoutAxes(int left, int top, int right, int bottom) {

     // find the coordinate of 0 on the Y Axis in pixels
     // place the stack of the top-aligned X Axes at this coordinate
     final float topCoord = yAxis.getCurrentCoordinateCalculator().getCoordinate(0);
     layoutFromTopToBottom(left, (int) topCoord, right, axes);
 }
}

As it can be seen in the example, both axes are pinned to a given data value, not to a specific position inside the chart area. Thus they will adjust their positions accordingly to VisibleRange changes Please refer to the Shifted Axes example to find the complete code sample.

For more examples of custom axes layouts, please refer to the Stack Axes Vertically or Horizontally article.

Advanced Axes Layout Customization

For more advanced layout customization it is possible to override the whole layout process. To achieve this, a custom LayoutManager is required with a custom layout process implemented in the LayoutManager.onLayoutChart() method.