ChartAxisProps

Represents a chart axis with configurable properties for data type, appearance, and behavior.

Props

The following table outlines the props for the ChartAxisProps:

NameTypeDefaultDescription
columnIndex
number
0

Specifies the index of the column to which the axis is assigned when the chart area is divided using columns.

crossAt
null

Defines the configuration for where and how the axis line intersects with another axis. This includes the intersection value, the target axis, and whether overlapping of axis elements is allowed.

desiredIntervals
number
null

Specifies the desired number of intervals for the axis. The actual number may vary depending on the available space and data range.

indexed
boolean
false

When set to true, data points are rendered based on their index position rather than their actual x-axis values.

interval
number
null

Specifies the interval between axis labels or ticks.

intervalType
'Auto'

Defines how intervals are calculated and displayed on a date-time axis. Available options:

  • Auto: Automatically determines the interval based on the data.
  • Years: Uses yearly intervals.
  • Months: Uses monthly intervals.
  • Days: Uses daily intervals.
  • Hours: Uses hourly intervals.
  • Minutes: Uses minute-based intervals.
  • Seconds: Uses second-based intervals.
inverted
boolean
false

When set to true, the axis is rendered in reverse order, displaying values from maximum to minimum.

lineStyle
{width: 1, color: '', dashArray: ''}

Customizes the appearance of the axis line. Accepts an AxisLine object to configure properties such as color, width, and dash pattern.

logBase
number
10

Sets the base value for a logarithmic axis.

valueType must be set to Logarithmic for this to take effect.

maxLabelDensity
number
3

Specifies the maximum number of labels per 100 pixels of axis length.

maximum
Object
null

Sets the maximum value of the axis range. Defines the upper bound of the axis and controls the visible data range.

minimum
Object
null

Sets the minimum value of the axis range. Defines the lower bound of the axis and controls the visible data range.

minorTicksPerInterval
number
0

Specifies the number of minor ticks per interval.

name
string
''

A unique identifier for the axis. To associate an axis with a series, set this name in the series' xAxisName or yAxisName.

opposedPosition
boolean
false

When set to true, the axis is rendered on the opposite side of its default position.

plotOffset
{left: 0, right: 0, top: 0, bottom: 0}

Sets padding around the chart area in pixels.

rangePadding
'Auto'

Controls how padding is applied to the axis range. Available options:

  • None: No padding.
  • Normal: Padding based on range calculation.
  • Additional: Adds one interval to both ends of the range.
  • Round: Rounds the range to the nearest interval.
rowIndex
number
0

Specifies the index of the row to which the axis is assigned when the chart area is divided using rows.

skeleton
string
''

Specifies the skeleton format used for processing date-time values.

skeletonType
'DateTime'

Specifies the format type used for date-time formatting. Available options:

  • Date: Formats and displays only the date portion.
  • DateTime: Formats and displays both date and time.
  • Time: Formats and displays only the time portion.
span
number
1

Specifies how many columns or rows the axis should span in the chart layout.

startFromZero
boolean
true

When set to true, the axis starts from zero, ensuring a baseline reference for data comparison. When set to false, the axis starts from the minimum value in the dataset, which can help highlight variations in data when zero is not a meaningful starting point.

tickPosition
'Outside'

Determines the position of axis ticks relative to the axis line. Available options:

  • Inside: Renders ticks inside the axis line.
  • Outside: Renders ticks outside the axis line.
valueType
'Double'

Specifies the type of data the axis represents to ensure appropriate rendering. Available options:

  • Double: Numeric axis for numerical data.
  • DateTime: Date-time axis for temporal data.
  • Category: Category axis for categorical data.
  • Logarithmic: Logarithmic axis for data with a wide range of values.
visible
boolean
true

When set to false, axis labels are hidden from the chart.

zoomFactor
number
1

Scales the axis by the specified factor. For example, a zoomFactor of 0.5 scales the chart by 200% along this axis.

Value must be between 0 and 1.

zoomPosition
number
0

Sets the position of the zoomed axis within the zoomed range. Value ranges from 0 to 1.