By default, the XamDataChart™ control will always draw the XAxis from the left to the right side of the chart and YAxis from the bottom to the top of the chart. However, you have the option of changing this by inverting the drawing of the individual axes using the Axis object’s IsInverted property. If you invert an axis, then the series that uses the axis will be also be inverted.
The following sample code shows all possible combination of orienting the XAxis and YAxis in the Data Chart control. Please note that only settings made in order to invert the axes are shown for clarity.
<Grid>
<ig:XamDataChart>
<!--NOTE: Inverted X-Axis -->
<ig:XamDataChart.Axes>
<ig:CategoryXAxis IsInverted="True" />
<ig:NumericYAxis IsInverted="False" />
</ig:XamDataChart.Axes>
</ig:XamDataChart>
<ig:XamDataChart>
<!--NOTE: No Inverted Axes -->
<ig:XamDataChart.Axes>
<ig:CategoryXAxis IsInverted="False" />
<ig:NumericYAxis IsInverted="False" />
</ig:XamDataChart.Axes>
</ig:XamDataChart>
<ig:XamDataChart>
<!--NOTE: Inverted Both Axes -->
<ig:XamDataChart.Axes>
<ig:CategoryXAxis IsInverted="True" />
<ig:NumericYAxis IsInverted="True" />
</ig:XamDataChart.Axes>
</ig:XamDataChart>
<ig:XamDataChart>
<!--NOTE: Inverted Y-Axis -->
<ig:XamDataChart.Axes>
<ig:CategoryXAxis IsInverted="False" />
<ig:NumericYAxis IsInverted="True" />
</ig:XamDataChart.Axes>
</ig:XamDataChart>
</Grid>
var xAxis1 = new CategoryXAxis();
xAxis1.IsInverted = true;
var yAxis1 = new NumericYAxis();
yAxis1.IsInverted = false;
var xAxis2 = new CategoryXAxis();
xAxis2.IsInverted = false;
var yAxis2 = new NumericYAxis();
yAxis2.IsInverted = false;
var xAxis3 = new CategoryXAxis();
xAxis3.IsInverted = true;
var yAxis3 = new NumericYAxis();
yAxis3.IsInverted = true;
var xAxis4 = new CategoryXAxis();
xAxis4.IsInverted = false;
var yAxis4 = new NumericYAxis();
yAxis4.IsInverted = true;
The following image shows the same data series in four separate XamDataChart controls with different inverted axes combinations including no inverted axes to both XAxis and YAxis inverted.
