# Primary and Secondary Axes | WPF Controls | DevExpress Documentation The [2D XY Diagram](/WPF/115312/controls-and-libraries/charts-suite/chart-control/diagram/2d-xy-diagram) displays two *primary* [axes](/WPF/6334/controls-and-libraries/charts-suite/chart-control/axes/axes) (arguments’ and values’ axes) by default. You can use *secondary* axes to show series which have different argument (or value) ranges or measurement units that should be displayed in the same diagram. Like primary axes, secondary axes can have additional visual elements such as [constant lines](/WPF/7846/controls-and-libraries/charts-suite/chart-control/axes/constant-lines), [strips](/WPF/7848/controls-and-libraries/charts-suite/chart-control/axes/strips), [labels](/WPF/6336/controls-and-libraries/charts-suite/chart-control/axes/axis-labels), [titles](/WPF/7096/controls-and-libraries/charts-suite/chart-control/axes/axis-titles), [scale breaks](/WPF/119192/controls-and-libraries/charts-suite/chart-control/axes/scale-breaks), [tickmarks, grid lines](/WPF/6337/controls-and-libraries/charts-suite/chart-control/axes/tickmarks-grid-lines-and-interlacing) and [interlacing](/WPF/6337/controls-and-libraries/charts-suite/chart-control/axes/tickmarks-grid-lines-and-interlacing). The following image demonstrates a diagram with a primary y-axis on the left and a secondary y-axis on the right: ![WPF_AxisOverview](/WPF/images/wpf_axisoverview120755.png) - How to: Add a Secondary Axis to a Chart - How to: Generate Secondary Axes in the MVVM Style ## How to: Add a Secondary Axis to a Chart The image below shows two series using a single y-axis. You can add a secondary y-axis to improve smaller value ranges’ readability. ![chart-without-secondary-axis](/WPF/images/chart-without-secondary-axis132223.png) The following code demonstrates how to create a secondary axis and bind it to a series: - XAML 
</dxc:XYDiagram2D>
    <dxc:BarSideBySideSeries2D DisplayName="Order price" 
                      AxisY="{Binding ElementName=orderAxis}"/>
    <dxc:XYDiagram2D.SecondaryAxesY>
        <dxc:SecondaryAxisY2D x:Name="orderAxis"/>
    </dxc:XYDiagram2D.SecondaryAxesY>
    <!-- Other diagram's settings. -->
</dxc:XYDiagram2D>
Use the following classes and properties to specify a secondary x- or y-axis: | Class or Property | Description | | --- | --- | | [XYDiagram2D.SecondaryAxesX](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxesX) | Provides access to the secondary x-axes’ collection. | | [XYDiagram2D.SecondaryAxesY](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxesY) | Provides access to the secondary y-axes’ collection. | | [SecondaryAxisX2D](/WPF/DevExpress.Xpf.Charts.SecondaryAxisX2D) | A secondary x-axis. | | [SecondaryAxisY2D](/WPF/DevExpress.Xpf.Charts.SecondaryAxisY2D) | A secondary y-axis. | | [XYSeries2D.AxisX](/WPF/DevExpress.Xpf.Charts.XYSeries2D.AxisX) | Specifies an x-axis to which the series is bound. | | [XYSeries2D.AxisY](/WPF/DevExpress.Xpf.Charts.XYSeries2D.AxisY) | Specifies a y-axis to which the series is bound. | The following image demonstrates a secondary y-axis to the right of the diagram: ![with-secondary-axis](/WPF/images/with-secondary-axis132224.png) ## How to: Generate Secondary Axes in the MVVM Style Use the following markup to populate a secondary y-axes’ collection when developing a charting application using an **MVVM** design pattern: Tip A complete sample project is available in the DevExpress Code Examples database at https://supportcenter.devexpress.com/ticket/details/t541777/chart-for-wpf-bind-a-chart-to-its-view-model. - XAML 
<dxc:XYDiagram2D SecondaryAxisYItemsSource="{Binding Chart.YAxes}">
     <dxc:XYDiagram2D.SecondaryAxisYItemTemplate>
        <DataTemplate>
            <dxc:SecondaryAxisY2D Alignment="Near" 
                                  GridLinesMinorVisible="True" 
                                  GridLinesVisible="True"
                                  ConstantLineInFrontItemsSource="{Binding ConstantLines}">
                <dxc:SecondaryAxisY2D.WholeRange>
                    <dxc:Range dxc:AxisY2D.AlwaysShowZeroLevel="False"/>
                </dxc:SecondaryAxisY2D.WholeRange>
                <dxc:SecondaryAxisY2D.Title>
                    <dxc:AxisTitle Content="{Binding Title}"/>
                </dxc:SecondaryAxisY2D.Title>
                <dxc:SecondaryAxisY2D.ConstantLineInFrontItemTemplate>
                    <DataTemplate>
                        <dxc:ConstantLine Title="{Binding Title}" Value="{Binding Value}"/>
                    </DataTemplate>
                </dxc:SecondaryAxisY2D.ConstantLineInFrontItemTemplate>
            </dxc:SecondaryAxisY2D>
        </DataTemplate>
    </dxc:XYDiagram2D.SecondaryAxisYItemTemplate>
<!--...-->
</dxc:XYDiagram2D>
Use the following properties to generate secondary axes: | Property | Description | | --- | --- | | [XYDiagram2D.SecondaryAxisXItemsSource](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxisXItemsSource) | The collection that is used to generate secondary x-axes. | | [XYDiagram2D.SecondaryAxisYItemsSource](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxisYItemsSource) | The collection that is used to generate secondary y-axes. | | [XYDiagram2D.SecondaryAxisXItemTemplate](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxisXItemTemplate) | Gets or sets a **DataTemplate** object specifying how secondary x-axes are displayed. | | [XYDiagram2D.SecondaryAxisYItemTemplate](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxisYItemTemplate) | Gets or sets a **DataTemplate** object specifying how secondary y-axes are displayed. | | [XYDiagram2D.SecondaryAxisXItemTemplateSelector](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxisXItemTemplateSelector) | Specifies a custom logic defining which a **DataTemplate** object should be used to display secondary x-axes. | | [XYDiagram2D.SecondaryAxisYItemTemplateSelector](/WPF/DevExpress.Xpf.Charts.XYDiagram2D.SecondaryAxisYItemTemplateSelector) | Specifies a custom logic defining which a **DataTemplate** object should be used to display secondary y-axes. |