---
title: "Axis Types"
framework: javascript
version: "14.1.0"
---

# Axis Types

The horizontal (X) and vertical (Y) lines in cartesian charts are referred to as chart axes, and they serve to illustrate the relationships between data points on the graph. This section discusses the different axis types.

In most cases, specifying an axis type is unnecessary as an appropriate axis will be inferred from the data and series type used in the chart. By default, the x-axis uses a [Category](#category), [Time](#time) or [Number](#number) axis based on the data type, whilst the y-axis defaults to a [Number](#number) axis.

Axis types can be explicitly configured as explained below.

> **Note**
>
> For an overview of how to configure axes and bind them to series, see [Axis Configuration](https://www.ag-grid.com/charts/javascript/axes-configuration/).

## Category

A category axis is used to display distinct categories or groups of data in a chart.

The category axis shows discrete categories or groups of data, unlike the [Number](#number) or [Time](#time) axes which use a continuous scale. For instance, in a bar chart of sales per product, the category axis shows the products as different groups, and the number axis displays the corresponding sale value for each group.

```js
{
    axes: {
        x: {
            type: 'category',
        },
    },
}
```

The category axis will attempt to render an [Axis Label](https://www.ag-grid.com/charts/javascript/axes-labels/), [Grid Line](https://www.ag-grid.com/charts/javascript/axes-grid-lines/) and Tick for each category with even spacing.

For a full list of configuration options see [Category Axis Options](#reference-AgCategoryAxisOptions).

## Grouped Category

A grouped category axis is similar to the regular category axis, with the additional ability to display nested categories or hierarchical groups of data.

#### Grouped Category

```ts
import {
  AgCartesianChartOptions,
  AgCharts,
  BarSeriesModule,
  GroupedCategoryAxisModule,
  LegendModule,
  ModuleRegistry,
  NumberAxisModule,
} from "ag-charts-community";
import { getData } from "./data";

ModuleRegistry.registerModules([
  BarSeriesModule,
  GroupedCategoryAxisModule,
  LegendModule,
  NumberAxisModule,
]);

const options: AgCartesianChartOptions = {
  title: {
    text: "Olympic Medal Counts by Region, Country, and City",
  },
  data: getData(),
  axes: {
    x: {
      type: "grouped-category",
      depthOptions: [
        {},
        { label: { fontWeight: "bold" } },
        { label: { fontSize: 10 } },
      ],
    },
  },
  series: [
    {
      type: "bar",
      xKey: "location",
      xName: "Location",
      yKey: "gold",
      yName: "Gold",
    },
    {
      type: "bar",
      xKey: "location",
      xName: "Location",
      yKey: "silver",
      yName: "Silver",
    },
    {
      type: "bar",
      xKey: "location",
      xName: "Location",
      yKey: "bronze",
      yName: "Bronze",
    },
  ],
};

options.container = document.getElementById("myChart");

const chart = AgCharts.create(options);
```

[Live example: Grouped Category](https://www.ag-grid.com/charts/typescript/axes-types/examples/grouped-category)

To use a grouped category axis, the `xKey` needs to reference an array of strings, with each string representing a level in the hierarchy.

For example, to create the above example comparing Olympic medal counts by hierarchical location, the data must include an array with the regions, countries, and cities.

```js
{
    data: [
        { location: ['Europe', 'United Kingdom', 'London'], gold: 27, silver: 23, bronze: 17 },
        { location: ['Europe', 'United Kingdom', 'Manchester'], gold: 12, silver: 8, bronze: 10 },
        { location: ['Asia', 'China', 'Beijing'], gold: 38, silver: 32, bronze: 18 },
        { location: ['Asia', 'China', 'Shanghai'], gold: 20, silver: 15, bronze: 12 },
        { location: ['Asia', 'Japan', 'Tokyo'], gold: 27, silver: 14, bronze: 17 },
        { location: ['North America', 'United States', 'Los Angeles'], gold: 46, silver: 37, bronze: 38 },
        { location: ['North America', 'Canada', 'Toronto'], gold: 8, silver: 6, bronze: 10 },
    ],
}
```

The grouped category axis will render [Axis Labels](https://www.ag-grid.com/charts/javascript/axes-labels/), [Grid Lines](https://www.ag-grid.com/charts/javascript/axes-grid-lines/), and Ticks for each level in the hierarchy, aligning them to visually represent the nested relationships between categories.

Ticks and labels for all levels inherit styles from the axis options by default. To style each level differently, use the `depthOptions` array, where each entry corresponds to a hierarchy level, starting at the leaf level.

```js
{
    axes: {
        x: {
            type: 'grouped-category',
            depthOptions: [
                {}, // Skip depth 0 - the nearest to the axis, no unique styles.
                { label: { fontWeight: 'bold' } }, // depth 1
                { label: { fontSize: 10 } }, //depth 2
            ],
        },
    },
}
```

## Number

A number axis is used to display continuous numerical values in a chart.

The number axis displays continuous numerical values, unlike the [Category](#category) axis which displays discrete categories or groups of data. This means that while categories are spaced out evenly, the distance between values in a number axis will depend on their magnitude.

Instead of using an [Axis Interval](https://www.ag-grid.com/charts/javascript/axes-intervals/) with one item per value, the number axis will determine the range of all values, round it up and try to segment the rounded range with evenly spaced intervals.

```js
{
    axes: {
        y: {
            type: 'number',
        },
    },
}
```

For a full list of configuration options see [Number Axis Options](#reference-AgNumberAxisOptions).

## Log

If the range of values is very wide, the `log` axis can be used instead of the `number` axis. For example, because the `number` axis uses a linear scale, same changes in magnitude result in the same pixel distance.

The `log` axis uses a log scale, where same *percentage* changes in magnitude result in the same pixel distance. In other words, the pixel distance between 10 and 100, and 100 and 1000 will be the same because both ranges represent the same percentage increase. Whereas, if the `number` axis was used, the second distance would be 10 times larger than the first.

The above property of the log axis can also be useful in financial charts. For example, if your rate of return on an investment stays consistent over time, the investment value chart will look like a straight line.

By default, if the data domain has `5` or more orders of magnitude, the `log` axis attempts to render `5` ticks. Otherwise, `10` ticks (the logarithm base) is rendered per order of magnitude. For example a data domain of `[1, 100]` with `2` orders of magnitude, will show `1`, `2`, `3`, `4`,`5`, `6`, `7`, `8`, `9`, `10`, `20`, `30`, `40`, `50`, `60`, `70`, `80`, `90`, `100`.

Depending on the data domain and chart size, using a larger value for the `tick: { minSpacing: xxx }` config might be necessary to reduce the number of ticks.

```js
{
    axes: {
        y: {
            type: 'log',
            minSpacing: 200,
        },
    },
}
```

The `log` axis uses the common logarithm (base 10) by default. The `base` config allows you to change the base to any number you like, for example `Math.E` for natural or `2` for binary logarithms:

```js
{
    axes: {
        y: {
            type: 'log',
            base: 2,
        },
    },
}
```

For a full list of configuration options see [Log Axis Options](#reference-AgLogAxisOptions).

These configurations above are demonstrated in the following example:

#### Log Axis

```ts
import {
  AgCartesianChartOptions,
  AgCharts,
  CategoryAxisModule,
  LegendModule,
  LineSeriesModule,
  LogAxisModule,
  ModuleRegistry,
  NumberAxisModule,
} from "ag-charts-community";

ModuleRegistry.registerModules([
  CategoryAxisModule,
  LegendModule,
  LineSeriesModule,
  LogAxisModule,
  NumberAxisModule,
]);

const options: AgCartesianChartOptions = {
  data: [
    { os: "A", share: 10 },
    { os: "B", share: 100 },
    { os: "C", share: 1000 },
  ],
  series: [
    {
      type: "line",
      xKey: "os",
      yKey: "share",
    },
  ],
};

options.container = document.getElementById("myChart");

const chart = AgCharts.create(options);

function setNumberAxis() {
  options.axes = {
    y: {
      type: "number",
      label: {
        format: ".0f",
      },
    },
  };

  chart.update(options);
}

function setLogAxis() {
  options.axes = {
    y: {
      type: "log",
      label: {
        format: ".0f",
      },
    },
  };

  chart.update(options);
}

function setBaseTwoLogAxis() {
  options.axes = {
    y: {
      type: "log",
      label: {
        format: ".0f",
      },
      base: 2,
    },
  };

  chart.update(options);
}

function setLogAxisWithFewerTicks() {
  options.axes = {
    y: {
      type: "log",
      interval: {
        minSpacing: 200,
      },
      label: {
        format: ".0f",
      },
    },
  };

  chart.update(options);
}

if (typeof window !== "undefined") {
  // Attach external event handlers to window so they can be called from index.html
  (<any>window).setNumberAxis = setNumberAxis;
  (<any>window).setLogAxis = setLogAxis;
  (<any>window).setBaseTwoLogAxis = setBaseTwoLogAxis;
  (<any>window).setLogAxisWithFewerTicks = setLogAxisWithFewerTicks;
}
```

[Live example: Log Axis](https://www.ag-grid.com/charts/typescript/axes-types/examples/number-vs-log)

> **Note**
>
> The domain of a log axis should be strictly positive or strictly negative (because there's no power you can raise a number to that will yield zero). For that reason, any non-conforming domain will be clipped to conformity. For example, `[0, 10]` will be clipped to `[1, 10]`. If the data domain crosses `0`, for example `[-10, 5]`, no data will be rendered. It is often desirable to set the `min` or `max` property of the axis manually. In this case it can be `max: -1`.

## Time

There are three methods of displaying time along an axis.

- [Unit Time Axis](https://www.ag-grid.com/charts/javascript/axes-time/#unit-time) - Each 'unit' has a dedicated band within the domain.
- [Ordinal Time Axis](https://www.ag-grid.com/charts/javascript/axes-time/#ordinal-time) - Only provided values are shown, with missing values omitted.
- [Continuous Time Axis](https://www.ag-grid.com/charts/javascript/axes-time/#continuous-time) - Data is shown on a continuous scale.

The difference between a [Unit Time Axis](https://www.ag-grid.com/charts/javascript/axes-time/#unit-time), an [Ordinal Time Axis](https://www.ag-grid.com/charts/javascript/axes-time/#ordinal-time), and a continuous [Continuous Time Axis](https://www.ag-grid.com/charts/javascript/axes-time/#continuous-time) is demonstrated in the following example:

#### Time Axis Types

```ts
import {
  AgCartesianChartOptions,
  AgCharts,
  AnimationModule,
  BarSeriesModule,
  ContextMenuModule,
  CrosshairModule,
  LegendModule,
  ModuleRegistry,
  NumberAxisModule,
  OrdinalTimeAxisModule,
  TimeAxisModule,
  UnitTimeAxisModule,
} from "ag-charts-enterprise";

ModuleRegistry.registerModules([
  AnimationModule,
  BarSeriesModule,
  CrosshairModule,
  LegendModule,
  NumberAxisModule,
  OrdinalTimeAxisModule,
  TimeAxisModule,
  UnitTimeAxisModule,
  ContextMenuModule,
]);

const options: AgCartesianChartOptions = {
  title: {
    text: "School Absences",
  },
  data: [
    { date: new Date(2024, 0, 1), value: 2 },
    { date: new Date(2024, 1, 1), value: 5 },
    { date: new Date(2024, 2, 1), value: 3 },
    { date: new Date(2024, 3, 1), value: 1 },
    { date: new Date(2024, 4, 1), value: 2 },
    { date: new Date(2024, 5, 1), value: 3 },
    { date: new Date(2024, 9, 1), value: 1 },
    { date: new Date(2024, 10, 1), value: 2 },
    { date: new Date(2024, 11, 1), value: 2 },
  ],
  series: [
    {
      type: "bar",
      xKey: "date",
      yKey: "value",
    },
  ],
  axes: {
    x: {
      type: "unit-time",
      title: { text: "Unit Time Axis" },
    },
  },
};

options.container = document.getElementById("myChart");

const chart = AgCharts.create(options);

function setContinuousTimeAxis() {
  options.axes = {
    x: {
      type: "time",
      title: { text: "Continuous Time Axis" },
    },
  };

  chart.update(options);
}

function setUnitTimeAxis() {
  options.axes = {
    x: {
      type: "unit-time",
      title: { text: "Unit Time Axis" },
    },
  };

  chart.update(options);
}

function setOrdinalTimeAxis() {
  options.axes = {
    x: {
      type: "ordinal-time",
      interval: {
        step: "month",
      },
      title: { text: "Ordinal Time Axis" },
    },
  };

  chart.update(options);
}

if (typeof window !== "undefined") {
  // Attach external event handlers to window so they can be called from index.html
  (<any>window).setContinuousTimeAxis = setContinuousTimeAxis;
  (<any>window).setUnitTimeAxis = setUnitTimeAxis;
  (<any>window).setOrdinalTimeAxis = setOrdinalTimeAxis;
}
```

[Live example: Time Axis Types](https://www.ag-grid.com/charts/typescript/axes-types/examples/time-vs-unit-time-vs-ordinal-time)

For more detail on time axes, see the [Time Axes](https://www.ag-grid.com/charts/javascript/axes-time/) page.

## API Reference

#### Category Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'category' |  | Axis type identifier. |
| interval | AgAxisCategoryIntervalOptions |  | Configuration for the axis ticks interval. |
| interval.placement | 'on' \| 'between' | 'between' | Placement of ticks and labels relative to the category. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |
| paddingInner | Ratio |  | The size of the gap between the categories as a proportion, between 0 and 1. This value is a fraction of the “step”, which is the interval between the start of a band and the start of the next band. |
| paddingOuter | Ratio |  | The padding on the outside i.e. left and right of the first and last category. In association with `paddingInner`, this value can be between 0 and 1. |
| groupPaddingInner | Ratio |  | This property is for grouped column/bar series plotted on a category axis. It is a proportion between 0 and 1 which determines the size of the gap between the bars or columns within a single group along the axis. |
| bandHighlight | AgBandHighlightOptions |  | Configuration for the axis band highlight. |
| bandHighlight.enabled | boolean |  | Whether to show the band highlight. |
| bandHighlight.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| bandHighlight.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| bandHighlight.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| bandHighlight.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| bandHighlight.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| bandHighlight.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour to use for the fill of the band. A colour string, or an object for a gradient, pattern, or image fill. |
| bandHighlight.fillOpacity | Opacity |  | The opacity of the fill for the band. |
| bandAlignment | 'justify' \| 'start' \| 'center' \| 'end' | 'justify' | The alignment of bands when used with bar-like series with fixed widths. |
| skipNullBars | boolean | false | Set to `true` to prevent bars with `null`, `undefined` or missing values from taking up space in each category. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| maxThicknessRatio | Ratio | 0.3 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgBaseCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgBaseCartesianAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |

#### Grouped Category Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'grouped-category' |  | Axis type identifier. |
| paddingInner | Ratio |  | The size of the gap between the categories as a proportion, between 0 and 1. This value is a fraction of the “step”, which is the interval between the start of a band and the start of the next band. |
| groupPaddingInner | Ratio |  | This property is for grouped column/bar series plotted on a category axis. It is a proportion between 0 and 1 which determines the size of the gap between the bars or columns within a single group along the axis. |
| depthOptions | AgGroupedCategoryDepthOptions[] |  | An array of depth options, starting from the leafs. |
| depthOptions.label | AgGroupedCategoryDepthLabelOptions |  | Configuration for the axis labels at this depth level. |
| depthOptions.label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| depthOptions.label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| depthOptions.label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| depthOptions.label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| depthOptions.label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| depthOptions.label.fontStyle | FontStyle |  | The font style to use for the labels. |
| depthOptions.label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| depthOptions.label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| depthOptions.label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| depthOptions.label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| depthOptions.label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| depthOptions.label.border | BorderOptions |  | Stroke options for the box border. |
| depthOptions.label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| depthOptions.label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| depthOptions.label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| depthOptions.label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| depthOptions.label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| depthOptions.label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| depthOptions.label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| depthOptions.tick | AgGroupedCategoryDepthTickOptions |  | Configuration for the axis ticks at this depth level. |
| depthOptions.tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| depthOptions.tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| depthOptions.tick.stroke | CssColor |  | The colour of the axis ticks. |
| tick | AgGroupedCategoryAxisTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |
| bandHighlight | AgBandHighlightOptions |  | Configuration for the axis band highlight. |
| bandHighlight.enabled | boolean |  | Whether to show the band highlight. |
| bandHighlight.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| bandHighlight.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| bandHighlight.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| bandHighlight.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| bandHighlight.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| bandHighlight.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour to use for the fill of the band. A colour string, or an object for a gradient, pattern, or image fill. |
| bandHighlight.fillOpacity | Opacity |  | The opacity of the fill for the band. |
| maxThicknessRatio | Ratio | 0.5 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgBaseCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgGroupedCategoryAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| interval | AgAxisBaseIntervalOptions |  | Configuration for the axis ticks interval. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |

#### Number Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'number' |  | Axis type identifier. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| maxThicknessRatio | Ratio | 0.3 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.format | TFormat |  | Format string used when rendering labels. |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgCartesianAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| label.format | string |  | Format string used when rendering labels. |
| tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |
| nice | boolean |  | If `true`, the range will be rounded up to ensure nice equal spacing between the ticks.  __Note:__ This does not override the `min` or `max` options. |
| interval | AgAxisContinuousIntervalOptions |  | Configuration for the axis ticks interval. A unit keyword (or number), or an object describing the interval. |
| interval.step | number \| bigint |  | The axis interval. Expressed in the units of the axis. If the configured interval results in too many items given the chart size, it will be ignored. `bigint` steps are accepted but precision is limited to the Number range. |
| interval.maxSpacing | PixelSize |  | Maximum gap in pixels between items. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |
| min | number \| bigint |  | The min value for the axis domain. |
| max | number \| bigint |  | The max value for the axis domain. |
| preferredMin | number \| bigint |  | The min value for the axis, unless extended by the series data or `nice` option. |
| preferredMax | number \| bigint |  | The max value for the axis, unless extended by the series data or `nice` option. |

#### Log Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'log' |  | Axis type identifier. |
| base | number |  | The base of the logarithm used. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| maxThicknessRatio | Ratio | 0.3 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.format | TFormat |  | Format string used when rendering labels. |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgCartesianAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| label.format | string |  | Format string used when rendering labels. |
| tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |
| nice | boolean |  | If `true`, the range will be rounded up to ensure nice equal spacing between the ticks.  __Note:__ This does not override the `min` or `max` options. |
| interval | AgAxisContinuousIntervalOptions |  | Configuration for the axis ticks interval. A unit keyword (or number), or an object describing the interval. |
| interval.step | number \| bigint |  | The axis interval. Expressed in the units of the axis. If the configured interval results in too many items given the chart size, it will be ignored. `bigint` steps are accepted but precision is limited to the Number range. |
| interval.maxSpacing | PixelSize |  | Maximum gap in pixels between items. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |
| min | number \| bigint |  | The min value for the axis domain. |
| max | number \| bigint |  | The max value for the axis domain. |
| preferredMin | number \| bigint |  | The min value for the axis, unless extended by the series data or `nice` option. |
| preferredMax | number \| bigint |  | The max value for the axis, unless extended by the series data or `nice` option. |

#### Unit Time Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'unit-time' |  | Axis type identifier. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| parentLevel | AgTimeAxisParentLevel |  | Options for labels and ticks for the parent level intervals. |
| parentLevel.enabled | boolean |  | Enables parent level labels and ticks. |
| parentLevel.label | AgCartesianTimeAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| parentLevel.label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| parentLevel.label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| parentLevel.label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| parentLevel.label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| parentLevel.label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| parentLevel.label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| parentLevel.label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| parentLevel.label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| parentLevel.label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| parentLevel.label.itemStyler | Styler |  | Function used to style axis labels. |
| parentLevel.label.fontStyle | FontStyle |  | The font style to use for the labels. |
| parentLevel.label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| parentLevel.label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| parentLevel.label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| parentLevel.label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| parentLevel.label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| parentLevel.label.border | BorderOptions |  | Stroke options for the box border. |
| parentLevel.label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| parentLevel.label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| parentLevel.label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| parentLevel.label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| parentLevel.label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| parentLevel.label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| parentLevel.label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| parentLevel.label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| parentLevel.label.format | string \| AgTimeAxisFormattableLabelUnitFormat |  | Format string used when rendering labels. A format string, or an object specifying a format per time unit. |
| parentLevel.tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| parentLevel.tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| parentLevel.tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| parentLevel.tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| parentLevel.tick.stroke | CssColor |  | The colour of the axis ticks. |
| unit | AgTimeInterval \| AgTimeIntervalUnit |  | The size of each band. A unit keyword (or number), or an object describing the interval. |
| interval | AgAxisDiscreteTimeIntervalOptions |  | Configuration for the axis ticks interval. |
| interval.placement | 'on' \| 'between' | 'between' | Placement of ticks and labels relative to the time interval. |
| interval.step | AgTimeInterval \| AgTimeIntervalUnit \| number |  | The axis interval. Expressed in the units of the axis. If the configured interval results in too many items given the chart size, it will be ignored. `bigint` steps are accepted but precision is limited to the Number range. |
| interval.maxSpacing | PixelSize |  | Maximum gap in pixels between items. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |
| paddingInner | Ratio |  | The size of the gap between the categories as a proportion, between 0 and 1. This value is a fraction of the “step”, which is the interval between the start of a band and the start of the next band. |
| paddingOuter | Ratio |  | The padding on the outside i.e. left and right of the first and last category. In association with `paddingInner`, this value can be between 0 and 1. |
| groupPaddingInner | Ratio |  | This property is for grouped column/bar series plotted on a category axis. It is a proportion between 0 and 1 which determines the size of the gap between the bars or columns within a single group along the axis. |
| bandHighlight | AgBandHighlightOptions |  | Configuration for the axis band highlight. |
| bandHighlight.enabled | boolean |  | Whether to show the band highlight. |
| bandHighlight.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| bandHighlight.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| bandHighlight.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| bandHighlight.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| bandHighlight.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| bandHighlight.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour to use for the fill of the band. A colour string, or an object for a gradient, pattern, or image fill. |
| bandHighlight.fillOpacity | Opacity |  | The opacity of the fill for the band. |
| bandAlignment | 'justify' \| 'start' \| 'center' \| 'end' | 'justify' | The alignment of bands when used with bar-like series with fixed widths. |
| skipNullBars | boolean | false | Set to `true` to prevent bars with `null`, `undefined` or missing values from taking up space in each category. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| maxThicknessRatio | Ratio | 0.3 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.format | TFormat |  | Format string used when rendering labels. |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgCartesianTimeAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| label.format | string \| AgTimeAxisFormattableLabelUnitFormat |  | Format string used when rendering labels. A format string, or an object specifying a format per time unit. |
| tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |
| min | Date \| number \| bigint \| string |  | The min value for the axis domain. |
| max | Date \| number \| bigint \| string |  | The max value for the axis domain. |
| preferredMin | Date \| number \| bigint \| string |  | The min value for the axis, unless extended by the series data or `nice` option. |
| preferredMax | Date \| number \| bigint \| string |  | The max value for the axis, unless extended by the series data or `nice` option. |

#### Ordinal Time Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'ordinal-time' |  | Axis type identifier. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| parentLevel | AgTimeAxisParentLevel |  | Options for labels and ticks for the parent level intervals. |
| parentLevel.enabled | boolean |  | Enables parent level labels and ticks. |
| parentLevel.label | AgCartesianTimeAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| parentLevel.label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| parentLevel.label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| parentLevel.label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| parentLevel.label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| parentLevel.label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| parentLevel.label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| parentLevel.label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| parentLevel.label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| parentLevel.label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| parentLevel.label.itemStyler | Styler |  | Function used to style axis labels. |
| parentLevel.label.fontStyle | FontStyle |  | The font style to use for the labels. |
| parentLevel.label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| parentLevel.label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| parentLevel.label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| parentLevel.label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| parentLevel.label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| parentLevel.label.border | BorderOptions |  | Stroke options for the box border. |
| parentLevel.label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| parentLevel.label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| parentLevel.label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| parentLevel.label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| parentLevel.label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| parentLevel.label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| parentLevel.label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| parentLevel.label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| parentLevel.label.format | string \| AgTimeAxisFormattableLabelUnitFormat |  | Format string used when rendering labels. A format string, or an object specifying a format per time unit. |
| parentLevel.tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| parentLevel.tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| parentLevel.tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| parentLevel.tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| parentLevel.tick.stroke | CssColor |  | The colour of the axis ticks. |
| interval | AgAxisDiscreteTimeIntervalOptions |  | Configuration for the axis ticks interval. |
| interval.placement | 'on' \| 'between' | 'between' | Placement of ticks and labels relative to the time interval. |
| interval.step | AgTimeInterval \| AgTimeIntervalUnit \| number |  | The axis interval. Expressed in the units of the axis. If the configured interval results in too many items given the chart size, it will be ignored. `bigint` steps are accepted but precision is limited to the Number range. |
| interval.maxSpacing | PixelSize |  | Maximum gap in pixels between items. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |
| paddingInner | Ratio |  | The size of the gap between the categories as a proportion, between 0 and 1. This value is a fraction of the “step”, which is the interval between the start of a band and the start of the next band. |
| paddingOuter | Ratio |  | The padding on the outside i.e. left and right of the first and last category. In association with `paddingInner`, this value can be between 0 and 1. |
| groupPaddingInner | Ratio |  | This property is for grouped column/bar series plotted on a category axis. It is a proportion between 0 and 1 which determines the size of the gap between the bars or columns within a single group along the axis. |
| bandHighlight | AgBandHighlightOptions |  | Configuration for the axis band highlight. |
| bandHighlight.enabled | boolean |  | Whether to show the band highlight. |
| bandHighlight.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| bandHighlight.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| bandHighlight.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| bandHighlight.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| bandHighlight.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| bandHighlight.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour to use for the fill of the band. A colour string, or an object for a gradient, pattern, or image fill. |
| bandHighlight.fillOpacity | Opacity |  | The opacity of the fill for the band. |
| bandAlignment | 'justify' \| 'start' \| 'center' \| 'end' | 'justify' | The alignment of bands when used with bar-like series with fixed widths. |
| skipNullBars | boolean | false | Set to `true` to prevent bars with `null`, `undefined` or missing values from taking up space in each category. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| maxThicknessRatio | Ratio | 0.3 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.format | TFormat |  | Format string used when rendering labels. |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgCartesianTimeAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| label.format | string \| AgTimeAxisFormattableLabelUnitFormat |  | Format string used when rendering labels. A format string, or an object specifying a format per time unit. |
| tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |

#### Time Axis

| Property | Type | Default | Description |
| --- | --- | --- | --- |
| type | 'time' |  | Axis type identifier. |
| parentLevel | AgTimeAxisParentLevel |  | Options for labels and ticks for the parent level intervals. |
| parentLevel.enabled | boolean |  | Enables parent level labels and ticks. |
| parentLevel.label | AgCartesianTimeAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| parentLevel.label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| parentLevel.label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| parentLevel.label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| parentLevel.label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| parentLevel.label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| parentLevel.label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| parentLevel.label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| parentLevel.label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| parentLevel.label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| parentLevel.label.itemStyler | Styler |  | Function used to style axis labels. |
| parentLevel.label.fontStyle | FontStyle |  | The font style to use for the labels. |
| parentLevel.label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| parentLevel.label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| parentLevel.label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| parentLevel.label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| parentLevel.label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| parentLevel.label.border | BorderOptions |  | Stroke options for the box border. |
| parentLevel.label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| parentLevel.label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| parentLevel.label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| parentLevel.label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| parentLevel.label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| parentLevel.label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| parentLevel.label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| parentLevel.label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| parentLevel.label.format | string \| AgTimeAxisFormattableLabelUnitFormat |  | Format string used when rendering labels. A format string, or an object specifying a format per time unit. |
| parentLevel.tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| parentLevel.tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| parentLevel.tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| parentLevel.tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| parentLevel.tick.stroke | CssColor |  | The colour of the axis ticks. |
| crossLines | Array<AgLineCrossLineOptions \| AgRangeCrossLineOptions> |  | Add cross-lines or regions corresponding to data values. |
| position | 'top' \| 'right' \| 'bottom' \| 'left' |  | The position on the chart where the axis should be rendered. |
| crossAt | AgCartesianAxisCrossAt |  | Value on the first perpendicular axis' domain where this axis should intersect. |
| crossAt.value (required) | number \| Date \| string \| string[] |  | The value on the perpendicular axis' domain where this axis should intersect. |
| crossAt.sticky | boolean | true | Whether the axis should remain visible when the cross position is outside the perpendicular axis domain. |
| thickness | PixelSize |  | Sets the axis thickness regardless of its content. |
| maxThicknessRatio | Ratio | 0.3 | The maximum thickness of the axis, as a ratio of the chart's width or height depending on axis direction. Used to prevent the axis from growing too large when labels or content are oversized. |
| title | AgCartesianAxisCaptionOptions |  | Configuration for the title shown next to the axis. |
| title.orientation | 'horizontal' \| 'vertical' \| 'vertical-reversed' |  | Orientation of the title.  Default: aligned with the axis line (`'horizontal'` on the x-axis, `'vertical'` on the y-axis). |
| title.enabled | boolean |  | Whether the title should be shown. |
| title.text | string |  | The text to show in the title. |
| title.fontStyle | FontStyle |  | The font style to use for the title. |
| title.fontWeight | FontWeight |  | The font weight to use for the title. |
| title.fontSize | FontSize |  | The font size in pixels to use for the title. |
| title.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the title. A single family name, or an array of names used as fallbacks. |
| title.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the title. A colour string, or a theme-colour reference object. |
| title.spacing | PixelSize |  | Spacing between the axis labels and the axis title. |
| title.maxWidth | PixelSize |  | Used to constrain the size of the title along the text direction before wrapping or truncation. |
| title.maxHeight | PixelSize |  | Used to constrain the size of the title across the text direction before wrapping or truncation. |
| title.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'always' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| title.truncate | boolean | true | Whether the title text should be automatically truncated to fit the available axis length. |
| title.formatter | RichFormatter |  | Formatter to allow dynamic axis title calculation. |
| crosshair | AgCrosshairOptions |  | Configuration for the axis crosshair. |
| crosshair.enabled | boolean |  | Whether to show the crosshair. |
| crosshair.snap | boolean |  | When true, the crosshair snaps to the highlighted data point. By default this property is true. |
| crosshair.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour of the stroke for the lines. A colour string, or a theme-colour reference object. |
| crosshair.strokeWidth | PixelSize |  | The width in pixels of the stroke for the lines. |
| crosshair.strokeOpacity | Opacity |  | The opacity of the stroke for the lines. |
| crosshair.lineDash | PixelSize[] |  | Defines how the line stroke is rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| crosshair.lineDashOffset | PixelSize |  | The initial offset of the dashed line in pixels. |
| crosshair.label | AgCrosshairLabel |  | The crosshair label configuration |
| crosshair.label.format | TFormat |  | Format string used when rendering labels. |
| crosshair.label.enabled | boolean |  | Whether to show label when the crosshair is visible. |
| crosshair.label.xOffset | PixelSize |  | The horizontal offset in pixels for the label. |
| crosshair.label.yOffset | PixelSize |  | The vertical offset in pixels for the label. |
| crosshair.label.formatter | Formatter |  | Function used to render crosshair labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| crosshair.label.renderer | Renderer |  | Function used to create the content for the label. |
| context | ContextDefault |  | Context object to use in callbacks. |
| reverse | boolean |  | Reverse the axis scale domain if `true`. |
| line | AgAxisLineOptions |  | Configuration for the axis line. |
| line.enabled | boolean |  | Set to `false` to hide the axis line. |
| line.width | PixelSize |  | The width in pixels of the axis line. |
| line.stroke | CssColor |  | The colour of the axis line. |
| gridLine | AgAxisGridLineOptions |  | Configuration for the axis grid lines. |
| gridLine.enabled | boolean |  | Set to `false` to hide the axis grid lines. |
| gridLine.width | PixelSize |  | The width in pixels of the axis grid lines. |
| gridLine.style | AgAxisGridStyle[] |  | Configuration of the lines used to form the grid in the chart series area. |
| gridLine.style.fill | CssColor |  | The colour of the fill between grid lines. |
| gridLine.style.fillOpacity | Ratio |  | The opacity of the fill between grid lines. |
| gridLine.style.stroke | CssColor |  | The colour of the grid line. |
| gridLine.style.strokeWidth | PixelSize |  | The width of the grid line in pixels. |
| gridLine.style.lineDash | PixelSize[] |  | Defines how the grid lines are rendered. Every number in the array specifies the length in pixels of alternating dashes and gaps. For example, `[6, 3]` means dashes with a length of `6` pixels with gaps between of `3` pixels. |
| label | AgCartesianTimeAxisLabelOptions |  | Configuration for the axis labels, shown next to the ticks. |
| label.autoRotate | boolean |  | If specified and axis labels may collide, they are rotated so that they are positioned at the supplied angle. This is enabled by default for category. If the `rotation` property is specified, it takes precedence. |
| label.autoRotateAngle | Degree |  | If autoRotate is enabled, specifies the rotation angle to use when autoRotate is activated. Defaults to an angle of 335 degrees if unspecified. |
| label.wrapping | 'never' \| 'always' \| 'hyphenate' \| 'on-space' | 'on-space' | Text wrapping strategy for long text. - `'always'` will always wrap text to fit within the `maxWidth`. - `'hyphenate'` is similar to `'always'`, but inserts a hyphen (`-`) if forced to wrap in the middle of a word. - `'on-space'` will only wrap on white space. If there is no possibility to wrap a line on space and satisfy the `maxWidth`, the text will be truncated. - `'never'` disables text wrapping. |
| label.truncate | boolean |  | If truncate is enabled, the text will be truncated to fit available space and an ellipsis (`...`) will be added at the end of the text. |
| label.enabled | boolean |  | Set to `false` to hide the axis labels. |
| label.rotation | Degree |  | The rotation of the axis labels in degrees. Note: for integrated charts the default is 335 degrees, unless the axis shows grouped or default categories (indexes). The first row of labels in a grouped category axis is rotated perpendicular to the axis line. |
| label.avoidCollisions | boolean |  | Avoid axis label collision by automatically reducing the number of ticks displayed. If set to `false`, axis labels may collide. |
| label.minSpacing | PixelSize |  | Minimum gap in pixels between the axis labels before being removed to avoid collisions. |
| label.formatter | RichFormatter |  | Function used to render axis labels. If `value` is a number, `fractionDigits` will also be provided, which indicates the number of fractional digits used in the step between ticks; for example, a tick step of `0.0005` would have `fractionDigits` set to `4` |
| label.itemStyler | Styler |  | Function used to style axis labels. |
| label.fontStyle | FontStyle |  | The font style to use for the labels. |
| label.fontWeight | FontWeight |  | The font weight to use for the labels. |
| label.fontSize | FontSize |  | The font size in pixels to use for the labels. |
| label.fontFamily | FontFamily \| GoogleFontFamily \| Array<FontFamily \| GoogleFontFamily> |  | The font family to use for the labels. A single family name, or an array of names used as fallbacks. |
| label.spacing | PixelSize |  | Spacing in pixels between the axis label and the tick. |
| label.color | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour to use for the labels. A colour string, or a theme-colour reference object. |
| label.border | BorderOptions |  | Stroke options for the box border. |
| label.border.enabled | boolean |  | Whether the associated elements and properties should be used in the chart. |
| label.border.stroke | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor |  | The colour for the stroke. |
| label.border.strokeWidth | PixelSize |  | The width of the stroke in pixels. |
| label.border.strokeOpacity | Opacity |  | The opacity of the stroke colour. |
| label.cornerRadius | PixelSize |  | Apply rounded corners to the label box. |
| label.padding | PixelSize \| PaddingOptions |  | Distance between the label text and the border. A number applies uniform padding; an object sets each side. |
| label.fill | CssColor \| AgColorRef \| AgColorRefMixOnto \| AgColorRefMixOntoColor \| AgGradientColor \| AgPatternColor \| AgImageFill |  | The colour for filling shapes. A colour string, or an object for a gradient, pattern, or image fill. |
| label.fillOpacity | Opacity |  | The opacity of the fill colour. |
| label.format | string \| AgTimeAxisFormattableLabelUnitFormat |  | Format string used when rendering labels. A format string, or an object specifying a format per time unit. |
| tick | AgAxisBaseTickOptions |  | Configuration for the axis ticks. |
| tick.enabled | boolean |  | Set to `false` to hide the axis ticks. |
| tick.width | PixelSize |  | The width in pixels of the axis ticks. |
| tick.size | PixelSize |  | The length in pixels of the axis ticks. |
| tick.stroke | CssColor |  | The colour of the axis ticks. |
| nice | boolean |  | If `true`, the range will be rounded up to ensure nice equal spacing between the ticks.  __Note:__ This does not override the `min` or `max` options. |
| interval | AgAxisContinuousIntervalOptions |  | Configuration for the axis ticks interval. A unit keyword (or number), or an object describing the interval. |
| interval.step | AgTimeInterval \| AgTimeIntervalUnit \| number |  | The axis interval. Expressed in the units of the axis. If the configured interval results in too many items given the chart size, it will be ignored. `bigint` steps are accepted but precision is limited to the Number range. |
| interval.maxSpacing | PixelSize |  | Maximum gap in pixels between items. |
| interval.values | any[] |  | Array of values in axis units for specified intervals along the axis. The values in this array must be compatible with the axis type. |
| interval.minSpacing | PixelSize |  | Minimum gap in pixels between intervals. |
| min | Date \| number \| bigint \| string |  | The min value for the axis domain. |
| max | Date \| number \| bigint \| string |  | The max value for the axis domain. |
| preferredMin | Date \| number \| bigint \| string |  | The min value for the axis, unless extended by the series data or `nice` option. |
| preferredMax | Date \| number \| bigint \| string |  | The max value for the axis, unless extended by the series data or `nice` option. |