@progress/kendo-react-charts
Version:
React Chart renders a wide range of high-quality data visualizations. KendoReact Charts package
96 lines (95 loc) • 4.53 kB
TypeScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2026 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { drawing } from '@progress/kendo-drawing';
import { AxisLabelVisualArgs, Border, DateFormats, LabelRotation, Margin, Padding } from '../../common/property-types.js';
/**
* @hidden
*/
export interface YAxisLabels {
/**
* The background color of the labels. Accepts a valid CSS color string, including hex and rgb.
*/
background?: string;
/**
* The border of the labels.
*/
border?: Border;
/**
* The text color of the labels. Accepts a valid CSS color string, including hex and rgb.
*/
color?: string;
/**
* The function which returns the label content. The function argument contains a `value` field. It defines the axis value. You can split the text into multiple lines by using the line feed characters (`"\n"`).
*
* The available fields in the function argument are:
* - `value`—The category value.
* - `format`—The default format of the label.
* - `text`—The default label text.
* - `index`—The index of the label.
* - `count`—The total number of rendered labels.
*/
content?: (e: any) => string;
/**
* The culture to use when formatting date values. The specified culture must be loaded as demonstrated in the [Internationalization Overview](https://www.telerik.com/kendo-react-ui/components/intl/i18n).
*/
culture?: string;
/**
* The format for displaying the labels when the X values are dates. Uses the [`format`](https://www.telerik.com/kendo-react-ui/components/intl/api/intlservice#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the category value. The Chart selects the appropriate format for the current [`yAxis.baseUnit`](https://www.telerik.com/kendo-react-ui/components/charts/api/chartyaxisitemprops#toc-baseunit). Setting the [`categoryAxis.labels.format`](https://www.telerik.com/kendo-react-ui/components/charts/api/chartcategoryaxislabelsprops#toc-format) option overrides the date formats.
*/
dateFormats?: DateFormats;
/**
* The font style of the labels.
*/
font?: string;
/**
* The format for displaying the labels. Uses the [`format`](https://www.telerik.com/kendo-react-ui/components/intl/api/intlservice#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the category value.
*/
format?: string;
/**
* The margin of the labels. A numeric value sets all margins.
*/
margin?: Margin | number;
/**
* If set to `true`, the Chart mirrors the axis labels and ticks. If the labels are normally on the left side of the axis, the mirroring of the axis renders them to the right.
*/
mirror?: boolean;
/**
* The padding of the labels. A numeric value sets all paddings.
*/
padding?: Padding | number;
/**
* The rotation angle of the labels. By default, the labels are not rotated.
*/
rotation?: LabelRotation | number | 'auto';
/**
* The number of labels to skip.
*/
skip?: number;
/**
* The label rendering step—renders every `n`<sup>th</sup> label. By default, every label is rendered.
*/
step?: number;
/**
* If set to `true`, the Chart displays the Y-axis labels. By default, the Y-axis labels are visible.
*/
visible?: boolean;
/**
* A function that can be used to create a custom visual for the labels.
*
* The available argument fields are:
* - `createVisual`—A function that can be used to get the default visual.
* - `culture`—The default culture (if set) on the label.
* - `format`—The default format of the label.
* - `options`—The label options.
* - `rect`—The geometry [`Rect`](https://www.telerik.com/kendo-react-ui/components/drawing/api/geometry/rect) that defines where the visual has to be rendered.
* - `sender`—The Chart instance (might be `undefined`).
* - `text`—The label text.
* - `value`—The category value.
*/
visual?: (e: AxisLabelVisualArgs) => drawing.Element;
}