Back to Devexpress

NumericAxisX Class

mobilecontrols-devexpress-dot-xamarinforms-dot-charts-a3c8aab5.md

latest13.8 KB
Original Source

NumericAxisX Class

The X-axis the chart uses to display series that represent data sources with numeric arguments.

Namespace : DevExpress.XamarinForms.Charts

Assembly : DevExpress.XamarinForms.Charts.dll

NuGet Package : DevExpress.XamarinForms.Charts

Declaration

csharp
public class NumericAxisX :
    AxisX

Remarks

The following image highlights elements the axis includes:

|

  1. Label
  2. Title
  3. Axis Line
  4. Major Tick Mark

|

  1. Minor Tick Mark
  2. Major Grid Line
  3. Minor Grid Line
  4. Interlacing

|

  1. Constant Line
  2. Strip

|

How to: Specify chart axes

The ChartView.AxisX property contains the X-axis the chart uses to arrange series:

xml
<dxc:ChartView>
    <dxc:ChartView.AxisX>
        <dxc:NumericAxisX>
    </dxc:ChartView.AxisX>
</dxc:ChartView>

Note

The chart creates axes compatible with the first series’ data type if the chart does not have specified axes.

How to: Manage the Value Range the Axis Display

The X-axis automatically calculates the value range by data of all series that the axis measures. To show a particular value interval, specify the range’s VisualMin and VisualMax properties:

xml
<dxc:NumericAxisX>
    <dxc:NumericAxisX.Range>
        <dxc:NumericRange VisualMin="10" VisualMax="90">
    </dxc:NumericAxisX.Range>
</dxc:NumericAxisX>

Note

Chart zooming and scrolling change visual values. To limit the interval in which users can change a visual range, use NumericRange.Min and NumericRange.Max properties.

The following table lists all classes and properties the code above uses:

|

Symbol

|

Description

| | --- | --- | |

NumericAxisX.Range

|

Specifies the axis range settings.

| |

NumericRange

|

Stores range settings of NumericAxisX and NumericAxisY.

| |

NumericRange.VisualMin

|

Gets or sets the start value of the axis range that is currently displayed on a screen.

| |

NumericRange.VisualMax

|

Gets or sets the end value of the axis range that is currently displayed on a screen.

| |

NumericRange.Min

|

Gets or sets the minimum scale value of the axis.

| |

NumericRange.Max

|

Gets or sets the maximum scale value of the axis.

|

How to: Customize X-Axis Scale Parameters

The X-Axis provides settings that manage how the axis lays out its grid lines, tick marks, and labels. The image below demonstrates these settings:

  1. Grid Offset - The distance between the first tick mark / grid line and the minimum value of the axis value range.
  2. Grid Alignment - The number of units between neighbor major tick marks and grid lines.

The following code customizes these parameters:

xml
<dxc:NumericAxisX GridOffset="5" GridAlignment="10"/>

How to: Manage Axis Labels

Axis Labels show the textual representation of axis values at which the axis places major tick marks and grid lines:

The code snippet below demonstrates how to customize axis labels:

xml
<dxc:NumericAxisX>
    <dxc:NumericAxisX.Label>
        <dxc:AxisLabel TextFormat="0.##">
    <dxc:NumericAxisX.Label>
</dxc:NumericAxisX>

The code above uses the following class and property:

|

Symbol

|

Description

| | --- | --- | |

AxisBase.Label

|

Provides access to the settings that specify the text format, position, and appearance of axis labels.

| |

AxisLabel

|

Stores axis label settings.

|

How to: Specify the Axis Title

The Axis Title is additional text that explains the values the axis measures:

The markup below enables the title that the image above shows:

xml
<dxc:NumericAxisX>
    <dxc:NumericAxisX.Title>
        <dxc:AxisTitle Text="Year">
    <dxc:NumericAxisX.Title>
</dxc:NumericAxisX>

The following table lists API that the markup above uses:

|

Symbol

|

Description

| | --- | --- | |

AxisBase.Title

|

Specifies the axis title.

| |

AxisTitle

|

Stores axis title settings.

|

How to: Add a Constant Line

A Constant Line highlights a specific axis value by a perpendicular straight line with a title:

The following code adds the constant line to the X-axis:

xml
<dxc:NumericAxisX>
    <dxc:NumericAxisX.ConstantLines>
        <dxc:NumericConstantLine AxisValue="2019" LegendText="Nowadays">
            <dxc:NumericConstantLine.Title>
                <dxc:ConstantLineTitle Text="Nowadays">
            </dxc:NumericConstantLine.Title>
        </dxc:NumericConstantLine>
    <dxc:NumericAxisX.ConstantLines>
</dxc:NumericAxisX>

The code above used the following classes and properties:

|

Symbol

|

Description

| | --- | --- | |

NumericAxisX.ConstantLines

|

Gets the collection of constant lines that the axis contains.

| |

NumericConstantLine

|

The vertical or horizontal straight line that passes through the chart and indicates a qualitative x- or y-axis’s value.

| |

NumericConstantLine.AxisValue

|

Gets or sets the constant line position along the numeric axis.

| |

ConstantLineBase.LegendText

|

Gets or sets the text that identifies the constant line in the chart legend.

| |

ConstantLineBase.Title

|

Gets or sets settings of the constant line title.

| |

ConstantLineTitle

|

Stores constant line title settings.

| |

TitleBase.Text

|

Gets or sets the text the title displays.

|

How to: Add a Strip

A Strip highlights a specific range of axis values using a perpendicular straight area with an axis label:

Note

The axis hides its labels when any strip has a label.

The following code adds the strip to the X-axis:

xml
<dxc:NumericAxisX>
    <dxc:NumericAxisX.Strips>
        <dxc:NumericStrip MinLimit="2019" MaxLimitEnabled="False">
            <dxc:NumericStrip.AxisLabel>
                <dxc:StripAxisLabel Text="Future">
            </dxc:NumericStrip.AxisLabel>
        </dxc:NumericStrip>
    <dxc:NumericAxisX.Strips>
</dxc:NumericAxisX>

The code above used the following classes and properties:

|

Symbol

|

Description

| | --- | --- | |

NumericAxisX.Strips

|

Gets the collection of strips that the axis contains.

| |

NumericStrip

|

The highlighted area limited by two fixed values (minimal and maximal limits) of an axis, and is perpendicular to the axis.

| |

NumericStrip.MinLimit

|

Gets or sets the minimum limiting value of the strip along an axis.

| |

StripBase.MinLimitEnabled

|

Indicates whether the strip is limited by its MinLimit value.

| |

NumericStrip.MaxLimit

|

Gets or sets the maximum limiting value of the strip along an axis.

| |

StripBase.MaxLimitEnabled

|

Indicates whether the strip is limited by its MaxLimit value.

| |

StripBase.LegendText

|

Gets or sets a text the strip provides to the chart legend.

| |

StripBase.Title

|

Gets or sets the axis label the strip displays on the axis to which the strip belongs.

| |

StripAxisLabel

|

Stores the strip’s axis label settings.

| |

StripAxisLabel.Text

|

Specifies the text of a strip’s axis label.

|

How to: Customize Axis Appearance

The axis provides the Style property that stores the appearance of the following elements:

| |

Element

|

Properties That Affect the Element

| | --- | --- | --- | |

|

Axis Line

|

LineColor, LineThickness, LineVisible

| |

|

Major Tick Marks

|

LineColor, MajorTickmarksThickness, MajorTickmarksLength, MajorTickmarksVisible

| |

|

Minor Tick Marks

|

LineColor, MinorTickmarksThickness, MinorTickmarksLength, MinorTickmarksVisible

| |

|

Major Grid Lines

|

MajorGridlinesThickness, MajorGridlinesColor, MajorGridlinesVisible

| |

|

Minor Grid Lines

|

MinorGridlinesThickness, MinorGridlinesColor, MinorGridLinesVisible

|

Note

Labels, Titles, Constant Lines and Strips provide their Style properties that manage the appearance of these elements.

Implements

INotifyPropertyChanged

Inheritance

Object ChartElement StyledElement AxisBase AxisX NumericAxisX

See Also

NumericAxisX Members

DevExpress.XamarinForms.Charts Namespace