/** * @license *------------------------------------------------------------------------------------------- * Copyright © 2025 Progress Software Corporation. All rights reserved. * Licensed under commercial license. See LICENSE.md in the package root for more information *------------------------------------------------------------------------------------------- */ import { Align } from '@progress/kendo-react-popup'; import { BaseEvent as BaseEvent_2 } from '@progress/kendo-react-common'; import { BreadcrumbProps } from '@progress/kendo-react-layout'; import { ChartContextType } from '../../ChartContext'; import { ChartContextType as ChartContextType_3 } from './ChartContext'; import { ChartContextType as ChartContextType_4 } from '../ChartContext'; import { createSankeyData as createSankeyData_2 } from '@progress/kendo-charts'; import { CrosshatchPattern } from '@progress/kendo-charts'; import { DataModel } from '@progress/kendo-react-layout'; import { DiagonalStripesPattern } from '@progress/kendo-charts'; import { DotsPattern } from '@progress/kendo-charts'; import { drawing } from '@progress/kendo-drawing'; import { Element as Element_2 } from '@progress/kendo-drawing'; import { FocusHighlight } from '@progress/kendo-charts'; import { FocusHighlightBorder } from '@progress/kendo-charts'; import { geometry } from '@progress/kendo-drawing'; import { GridPattern } from '@progress/kendo-charts'; import { Group } from '@progress/kendo-drawing'; import { InstanceObserver } from '@progress/kendo-charts'; import { JSX } from 'react/jsx-runtime'; import { MultiPath } from '@progress/kendo-drawing'; import { Offset } from '@progress/kendo-react-popup'; import * as React_2 from 'react'; import { SankeyData } from '@progress/kendo-charts'; import { SankeyEvent as SankeyEvent_2 } from '@progress/kendo-charts'; import { SankeyExportVisualOptions } from '@progress/kendo-charts'; import { SankeyLabel } from '@progress/kendo-charts'; import { SankeyLabelDefaults } from '@progress/kendo-charts'; import { SankeyLegendItem } from '@progress/kendo-charts'; import { SankeyLink } from '@progress/kendo-charts'; import { SankeyLinkDataItem } from '@progress/kendo-charts'; import { SankeyLinkDefaults } from '@progress/kendo-charts'; import { SankeyLinkHighlight } from '@progress/kendo-charts'; import { SankeyNode } from '@progress/kendo-charts'; import { SankeyNodeDataItem } from '@progress/kendo-charts'; import { SankeyNodeDefaults } from '@progress/kendo-charts'; import { SankeyOptions } from '@progress/kendo-charts'; import { SankeyTooltip as SankeyTooltip_2 } from '@progress/kendo-charts'; import { SankeyTooltipEvent } from '@progress/kendo-charts'; import { SeriesPattern } from '@progress/kendo-charts'; import { Store as Store_2 } from '../../store/store'; import { Store as Store_3 } from './../../store/store'; import { Surface } from '@progress/kendo-drawing'; import { VerticalStripesPattern } from '@progress/kendo-charts'; /** * The provided time-interval steps when `baseUnit` is set to either `"fit"` or `"auto"`. * The axis will try to divide the active period into the smallest possible units * that yield `maxDateGroups` or less discrete intervals. */ export declare interface AutoBaseUnitSteps { /** * The preferred interval steps when displaying milliseconds. */ milliseconds?: number[]; /** * The preferred interval steps when displaying seconds. */ seconds?: number[]; /** * The preferred interval steps when displaying minutes. */ minutes?: number[]; /** * The preferred interval steps when displaying hours. */ hours?: number[]; /** * The preferred interval steps when displaying days. */ days?: number[]; /** * The preferred interval steps when displaying weeks. */ weeks?: number[]; /** * The preferred interval steps when displaying months. */ months?: number[]; /** * The preferred interval steps when displaying years. */ years?: number[]; } /** * @hidden */ declare interface AxisCrosshairTooltip { /** * The background color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border options of the tooltip. */ border?: TooltipBorder; /** * The text color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font of the tooltip. */ font?: string; /** * The format for displaying the tooltip. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the value. */ format?: string; /** * The padding of the crosshair tooltip. A numeric value sets all paddings. */ padding?: Padding | number; /** * If set to `true`, the Chart displays the axis crosshair tooltip. By default, the axis crosshair tooltip is not visible. */ visible?: boolean; } /** * @hidden */ export declare interface AxisDefaults { /** * The background color of the axis. */ background?: string; /** * The color to apply to all axis elements. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The configuration of the axis lines. Also affects the major and minor ticks, but not the grid lines. */ line?: AxisLine; /** * The configuration of the major grid lines. These are the lines that are an extension of the major ticks through the body of the Chart. */ majorGridLines?: GridLines; /** * The configuration of the axis major ticks. */ majorTicks?: AxisTicks; /** * The configuration of the minor grid lines. These are the lines that are an extension of the minor ticks through the body of the Chart. */ minorGridLines?: GridLines; /** * The configuration of the axis minor ticks. */ minorTicks?: AxisTicks; /** * If set to `true`, the Chart prevents the axis range from snapping to zero. Setting it to `false`, forces the axis range to snap to zero. */ narrowRange?: boolean; /** * The name of the pane in which the axis has to be rendered. If not set, the axis will be rendered in the first (default) pane. */ pane?: string; /** * The plot bands of the axis. */ plotBands?: PlotBand[]; /** * If set to `true`, the axis direction is reversed. By default, categories are listed from left to right and from bottom to top. */ reverse?: boolean; /** * The angle (degrees) of the first category on the axis. Angles increase clockwise with zero to the left. Negative values are acceptable. */ startAngle?: number; /** * If set to `true`, the Chart displays the axis. By default, the axis is visible. */ visible?: boolean; /** * The crosshair configuration options. The crosshair is displayed when the [`axisDefaults.crosshair.visible`]({% slug api_charts_chartaxisdefaultscrosshairprops %}#toc-visible) option is set to `true`. */ crosshair?: AxisDefaultsCrosshair; /** * The configuration of the axis labels. */ labels?: AxisDefaultsLabels; /** * The title configuration of the axis. To display the title, set the [`axisDefaults.title.text`]({% slug api_charts_chartaxisdefaultstitleprops %}#toc-text) option. */ title?: AxisDefaultsTitle; } /** * @hidden */ export declare interface AxisDefaultsCrosshair { /** * The color of the crosshair. Accepts a valid CSS color string, including `hex` and `rgb`. */ color?: string; /** * The dash type of the crosshair. * * The following dash types are supported: * * - `"dash"`—A line which consists of dashes. * - `"dashDot"`—A line which consists of a repeating pattern of dash-dot. * - `"dot"`—A line which consists of dots. * - `"longDash"`—A line which consists of a repeating pattern of long-dash. * - `"longDashDot"`—A line which consists of a repeating pattern of long-dash-dot. * - `"longDashDotDot"`—A line which consists of a repeating pattern of long-dash-dot-dot. * - `"solid"`—A solid line. */ dashType?: DashType; /** * The opacity of the crosshair. By default, the crosshair is opaque. */ opacity?: number; /** * If set to `true`, the Chart displays the axis crosshair. By default, the axis crosshair is not visible. */ visible?: boolean; /** * The width of the crosshair in pixels. */ width?: number; /** * The options of the crosshair tooltip. The crosshair tooltip is displayed when the [`axisDefaults.crosshair.tooltip.visible`]({% slug api_charts_chartaxisdefaultscrosshairtooltipprops %}#toc-visible) option is set to `true`. */ tooltip?: AxisDefaultsCrosshairTooltip; } /** * @hidden */ export declare interface AxisDefaultsCrosshairTooltip extends AxisCrosshairTooltip { } /** * @hidden */ export declare interface AxisDefaultsLabels { /** * The function which returns the label content. The text can be split into multiple lines by using the line feed characters (`"\n"`). * * The available fields in the function argument are: * * - `value`—The category value. * - `dataItem`—The data item if a field i specified. If the category does not have a corresponding item in the data, an empty object is passed. * - `format`—The default format of the label. * - `culture`—The default culture (if set) of the label. */ content?: (e: any) => string; /** * The font style of the labels. */ font?: string; /** * The format for displaying the labels. Uses the [`format`]({% slug api_intl_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 ([see example]({% slug axes_chart_charts %}#toc-limiting-the-number-of-labels)). By default, the labels are not rotated. If the axis is horizontal, can be set to `"auto"`. In this case, the labels are rotated only if the slot size is not sufficient for the entire labels. */ rotation?: LabelRotation | number | 'auto'; /** * The number of labels to skip. By default, no labels are skipped. */ skip?: number; /** * The label-rendering step—renders every nth label. By default, every label is rendered. */ step?: number; /** * If set to `true`, the Chart displays the axis labels. By default, the axis labels are visible. */ visible?: boolean; /** * A function that for creating a custom visual for the labels. * * The available argument fields are: * - `createVisual`—A function for getting the default visual. * - `culture`—The default culture (if set) of the label. * - `dataItem`—The data item if a field has been specified. * - `format`—The default format of the label. * - `options`—The label options. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (can be `undefined`). * - `text`—The label text. * - `value`—The category value. */ visual?: (e: AxisLabelVisualArgs) => drawing.Element; } /** * @hidden */ export declare interface AxisDefaultsTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the title. * * The supported values are: * * - `"top"`—The axis title is positioned on the top (applicable for the vertical axis). * - `"bottom"`—The axis title is positioned on the bottom (applicable for the vertical axis). * - `"left"`—The axis title is positioned on the left (applicable for the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable for the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: AxisTitlePosition; /** * The rotation angle of the title. By default, the title is not rotated. */ rotation?: number; /** * The text of the title. The text can be split into multiple lines by using the line feed characters (`"\n"`). */ text?: string; /** * If set to `true`, the Chart displays the axis title. By default, the axis title is visible. */ visible?: boolean; /** * A function that can be used to create a custom visual for the title. * * The available argument fields are: * * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (can be `undefined`). * - `options`—The label options. * - `createVisual`—A function for getting the default visual. */ visual?: (e: TitleVisualArgs) => drawing.Element; } /** * Arguments for the `axisLabelClick` event. */ export declare class AxisLabelClickEvent extends BaseEvent { /** * The axis options to which the label belongs. */ axis: EventAxisOptions; /** * The original data item that is used to generate the label. Available only for category axes which are populated from the `categoryField` of the series. */ dataItem: any; /** * The label sequential or category index. */ index: number; /** * The label text. */ text: string; /** * The label value or category name. */ value: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * The position of the axis labels. * * @example * ```jsx * import { Chart, ChartValueAxis, ChartValueAxisItem } from '@progress/kendo-react-charts'; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type AxisLabelsPosition = 'start' | 'end' | 'onAxis' | ''; /** * The context for the visual function of the axis label. */ export declare interface AxisLabelVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The default culture (if set) of the label. */ culture: string; /** * If a field is specified, represents the data item. */ dataItem?: any; /** * The default format of the label. */ format: string; /** * The label options. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The text of the label. */ text: string; /** * The value of the label. */ value: any; } /** * The appearance settings for the axis lines. Affects the major and minor axis ticks, but not the grid lines (see the [basic usage example]({% slug api_charts_chartaxisdefaults %})). */ export declare interface AxisLine { /** * The color of the lines. Accepts a valid CSS color string, including hex and rgb. Setting the `color` option affects the major and minor axis ticks, but not the grid lines. */ color?: string; /** * The dash type of the line. */ dashType?: DashType; /** * If set to `true`, the Chart displays the axis lines. By default, the axis lines are visible. */ visible?: boolean; /** * The width of the line in pixels. Affects the major and minor axis ticks, but not the grid lines. */ width?: number; } /** * The context for the point highlight visual function. */ export declare interface AxisNoteVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The options of the note. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The value of the note. */ value: string; } /** * The axis range. */ export declare interface AxisRange { /** * The axis minimum value. */ min: number | Date; /** * The axis maximum value. */ max: number | Date; } /** * The appearance configuration for the major and minor axis ticks (see the [basic usage example]({% slug api_charts_chartaxisdefaults %})). */ export declare interface AxisTicks { /** * The color of the tick lines. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The length of the tick line in pixels. */ size?: number; /** * The number of ticks to skip at the beginning. */ skip?: number; /** * The tick-rendering step. Renders every nth tick, where `n` is the step. */ step?: number; /** * If set to `true,` the Chart displays the axis ticks. By default, only the major axis ticks are visible. */ visible?: boolean; /** * The width of the ticks in pixels. */ width?: number; } /** * The position of an axis title. * * @example * ```jsx * import { Chart, ChartValueAxis, ChartValueAxisItem } from '@progress/kendo-react-charts'; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type AxisTitlePosition = 'top' | 'bottom' | 'left' | 'right' | 'center'; /** * @hidden */ declare interface BaseChartProps { /** * Represents the `dir` HTML attribute. */ dir?: string; /** * The styles that are applied to the component. */ style?: React.CSSProperties; /** * Sets additional CSS classes to the component. */ className?: string; /** * @hidden */ children?: any; /** * Gets or sets the current drill-down state for [Drilldown Charts](slug:drilldown_charts). * * To return to a previous level, remove the items from the `steps` array following the desired level. * To return to the root chart, set the `steps` array to `[]`. */ drilldownState?: ChartDrilldownState; /** * Sets the preferred rendering engine ([see example]({% slug rendering_chart_charts %})). If not supported by the browser, the Chart switches to the first available mode. * * The supported values are: * - `"svg"`—If available, renders the component as an inline `.svg` file. * - `"canvas"`—If available, renders the component as a `canvas` element. */ renderAs?: 'svg' | 'canvas'; /** * Specifies if the Chart can be panned ([see example]({% slug panzoom_chart_charts %})). */ pannable?: boolean | DragAction; /** * Specifies if the Chart can be zoomed ([see example]({% slug panzoom_chart_charts %})). Currently is only applicable to linear types, where the range on the X axis can be changed based on the zoom level. */ zoomable?: boolean | Zoomable; /** * The default colors for the Chart series. When all colors are used, new colors are pulled from the start again. */ seriesColors?: string[]; /** * If set to `true`, the Chart plays animations when it displays the series. By default, animations are enabled. */ transitions?: boolean; /** * This option allows to override the default pane options. */ paneDefaults?: PaneDefaults; /** * The chart panes configuration. */ panes?: Pane[]; /** * This option allows to override the default series options. */ seriesDefaults?: SeriesDefaults; /** * This option allows to override the default axis options. */ axisDefaults?: AxisDefaults; /** * Fires when the user clicks an axis label. */ onAxisLabelClick?: (event: AxisLabelClickEvent) => void; /** * Fires as long as the user is dragging the Chart with the mouse or through swipe gestures. */ onDrag?: (event: DragEvent_2) => void; /** * Fires when the user stops dragging the Chart. */ onDragEnd?: (event: DragEndEvent) => void; /** * Fires when the user starts dragging the Chart. */ onDragStart?: (event: DragStartEvent) => void; /** * Fires when the user when the user wants to drill down on a specific point. */ onDrilldown?: (event: DrilldownEvent) => void; /** * Fires when the user hovers over a legend item. */ onLegendItemHover?: (event: LegendItemHoverEvent) => void; /** * Fires when the user clicks a legend item ([see example]({% slug legend_chart_charts %}#toc-clicking-legend-items)). */ onLegendItemClick?: (event: LegendItemClickEvent) => void; /** * Fires when the user clicks a note. */ onNoteClick?: (event: NoteClickEvent) => void; /** * Fires when the user hovers over a note. */ onNoteHover?: (event: NoteHoverEvent) => void; /** * Fires when the user clicks the plot area. The `click` event is triggered by the `tap` and `contextmenu` events. To distinguish between the original events, inspect the `e.originalEvent.type` field. */ onPlotAreaClick?: (event: PlotAreaClickEvent) => void; /** * Fires when the user hovers the plot area ([see example]({% slug crosshairs_chart_charts %}#toc-current-cursor-values)). */ onPlotAreaHover?: (event: PlotAreaHoverEvent) => void; /** * Fires when the Chart is ready to render on screen ([see example]({% slug plotbands_chart_charts %}#toc-custom-plot-bands)). For example, you can use it to remove loading indicators. Any changes made to the options are ignored. */ onRender?: (event: RenderEvent) => void; /** * Fires when the Chart is about to refresh. The event can be used to prevent the refresh of the Chart in specific cases ([see example]({% slug refresh_chart %}). */ onRefresh?: (chartOptions: any, themeOptions: any, chartInstance: any) => void; /** * Fires when the user modifies the selection. * * The range units are: * - Generic axis—Category index (0-based). * - Date axis—Date instance. */ onSelect?: (event: SelectEvent) => void; /** * Fires when the user completes the modification of the selection ([see example]({% slug selection_chart_charts %}#toc-using-selection-as-navigator)). * * The range units are: * - Generic axis—Category index (0-based). * - Date axis—Date instance. */ onSelectEnd?: (event: SelectEndEvent) => void; /** * Fires when the user starts modifying the axis selection. * * The range units are: * - Generic axis—Category index (0-based). * - Date axis—Date instance. */ onSelectStart?: (event: SelectStartEvent) => void; /** * Fires when the user clicks the Chart series. * * The `click` event will be triggered by the `tap` and `contextmenu` events. To distinguish between the original events, inspect the `e.originalEvent.type` field. */ onSeriesClick?: (event: SeriesClickEvent) => void; /** * Fires when the user hovers over the Chart series. */ onSeriesHover?: (event: SeriesHoverEvent) => void; /** * Fires as long as the user is zooming the Chart by using the mousewheel operation. */ onZoom?: (event: ZoomEvent) => void; /** * Fires when the user stops zooming the Chart. */ onZoomEnd?: (event: ZoomEndEvent) => void; /** * Fires when the user uses the mousewheel to zoom the Chart. */ onZoomStart?: (event: ZoomStartEvent) => void; } /** * @hidden */ declare abstract class BaseEvent { /** * The `Chart` component that triggered the event. */ target: Charts; /** * @hidden */ constructor(target: Charts); } /** * The `baseUnit` type of an X or Y axis. * * @example * ```jsx * import { * Chart, * ChartXAxis, * ChartXAxisItem, * ChartSeries, * ChartSeriesItem * } from '@progress/kendo-react-charts'; * * const baseUnit = "months"; * const data = [[new Date(2000, 0, 1), 1], [new Date(2001, 0, 1), 1]]; * * const ChartContainer = () => ( * * * * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type BaseUnit = 'milliseconds' | 'seconds' | 'minutes' | 'hours' | 'days' | 'weeks' | 'months' | 'years'; /** * The appearance settings for the border lines (see the [basic usage example]({% slug api_charts_charttitle %})). */ export declare interface Border { /** * The color of the border line. Accepts a valid CSS color string, including HEX and RGB. */ color?: string; /** * The dash type of the border line. */ dashType?: DashType; /** * The opacity of the border. By default the border is opaque. * * @default 1 */ opacity?: number | string; /** * The width of the border line in pixels. */ width?: number; } /** * The appearance settings for the target of the Bullet series. */ export declare interface BulletTarget { /** * The width of the border in pixels. By default, the border width is set to `zero`, which means that the border is not visible. */ border?: Border; /** * The target color. */ color?: string; /** * The appearance settings for the target line of the Bullet series. */ line?: BulletTargetLine; } /** * The appearance settings for the target line of the Bullet series. */ export declare interface BulletTargetLine { /** * The width of the Bullet target line in pixels. */ width?: number; } /** * @hidden */ export declare interface CategoryAxis { /** * The time-interval steps when `baseUnit` is set either to `"fit"` or `"auto"`. The axis will try to divide the active period into the smallest possible units that yield `maxDateGroups` or less discrete intervals. */ autoBaseUnitSteps?: AutoBaseUnitSteps; /** * The category index or the date (for date category axis) at which the first value axis crosses this axis. The category indices or the date (for date category axis) at which the value axes cross the category axis (when set as an array). To denote the far end of the axis, set an index greater than or equal to the number of categories. */ axisCrossingValue?: any | any[]; /** * The background color of the axis. */ background?: string; /** * The base time interval for the date axis ([see example]({% slug axes_chart_charts %}#toc-selecting-time-intervals)). The default base unit is automatically determined by the minimum difference between subsequent categories. * * The supported values are: * - `"fit"` * - `"milliseconds"` * - `"seconds"` * - `"minutes"` * - `"hours"` * - `"days"` * - `"weeks"` * - `"months"` * - `"years"` * * Setting `baseUnit` to `"fit"` sets such a base unit and [`categoryAxis.baseUnitStep`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-baseunitstep) that the total number of categories does not exceed [`categoryAxis.maxDateGroups`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-maxdategroups). * * Series data is aggregated for the specified base unit by using the [`series.aggregate`]({% slug api_charts_chartseriesitemprops %}#toc-aggregate) function. */ baseUnit?: CategoryBaseUnit; /** * The step (interval) between the categories in base units ([see example]({% slug axes_chart_charts %}#toc-selecting-time-intervals)). Setting it to `"auto"` sets the step to such a value that the total number of categories does not exceed [`categoryAxis.maxDateGroups`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-maxdategroups). The option is ignored if [`categoryAxis.baseUnit`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-baseunit) is set to `"fit"`. */ baseUnitStep?: number | 'auto'; /** * The category names. The Chart creates a category for every item of the array. */ categories?: any[]; /** * The color to apply to all axis elements. Accepts a valid CSS color string, including hex and rgb. Can be overridden by [`categoryAxis.labels.color`]({% slug api_charts_chartcategoryaxislabelsprops %}#toc-color) and [`categoryAxis.line.color`]({% slug api_charts_axisline %}#toc-color). */ color?: string; /** * If set to `true`, the Chart positions categories and series points on major ticks. This removes the empty space before and after the series. The default value is `false` except for `"area"`, `"verticalArea"`, `"rangeArea"`, and `"verticalRangeArea"`. The option is ignored if the [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) option is set to `"bar"`, `"column"`, `"boxPlot"`, `"ohlc"`, `"candlestick"`, or `"waterfall"`. */ justified?: boolean; /** * The configuration of the axis lines. Also affects the major and minor ticks, but not the grid lines. */ line?: AxisLine; /** * The configuration of the major grid lines. These are the lines that are an extension of the major ticks through the body of the Chart. */ majorGridLines?: GridLines; /** * The configuration of the category axis major ticks. */ majorTicks?: AxisTicks; /** * The last date displayed on a date category axis or the index of the last category displayed on a category axis ([see example]({% slug appearance_chart_charts %}#toc-limiting-the-displayed-range)). By default, the max value is the same as the last category. This is often used in combination with the [`categoryAxis.min`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-min) and [`categoryAxis.roundToBaseUnit`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-roundtobaseunit) options to set up a fixed date range. */ max?: any; /** * The maximum number of groups (categories) to display when [`categoryAxis.baseUnit`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-baseunit) is set to `"fit"` or [`categoryAxis.baseUnitStep`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-baseunitstep) is set to `"auto"`([see example]({% slug axes_chart_charts %}#toc-selecting-time-intervals)). */ maxDateGroups?: number; /** * The maximum number of ticks and labels to display. Applicabable for date category axis ([see example]({% slug axes_chart_charts %}#toc-limiting-the-number-of-labels)). */ maxDivisions?: number; /** * The first date which is displayed on a date category axis or the index of the first category which is displayed on a category axis ([see example]({% slug appearance_chart_charts %}#toc-limiting-the-displayed-range)). By default, the min value is the same as the first category. This is often used in combination with the [`categoryAxis.max`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-max) and [`categoryAxis.roundToBaseUnit`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-roundtobaseunit) options to set up a fixed date range. */ min?: any; /** * The configuration of the minor grid lines. These are the lines that are an extension of the minor ticks through the body of the Chart. */ minorGridLines?: GridLines; /** * The configuration of the category axis minor ticks. */ minorTicks?: AxisTicks; /** * The unique axis name. Used to associate a series with a category axis, which utilizes the [`series.categoryAxis`]({% slug api_charts_chartseriesitemprops %}#toc-categoryaxis) option. */ name?: string; /** * The configuration of the date axis date range labels. */ rangeLabels?: CategoryAxisRangeLabels; /** * The name of the pane in which the category axis has to be rendered. If not set, the axis will be rendered in the first (default) pane. */ pane?: string; /** * The plot bands of the category axis. */ plotBands?: PlotBand[]; /** * If set to `true`, the category axis direction is reversed. By default, categories are listed from left to right and from bottom to top. */ reverse?: boolean; /** * If set to `true`, the Chart rounds the first and last date to the nearest base unit. */ roundToBaseUnit?: boolean; /** * The angle (degrees) of the first category on the axis. Angles increase clockwise with zero to the left. Negative values are acceptable. */ startAngle?: number; /** * The category axis type. * * The supported values are: * - `"category"`—Discrete category axis. * - `"date"`—Specialized axis for displaying chronological data. */ type?: 'category' | 'date'; /** * If set to `true`, the Chart displays the category axis. By default, the category axis is visible. */ visible?: boolean; /** * The week start day when the `baseUnit` is set to `"weeks"`. */ weekStartDay?: WeekStartDay; /** * The configuration options of the crosshair. The crosshair is displayed when the [`categoryAxis.crosshair.visible`]({% slug api_charts_chartcategoryaxiscrosshairprops %}#toc-visible) option is set to `true`. */ crosshair?: CategoryAxisCrosshair; /** * The configuration of the axis labels. */ labels?: CategoryAxisLabels; /** * The configuration of the category axis notes. */ notes?: CategoryAxisNotes; /** * The selected axis range ([see example]({% slug selection_chart_charts %})). If set, the axis selection is enabled. The range is index-based, starting from zero. Categories with indexes in the range (`select.from`, `select.to`) will be selected. That is, the last category in the range will not be included in the selection. If the categories are dates, the range has to be also specified with date values. Selection is only supported if the axis is horizontal.v */ select?: CategoryAxisSelect; /** * The title configuration of the category axis. To display the title, set the [`categoryAxis.title.text`]({% slug api_charts_chartcategoryaxistitleprops %}#toc-text) option. */ title?: CategoryAxisTitle; } /** * @hidden */ export declare interface CategoryAxisCrosshair { /** * The color of the crosshair. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The dash type of the crosshair. * * The following dash types are supported: * - `"dash"`—A line consisting of dashes. * - `"dashDot"`—A line consisting of a repeating pattern of dash-dot. * - `"dot"`—A line consisting of dots. * - `"longDash"`—A line consisting of a repeating pattern of long-dash. * - `"longDashDot"`—A line consisting of a repeating pattern of long-dash-dot. * - `"longDashDotDot"`—A line consisting of a repeating pattern of long-dash-dot-dot. * - `"solid"`—A solid line. */ dashType?: DashType; /** * The opacity of the crosshair. By default, the crosshair is opaque. */ opacity?: number; /** * If set to `true`, the Chart displays the category axis crosshair. By default, the category axis crosshair is not visible. */ visible?: boolean; /** * The width of the crosshair in pixels. */ width?: number; /** * The options of the crosshair tooltip. The crosshair tooltip is displayed when the [`categoryAxis.crosshair.tooltip.visible`]({% slug api_charts_chartcategoryaxiscrosshairtooltipprops %}#toc-visible) option is set to `true`. */ tooltip?: CategoryAxisCrosshairTooltip; } /** * @hidden */ export declare interface CategoryAxisCrosshairTooltip extends AxisCrosshairTooltip { } /** * @hidden */ export declare interface CategoryAxisLabels { /** * 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. You can split the text into multiple lines by using the line feed characters (`"\n"`). * * The fields available in the function argument are: * - `value`—The category value. * - `dataItem`—The data item if a field is specified. If the category does not have a corresponding item in the data, an empty object is passed. * - `format`—The default format of the label. * - `culture`—The default culture (if set) 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]({% slug overview_intl %}). */ culture?: string; /** * The format for displaying the labels of the date category axis. The `{0}` placeholder represents the category value. The Chart selects the appropriate format for the current [`categoryAxis.baseUnit`]({% slug api_charts_chartcategoryaxisitemprops %}#toc-baseunit) option. * * Setting the [`categoryAxis.labels.format`]({% slug api_charts_chartcategoryaxislabelsprops %}#toc-format) option overrides the date formats. For more information, refer to the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. * * > Not supported for Radar Charts. Use [`categoryAxis.labels.format`]({% slug api_charts_chartcategoryaxislabelsprops %}#toc-format) instead. */ dateFormats?: DateFormats; /** * The font style of the labels. */ font?: string; /** * The format for displaying the labels. Uses the [`format`]({% slug api_intl_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 position of the axis labels. By default, labels are positioned next to the axis. * * When `position` is set to `end`, the labels are placed at the end of the crossing axis— * typically, at the top or right end of the Chart unless the crossing axis was reversed. * * When `position` is set to `start`, the labels are placed at the start of the crossing axis— * typically, at the left or bottom end of the Chart unless the crossing axis was reversed. */ position?: AxisLabelsPosition; /** * The rotation angle of the labels. By default, the labels are not rotated. If the axis is horizontal, can be set to `"auto"`. In this case, the labels are rotated only if the slot size is not sufficient for the entire labels. */ rotation?: LabelRotation | number | 'auto'; /** * The number of labels to skip. By default, no labels are skipped. */ skip?: number; /** * The rendering step of the label—renders every nth label. By default, every label is rendered. */ step?: number; /** * If set to `true`, the Chart displays the category axis labels. By default, the category axis labels are visible. */ visible?: boolean; /** * A function for creating a custom visual for the labels. * * The available argument fields are: * - `createVisual`—A function for getting the default visual. * - `culture`—The default culture (if set) on the label. * - `dataItem`—The data item if a field is specified. * - `format`—The default format of the label. * - `options`—The label options. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_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; } /** * @hidden */ export declare interface CategoryAxisNotes { /** * The items of the notes. */ data?: any[]; /** * The line of the notes. */ line?: NoteLine; /** * The position of the category axis note. * * The available options are: * - `"top"`—The note is positioned on the top. * - `"bottom"`—The note is positioned on the bottom. * - `"left"`—The note is positioned on the left. * - `"right"`—The note is positioned on the right. */ position?: NotePosition; /** * A function that can be used to create a custom visual for the notes. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect. * - `options`—The note options. * - `createVisual`—A function for getting the default visual. * - `value`—The note value. */ visual?: (e: AxisNoteVisualArgs) => drawing.Element; /** * The icon of the notes. */ icon?: CategoryAxisNotesIcon; /** * The label of the notes. */ label?: CategoryAxisNotesLabel; } /** * @hidden */ export declare interface CategoryAxisNotesIcon { /** * The background color of the notes icon. */ background?: string; /** * The border of the notes icon. */ border?: Border; /** * The size of the notes icon. */ size?: number; /** * The shape of the notes icon. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; /** * The visibility of the notes icon. */ visible?: boolean; } /** * @hidden */ export declare interface CategoryAxisNotesLabel { /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The text color of the label. 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 and defines the category value. You can split the text into multiple lines by using the line feed characters (`"\n"`). */ content?: (e: any) => string; /** * The font style of the label. */ font?: string; /** * The format for displaying the notes label. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the category value. */ format?: string; /** * The position of the label. * * The available options are: * - `"inside"`—The label is positioned inside the icon. * - `"outside"`—The label is positioned outside the icon. */ position?: NoteLabelPosition; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * If set to `true`, the Chart displays the category notes label. By default, the category notes label is visible. */ visible?: boolean; } /** * The configuration options of the category axis date range labels. */ export declare interface CategoryAxisRangeLabels extends CategoryAxisLabels { /** * @hidden */ position?: AxisLabelsPosition; /** * @hidden */ skip?: number; /** * @hidden */ step?: number; /** * If set to `true`, the Chart displays the category axis date range labels. * By default, the category axis date range labels are not visible. */ visible?: boolean; } /** * @hidden */ export declare interface CategoryAxisSelect { /** * The lower boundary of the selected range. */ from?: any; /** * The maximum value which the user can select. */ max?: any; /** * The minimum value which the user can select. */ min?: any; /** * The mousewheel configuration of the selection. If set to `false`, the mousewheel does not update the selection. */ mousewheel?: boolean | MousewheelSelect; /** * The upper boundary of the selected range. The category with the specified index (date) is not included in the selected range unless the axis is justified. To select all categories, set a value that is larger than the last category index (date). */ to?: any; } /** * @hidden */ export declare interface CategoryAxisTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the title. * * The supported values are: * - `"top"`—The axis title is positioned on the top (applicable to the vertical axis). * - `"bottom"`—The axis title is positioned on the bottom (applicable to the vertical axis). * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: AxisTitlePosition; /** * The rotation angle of the title. By default, the title is not rotated. */ rotation?: number; /** * The text of the title. The text can be split into multiple lines by using the line feed characters (`"\n"`). */ text?: string; /** * If set to `true`, the Chart displays the category axis title. By default, the category axis title is visible. */ visible?: boolean; /** * A function that can be used to create a custom visual for the title. * * The available argument fields are: * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (can be `undefined`). * - `options`—The label options. * - `createVisual`—A function for getting the default visual. */ visual?: (e: TitleVisualArgs) => drawing.Element; } /** * The `baseUnit` type of the category axis. * * @example * ```jsx * import { * Chart, * ChartCategoryAxis, * ChartCategoryAxisItem, * ChartSeries, * ChartSeriesItem * } from '@progress/kendo-react-charts'; * * const baseUnit = "months"; * const data = [{ category: new Date(2000, 0, 1), value: 1 }, { category: new Date(2001, 0, 1), value: 1}]; * * const ChartContainer = () => ( * * * * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type CategoryBaseUnit = BaseUnit | 'auto' | 'fit'; /** * Represents the [KendoReact Chart component]({% slug overview_chart_charts %}). * * @remarks * Supported children components are: {@link ChartAxisDefaults}, {@link ChartCategoryAxis}, {@link ChartArea}, * {@link ChartLegend}, {@link ChartPane}, {@link ChartPaneDefaults}, {@link ChartPanes}, {@link ChartPlopArea}, {@link ChartPlopArea}, * {@link ChartSeries}, {@link ChartSeriesDefaults}, {@link ChartSubTitle}, {@link ChartTitle}, {@link ChartTooltip}, * {@link ChartValueAxis}, {@link ChartXAxis}, {@link ChartYAxis}, {@link ChartZoomable}. * * @example * ```jsx * import { * Chart, * ChartSeries, * ChartSeriesItem, * ChartCategoryAxis, * ChartCategoryAxisItem, * ChartTitle, * ChartLegend * } from '@progress/kendo-react-charts'; * * const categories = [ 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011 ]; * const series = [ { * name: 'India', * data: [ 3.907, 7.943, 7.848, 9.284, 9.263, 9.801, 3.890, 8.238, 9.552, 6.855 ] * }, { * name: 'Russian Federation', * data: [ 4.743, 7.295, 7.175, 6.376, 8.153, 8.535, 5.247, -7.832, 4.3, 4.3 ] * }, { * name: 'Germany', * data: [ 0.010, -0.375, 1.161, 0.684, 3.7, 3.269, 1.083, -5.127, 3.690, 2.995 ] * }, { * name: 'World', * data: [ 1.988, 2.733, 3.994, 3.464, 4.001, 3.939, 1.333, -2.245, 4.339, 2.727 ] * } ]; * * const ChartContainer = () => ( * * * * * * * * {series.map((item, idx) => ( * ))} * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare class Chart extends React_2.Component { private _baseChart; /** * @hidden */ get chartInstance(): any; /** * The Drawing `Surface` of the Chart. */ get surface(): Surface | null; /** * The DOM element of the Chart. */ get element(): HTMLDivElement | null; /** * @hidden */ render(): any; private getTarget; } /** * Represents the KendoReact ChartArea component. * * @remarks * Supported children components are: {@link ChartAreaItem}. */ export declare const ChartArea: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartArea component ([see example]({% slug chartarea_chart_charts %})). */ export declare interface ChartAreaProps extends ChartingArea { } /** * Represents the KendoReact ChartAxisDefaults component. * * @remarks * Supported children components are: {@link ChartAxisDefaultsCrosshair}, {@link ChartAxisDefaultsLabels}, {@link ChartAxisDefaultsTitle}. */ export declare const ChartAxisDefaults: React_2.FunctionComponent; /** * Represents the KendoReact ChartAxisDefaultsCrosshair component. * * @remarks * Supported children components are: {@link ChartAxisDefaultsCrosshairTooltip}. */ export declare const ChartAxisDefaultsCrosshair: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartAxisDefaultsCrosshair component. */ export declare interface ChartAxisDefaultsCrosshairProps extends AxisDefaultsCrosshair { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartAxisDefaultsCrosshairTooltip component. */ export declare const ChartAxisDefaultsCrosshairTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartAxisDefaultsCrosshairTooltip component. */ export declare interface ChartAxisDefaultsCrosshairTooltipProps extends AxisDefaultsCrosshairTooltip { } /** * Represents the KendoReact ChartAxisDefaultsLabels component. */ export declare const ChartAxisDefaultsLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartAxisDefaultsLabels component. */ export declare interface ChartAxisDefaultsLabelsProps extends AxisDefaultsLabels { } /** * Represents the props of the KendoReact ChartAxisDefaults component ([see example]({% slug axes_chart_charts %}#toc-default-axis-configuration)). */ export declare interface ChartAxisDefaultsProps extends AxisDefaults { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartAxisDefaultsTitle component. */ export declare const ChartAxisDefaultsTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartAxisDefaultsTitle component. */ export declare interface ChartAxisDefaultsTitleProps extends AxisDefaultsTitle { } /** * An interface for the Chart axes API. */ export declare interface ChartAxisType { /** * Returns the axis range. * * @returns {AxisRange} - The axis range. */ range(): AxisRange; /** * Returns a slot that is based on the specified `from` and `to` values ([see example]({% slug plotbands_chart_charts %}#toc-custom-plot-bands)). * * @param from - The slot start value. * @param to - The end slot value. If not specified, the `from` value is used. * @param limit - The parameters for the exported image. * @returns {Promise} - Indicates whether the slot is limited to the current range. * By default, the range is limited. */ slot(from: string | number | Date, to?: string | number | Date, limit?: boolean): geometry.Rect | geometry.Arc; /** * Returns the value that corresponds to the passed surface point. * * @param { Point } point - The surface point of the Chart. * @returns {string | number | Date} - The value that corresponds to the point. */ value(point: geometry.Point): string | number | Date; /** * Returns the axis range which is determined by the minimum and maximum point values that are associated with the axis. * * @returns {AxisRange} - The value range. */ valueRange(): AxisRange; } /** * Represents the Chart Breadcrumb component. */ export declare const ChartBreadcrumb: React_2.ForwardRefExoticComponent>; /** * Represents the Object which is passed to the * [`ref`](https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom) callback of the ChartBreadcrumb component. */ declare interface ChartBreadcrumbHandle { /** * The current element or `null` if there is none. */ element: HTMLDivElement | null; /** * The props values of the ChartBreadcrumb. */ props: ChartBreadcrumbProps; } /** * Represents the properties of [Chart Breadcrumb](% slug api_charts_chartbreadcrumb %) component. */ export declare interface ChartBreadcrumbProps extends Omit { /** * The definition of the breadcrumb root item. * * The default value is `{ text: 'Home', icon: }`. * Where `homeIcon` is imported from `@progress/kendo-svg-icons`. */ rootItem?: DataModel; /** * Fires when the user when the user has selected a different drilldown level. */ onDrilldownStateChange?: (event: DrilldownStateChangeEvent) => void; /** * The current drilldown state of the Chart. */ drilldownState?: ChartDrilldownState; } /** * Represents the KendoReact ChartCategoryAxis component. * * @remarks * Supported children components are: {@link ChartCategoryAxisItem}. */ export declare const ChartCategoryAxis: React_2.FunctionComponent; /** * Represents the KendoReact ChartCategoryAxisCrosshair component. * * @remarks * Supported children components are: {@link ChartCategoryAxisCrosshairTooltip}. */ export declare const ChartCategoryAxisCrosshair: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisCrosshair component. */ export declare interface ChartCategoryAxisCrosshairProps extends CategoryAxisCrosshair { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartCategoryAxisCrosshairTooltip component. */ export declare const ChartCategoryAxisCrosshairTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisCrosshairTooltip component. */ export declare interface ChartCategoryAxisCrosshairTooltipProps extends CategoryAxisCrosshairTooltip { } /** * Represents the KendoReact ChartCategoryAxisItemponent. * * @remarks * Supported children components are: {@link ChartCategoryAxisCrosshair}, {@link ChartCategoryAxisLabels}, {@link ChartCategoryAxisNotes}, * {@link ChartCategoryAxisNotesIcon}, {@link ChartCategoryAxisNotesLabel}, {@link ChartCategoryAxisRangeLabels}, {@link ChartCategoryAxisSelect}, {@link ChartCategoryAxisTitle}. */ export declare const ChartCategoryAxisItem: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisItem component ([see example]({% slug axes_chart_charts %}#toc-categorical-chart-axes)). */ export declare interface ChartCategoryAxisItemProps extends CategoryAxis { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartCategoryAxisLabels component. */ export declare const ChartCategoryAxisLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisLabels component. */ export declare interface ChartCategoryAxisLabelsProps extends CategoryAxisLabels { } /** * Represents the KendoReact ChartCategoryAxisNotes component. * * @remarks * Supported children components are: {@link ChartCategoryAxisNotesIcon} and {@link ChartCategoryAxisNotesLabel}. */ export declare const ChartCategoryAxisNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartCategoryAxisNotesIcon component. */ export declare const ChartCategoryAxisNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisNotesIcon component. */ export declare interface ChartCategoryAxisNotesIconProps extends CategoryAxisNotesIcon { } /** * Represents the KendoReact ChartCategoryAxisNotesLabel component. */ export declare const ChartCategoryAxisNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisNotesLabel component. */ export declare interface ChartCategoryAxisNotesLabelProps extends CategoryAxisNotesLabel { } /** * Represents the props of the KendoReact ChartCategoryAxisNotes component. */ export declare interface ChartCategoryAxisNotesProps extends CategoryAxisNotes { children?: React_2.ReactNode; } /** * Represents the props of the KendoReact ChartCategoryAxis component ([see example]({% slug axes_chart_charts %}#toc-categorical-chart-axes)). */ export declare interface ChartCategoryAxisProps { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartCategoryAxisRangeLabels component. */ export declare const ChartCategoryAxisRangeLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisRangeLabels component. */ export declare interface ChartCategoryAxisRangeLabelsProps extends CategoryAxisRangeLabels { } /** * Represents the props of the KendoReact ChartCategoryAxisSelect component. */ export declare interface ChartCategoryAxisSelectProps extends CategoryAxisSelect { } /** * Represents the KendoReact ChartCategoryAxisTitle component. */ export declare const ChartCategoryAxisTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartCategoryAxisTitle component. */ export declare interface ChartCategoryAxisTitleProps extends CategoryAxisTitle { } /** * @hidden */ declare const ChartContext: React_2.Context; /** * @hidden */ declare interface ChartContextType_2 { optionsStore: Store; observersStore: Store; childrenObserver: InstanceObserver; drilldownState: ChartDrilldownState; } /** * The Chart drilldown state. */ export declare interface ChartDrilldownState { /** * A stack of all drilldown steps performed in the Chart. * * If the `steps` are empty the Chart is the root level. */ steps: ChartDrilldownStep[]; } /** * Describes a single drilldown step. */ export declare interface ChartDrilldownStep { /** * The parent series name. */ seriesName: string; /** * The drilldown value of the selected series point. */ drilldownValue: any; } /** * @hidden */ export declare interface ChartingArea { /** * The background color of the Chart area. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the Chart area. */ border?: Border; /** * The height of the Chart area. */ height?: number; /** * The margin of the Chart area. A numeric value sets all margins. */ margin?: Margin | number; /** * The background opacity of the Chart area. By default, the background is opaque. */ opacity?: number; /** * The width of the Chart area. */ width?: number; } /** * Represents the KendoReact ChartLegend component. * * @remarks * Supported children components are: {@link ChartLegendInactiveItems}, {@link ChartLegendItem}, {@link ChartLegendTitle}. */ export declare const ChartLegend: React_2.FunctionComponent; /** * Represents the KendoReact ChartLegendInactiveItems component. */ export declare const ChartLegendInactiveItems: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartLegendInactiveItems component. */ export declare interface ChartLegendInactiveItemsProps extends LegendInactiveItems { } /** * Represents the KendoReact ChartLegendItem component. */ export declare const ChartLegendItem: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartLegendItem component. */ export declare interface ChartLegendItemProps extends LegendItem { } /** * Represents the props of the KendoReact ChartLegend component ([see example]({% slug legend_chart_charts %})). */ export declare interface ChartLegendProps extends Legend { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartLegendTitle component. * ([see example]({% slug legend_chart_charts %}#toc-setting-a-title)). */ export declare const ChartLegendTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartLegendTitle component. */ export declare interface ChartLegendTitleProps extends LegendTitle { } /** * Represents the KendoReact ChartNavigator component. * * @remarks * Supported children components are: {@link ChartNavigatorHint}, {@link ChartNavigatorPane}, {@link ChartNavigatorSelect}, {@link ChartNavigatorSeries}. */ export declare const ChartNavigator: React_2.FunctionComponent; /** * Represents the KendoReact ChartNavigatorCategoryAxis component. * * @remarks * Supported children components are: {@link ChartNavigatorCategoryAxisCrosshair}, {@link ChartNavigatorCategoryAxisLabels}, {@link ChartNavigatorCategoryAxisNotes}, * {@link ChartNavigatorCategoryAxisNotesIcon}, {@link ChartNavigatorCategoryAxisNotesLabel}, {@link ChartNavigatorCategoryAxisSelect}, {@link ChartNavigatorCategoryAxisTitle}. */ export declare const ChartNavigatorCategoryAxis: React_2.FunctionComponent; /** * Represents the KendoReact ChartNavigatorCategoryAxisCrosshair component. * * @remarks * Supported children components are: {@link ChartNavigatorCategoryAxisCrosshairTooltip}. */ export declare const ChartNavigatorCategoryAxisCrosshair: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisCrosshair component. */ export declare interface ChartNavigatorCategoryAxisCrosshairProps extends CategoryAxisCrosshair { } /** * Represents the KendoReact ChartNavigatorCategoryAxisCrosshairTooltip component. */ export declare const ChartNavigatorCategoryAxisCrosshairTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisCrosshairTooltip component. */ export declare interface ChartNavigatorCategoryAxisCrosshairTooltipProps extends CategoryAxisCrosshairTooltip { } /** * Represents the KendoReact ChartNavigatorCategoryAxisLabels component. */ export declare const ChartNavigatorCategoryAxisLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisLabels component. */ export declare interface ChartNavigatorCategoryAxisLabelsProps extends CategoryAxisLabels { } /** * Represents the the KendoReact ChartNavigatorCategoryAxisNotes component. */ export declare const ChartNavigatorCategoryAxisNotes: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisNotesIcon component. */ export declare const ChartNavigatorCategoryAxisNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisNotesIcon component. */ export declare interface ChartNavigatorCategoryAxisNotesIconProps extends CategoryAxisNotesIcon { } /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisNotesLabel component. */ export declare const ChartNavigatorCategoryAxisNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisNotesLabel component. */ export declare interface ChartNavigatorCategoryAxisNotesLabelProps extends CategoryAxisNotesLabel { } /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisNotes component. */ export declare interface ChartNavigatorCategoryAxisNotesProps extends CategoryAxisNotes { } /** * Represents the props of the KendoReact ChartNavigatorCategoryAxis component. */ export declare interface ChartNavigatorCategoryAxisProps extends CategoryAxis { } /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisSelect component. */ export declare interface ChartNavigatorCategoryAxisSelectProps extends CategoryAxisSelect { } /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisTitle component. */ export declare const ChartNavigatorCategoryAxisTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorCategoryAxisTitle component. */ export declare interface ChartNavigatorCategoryAxisTitleProps extends CategoryAxisTitle { } /** * Represents the KendoReact ChartNavigatorHint component. * */ export declare const ChartNavigatorHint: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorHint component. */ export declare interface ChartNavigatorHintProps extends NavigatorHint { } /** * Represents the KendoReact ChartNavigatorPane component. * * @remarks * Supported children components are: {@link ChartNavigatorPaneTitle}. */ export declare const ChartNavigatorPane: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorPane component. */ export declare interface ChartNavigatorPaneProps extends Pane { } /** * Represents the KendoReact ChartNavigatorPaneTitle component. */ export declare const ChartNavigatorPaneTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorPaneTitle component. */ export declare interface ChartNavigatorPaneTitleProps extends PanesTitle { } /** * Represents the props of the KendoReact ChartNavigator component. */ export declare interface ChartNavigatorProps extends Navigator_2 { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartNavigatorSelect component. */ export declare const ChartNavigatorSelect: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSelect component. */ export declare interface ChartNavigatorSelectProps extends NavigatorSelect { } /** * Represents the KendoReact ChartNavigatorSeries component. * * @remarks * Supported children components are: {@link ChartNavigatorSeriesItem}. */ export declare const ChartNavigatorSeries: React_2.FunctionComponent; /** * Represents the KendoReact ChartNavigatorSeriesErrorBars component. */ export declare const ChartNavigatorSeriesErrorBars: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesErrorBars component. */ export declare interface ChartNavigatorSeriesErrorBarsProps extends SeriesErrorBars { } /** * Represents the KendoReact ChartNavigatorSeriesExtremes component. */ export declare const ChartNavigatorSeriesExtremes: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesExtremes component. */ export declare interface ChartNavigatorSeriesExtremesProps extends SeriesExtremes { } /** * Represents the KendoReact ChartNavigatorSeriesHighlight component. */ export declare const ChartNavigatorSeriesHighlight: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesHighlight component. */ export declare interface ChartNavigatorSeriesHighlightProps extends SeriesHighlight { } /** * Represents the KendoReact ChartNavigatorSeriesItem component. * * @remarks * Supported children components are: {@link ChartNavigatorSeriesErrorBars}, {@link ChartNavigatorSeriesExtremes}, {@link ChartNavigatorSeriesHighlight}, {@link ChartNavigatorSeriesLabels}, * {@link ChartNavigatorSeriesMarkers}, {@link ChartNavigatorSeriesNotes}, {@link ChartNavigatorSeriesItemOutliers}, {@link ChartNavigatorSeriesItemTooltip}. */ export declare const ChartNavigatorSeriesItem: React_2.FunctionComponent; /** * Represents the KendoReact ChartNavigatorSeriesItemOutliers component. */ export declare const ChartNavigatorSeriesItemOutliers: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesItemOutliers component. */ export declare interface ChartNavigatorSeriesItemOutliersProps extends SeriesOutliers { } /** * Represents the props of the KendoReact ChartNavigatorSeriesItem component. */ export declare interface ChartNavigatorSeriesItemProps extends Series { } /** * Represents the KendoReact ChartNavigatorSeriesItemTooltip component. */ export declare const ChartNavigatorSeriesItemTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesItemTooltip component. */ export declare interface ChartNavigatorSeriesItemTooltipProps extends SeriesTooltip_2 { render?: (props: TooltipContext) => React_2.ReactNode; } /** * Represents the KendoReact ChartNavigatorSeriesLabels component. * * @remarks * Supported children components are: {@link ChartNavigatorSeriesLabelsFrom}, {@link ChartNavigatorSeriesLabelsTo}. */ export declare const ChartNavigatorSeriesLabels: React_2.FunctionComponent; /** * Represents the KendoReact ChartNavigatorSeriesLabelsFrom component. */ export declare const ChartNavigatorSeriesLabelsFrom: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesLabelsFrom component. */ export declare interface ChartNavigatorSeriesLabelsFromProps extends SeriesLabelsFrom { } /** * Represents the props of the KendoReact ChartNavigatorSeriesLabels component. */ export declare interface ChartNavigatorSeriesLabelsProps extends SeriesLabels { } /** * Represents the KendoReact ChartNavigatorSeriesLabelsTo component. */ export declare const ChartNavigatorSeriesLabelsTo: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesLabelsTo component. */ export declare interface ChartNavigatorSeriesLabelsToProps extends SeriesLabelsTo { } /** * Represents the KendoReact ChartNavigatorSeriesMarkers component. */ export declare const ChartNavigatorSeriesMarkers: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesMarkers component. */ export declare interface ChartNavigatorSeriesMarkersProps extends SeriesMarkers { } /** * Represents the KendoReact ChartNavigatorSeriesNotes component. * * @remarks * Supported children components are: {@link ChartNavigatorSeriesNotesIcon}, {@link ChartNavigatorSeriesNotesLabel}. */ export declare const ChartNavigatorSeriesNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartNavigatorSeriesNotesIcon component. */ export declare const ChartNavigatorSeriesNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesNotesIcon component. */ export declare interface ChartNavigatorSeriesNotesIconProps extends SeriesNotesIcon { } /** * Represents the KendoReact ChartNavigatorSeriesNotesLabel component. */ export declare const ChartNavigatorSeriesNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartNavigatorSeriesNotesLabel component. */ export declare interface ChartNavigatorSeriesNotesLabelProps extends SeriesNotesLabel { } /** * Represents the props of the KendoReact ChartNavigatorSeriesNotes component. */ export declare interface ChartNavigatorSeriesNotesProps extends SeriesNotes { } /** * Represents the props of the KendoReact ChartNavigatorSeries component. */ export declare interface ChartNavigatorSeriesProps { children?: React_2.ReactNode; } /** * The KendoReact `ChartNoDataOverlay` component. The component is used to display an overlay with a message when the Chart has no data, no series, or all series are empty. * The overlay will be automatically cleared if the series receive data. */ export declare const ChartNoDataOverlay: React_2.FunctionComponent; /** * The props of the `ChartNoDataOverlay` component. */ export declare interface ChartNoDataOverlayProps { /** * The styles that are applied to the component. */ style?: React_2.CSSProperties; /** * Sets additional CSS classes to the component. */ className?: string; /** * The content of the overlay. If not set, the default message will be displayed. */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartPane component. * * @remarks * Supported children components are: {@link ChartPaneTitle}. */ export declare const ChartPane: React_2.FunctionComponent; /** * Represents the KendoReact ChartPaneDefaults component. * * @remarks * Supported children components are: {@link ChartPaneDefaultsTitle}. */ export declare const ChartPaneDefaults: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartPaneDefaults component ([see example]({% slug panes_chart_charts %})). */ export declare interface ChartPaneDefaultsProps extends PaneDefaults { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartPaneDefaultsTitle component ([see example]({% slug panes_chart_charts %})). */ export declare const ChartPaneDefaultsTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartPaneDefaultsTitle component ([see example]({% slug panes_chart_charts %})). */ export declare interface ChartPaneDefaultsTitleProps extends PaneDefaultsTitle { } /** * Represents the props of the KendoReact ChartPane component ([see example]({% slug panes_chart_charts %})). */ export declare interface ChartPaneProps extends Pane { } /** * Represents the KendoReact ChartPanes component. * * @remarks * Supported children components are: {@link ChartPane}. */ export declare const ChartPanes: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartPanes component. */ export declare interface ChartPanesProps { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartPaneTitle component ([see example]({% slug panes_chart_charts %})). */ export declare const ChartPaneTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartPaneTitle component ([see example]({% slug panes_chart_charts %})). */ export declare interface ChartPaneTitleProps extends PanesTitle { } /** * An interface for the Chart panes. */ export declare interface ChartPaneType { /** * The group which holds the Drawing elements of the Chart. */ chartsVisual: Group; /** * The Drawing group that is used to draw the pane. */ visual: Group; } /** * Represents the KendoReact ChartPlotArea component ([see example]({% slug plotarea_chart_charts %})). */ export declare const ChartPlotArea: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartPlotArea component ([see example]({% slug plotarea_chart_charts %})). */ export declare interface ChartPlotAreaProps extends PlotArea { } /** * An interface for the plot area of the Chart. */ export declare interface ChartPlotAreaType { /** * The Drawing `MultiPath` that is used to draw the background. */ backgroundVisual: MultiPath; /** * The Drawing `Group` that is used to draw the plot area. */ visual: Group; } /** * Represents the props of the KendoReact Chart component. */ export declare interface ChartProps extends BaseChartProps { /** * When set, the prop is used to render the Donut Center template. */ donutCenterRender?: () => React.ReactElement; } export declare type Charts = Chart | StockChart | Sparkline; /** * Represents the KendoReact ChartSeries component. * * @remarks * Supported children components are: {@link ChartSeriesItem}. */ export declare const ChartSeries: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesDefaults component. * * @remarks * Supported children components are: {@link ChartSeriesDefaultsLabels}, {@link ChartSeriesDefaultsTooltip}, {@link ChartSeriesDefaultsNotes}. */ export declare const ChartSeriesDefaults: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesDefaultsItemTooltip component. */ export declare const ChartSeriesDefaultsItemTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesDefaultsItemTooltip component. */ export declare interface ChartSeriesDefaultsItemTooltipProps extends SeriesDefaultsTooltip { render?: (props: TooltipContext) => React_2.ReactNode; } /** * Represents the KendoReact ChartSeriesDefaultsLabels component. * * @remarks * Supported children components are: {@link ChartSeriesDefaultsLabelsFrom}, {@link ChartSeriesDefaultsLabelsTo}. */ export declare const ChartSeriesDefaultsLabels: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesDefaultsLabelsFrom component. */ export declare const ChartSeriesDefaultsLabelsFrom: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesDefaultsLabelsFrom component. */ export declare interface ChartSeriesDefaultsLabelsFromProps extends SeriesDefaultsLabelsFrom { } /** * Represents the props of the KendoReact ChartSeriesDefaultsLabels component ([see example]({% slug series_chart_charts %}#toc-default-series-configuration)). */ export declare interface ChartSeriesDefaultsLabelsProps extends SeriesDefaultsLabels { } /** * Represents the the KendoReact ChartSeriesDefaultsLabelsTo component. */ export declare const ChartSeriesDefaultsLabelsTo: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesDefaultsLabelsTo component. */ export declare interface ChartSeriesDefaultsLabelsToProps extends SeriesDefaultsLabelsTo { } /** * Represents the KendoReact ChartSeriesDefaultsNotes component. * * @remarks * Supported children components are: {@link ChartSeriesDefaultsNotesIcon}, {@link ChartSeriesDefaultsNotesLabel}. */ export declare const ChartSeriesDefaultsNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesDefaultsNotesIcon component. */ export declare const ChartSeriesDefaultsNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesDefaultsNotesIcon component. */ export declare interface ChartSeriesDefaultsNotesIconProps extends SeriesDefaultsNotesIcon { } /** * Represents the KendoReact ChartSeriesDefaultsNotesLabel component. */ export declare const ChartSeriesDefaultsNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesDefaultsNotesLabel component. */ export declare interface ChartSeriesDefaultsNotesLabelProps extends SeriesDefaultsNotesLabel { } /** * Represents the props of the KendoReact ChartSeriesDefaultsNotes component ([see example]({% slug series_chart_charts %}#toc-default-series-configuration)). */ export declare interface ChartSeriesDefaultsNotesProps extends SeriesDefaultsNotes { } /** * Represents the props of the KendoReact ChartSeriesDefaults component ([see example]({% slug series_chart_charts %}#toc-default-series-configuration)). */ export declare interface ChartSeriesDefaultsProps extends SeriesDefaults { } /** * Represents the KendoReact ChartSeriesErrorBars component. */ export declare const ChartSeriesErrorBars: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesErrorBars component. */ export declare interface ChartSeriesErrorBarsProps extends SeriesErrorBars { } /** * Represents the KendoReact ChartSeriesExtremes component. */ export declare const ChartSeriesExtremes: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesExtremes component. */ export declare interface ChartSeriesExtremesProps extends SeriesExtremes { } /** * Represents the KendoReact ChartSeriesHighlight component. */ export declare const ChartSeriesHighlight: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesHighlight component. */ export declare interface ChartSeriesHighlightProps extends SeriesHighlight { } /** * Represents the KendoReact ChartSeriesItem component. * * @remarks * Supported children components are: {}. */ export declare const ChartSeriesItem: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesItemOutliers component. */ export declare const ChartSeriesItemOutliers: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesItemOutliers component. */ export declare interface ChartSeriesItemOutliersProps extends SeriesOutliers { } /** * Represents the props of the KendoReact ChartSeriesItem component. */ export declare interface ChartSeriesItemProps extends Series { /** * @hidden */ children?: React_2.ReactNode; /** * @hidden */ _chartCollectionIdxKey?: string; /** * When set, the prop is used to render the Drilldown Series. */ drilldownSeriesFactory?: (props: any) => React_2.ReactElement; } /** * Represents the KendoReact ChartSeriesItemTooltip component ([see example]({% slug tooltips_chart_charts %})). */ export declare const ChartSeriesItemTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesItemTooltip component ([see example]({% slug tooltips_chart_charts %})). */ export declare interface ChartSeriesItemTooltipProps extends SeriesTooltip_2 { render?: (props: TooltipContext) => React_2.ReactNode; } /** * Represents the KendoReact ChartSeriesLabels component. * * @remarks * Supported children components are: {@link ChartSeriesLabelsFrom}, {@link ChartSeriesLabelsTo}. */ export declare const ChartSeriesLabels: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesLabelsFrom component. */ export declare const ChartSeriesLabelsFrom: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesLabelsFrom component. */ export declare interface ChartSeriesLabelsFromProps extends SeriesLabelsFrom { } /** * Represents the props of the KendoReact ChartSeriesLabels component ([see example]({% slug labels_chart_charts %}#toc-setting-the-appearance)). */ export declare interface ChartSeriesLabelsProps extends SeriesLabels { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartSeriesLabelsTo component. */ export declare const ChartSeriesLabelsTo: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesLabelsTo component. */ export declare interface ChartSeriesLabelsToProps extends SeriesLabelsTo { } /** * Represents the KendoReact ChartSeriesMarkers component. */ export declare const ChartSeriesMarkers: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesMarkers component. */ export declare interface ChartSeriesMarkersProps extends SeriesMarkers { } /** * Represents the KendoReact ChartSeriesNotes component. * * @remarks * Supported children components are: {@link ChartSeriesNotesIcon}, {@link ChartSeriesNotesLabel}. */ export declare const ChartSeriesNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartSeriesNotesIcon component. */ export declare const ChartSeriesNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesNotesIcon component. */ export declare interface ChartSeriesNotesIconProps extends SeriesNotesIcon { } /** * Represents the KendoReact ChartSeriesNotesLabel component. */ export declare const ChartSeriesNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSeriesNotesLabel component. */ export declare interface ChartSeriesNotesLabelProps extends SeriesNotesLabel { } /** * Represents the props of the KendoReact ChartSeriesNotes component. */ export declare interface ChartSeriesNotesProps extends SeriesNotes { } /** * Represents the props of the KendoReact ChartSeries component. */ export declare interface ChartSeriesProps { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartSubtitle component ([see example]({% slug title_chart_charts %})). */ export declare const ChartSubtitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartSubtitle component ([see example]({% slug title_chart_charts %})). */ export declare interface ChartSubtitleProps extends Subtitle { } /** * Represents the KendoReact ChartTitle component ([see example]({% slug title_chart_charts %})). */ export declare const ChartTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartTitle component ([see example]({% slug title_chart_charts %})). */ export declare interface ChartTitleProps extends Title { } /** * Represents the KendoReact ChartTooltip component ([see example]({% slug tooltips_chart_charts %})). */ export declare const ChartTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartTooltip component ([see example]({% slug tooltips_chart_charts %})). */ export declare interface ChartTooltipProps extends Tooltip { render?: ((props: TooltipContext) => React_2.ReactNode) | ((props: SharedTooltipContext) => React_2.ReactNode); } /** * Represents the KendoReact ChartValueAxis component ([see example]({% slug axes_chart_charts %}#toc-categorical-chart-axes)). * * @remarks * Supported children components are: {@link ChartValueAxisItem}. */ export declare const ChartValueAxis: React_2.FunctionComponent; /** * Represents the KendoReact ChartValueAxisCrosshair component. * * @remarks * Supported children components are: {@link ChartValueAxisCrosshairTooltip}. */ export declare const ChartValueAxisCrosshair: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisCrosshair component. */ export declare interface ChartValueAxisCrosshairProps extends ValueAxisCrosshair { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartValueAxisCrosshairTooltip component. */ export declare const ChartValueAxisCrosshairTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisCrosshairTooltip component. */ export declare interface ChartValueAxisCrosshairTooltipProps extends ValueAxisCrosshairTooltip { } /** * Represents the KendoReact ChartValueAxisItem component ([see example]({% slug axes_chart_charts %}#toc-categorical-chart-axes)). * * @remarks * Supported children components are: {@link ChartValueAxisCrosshair}, {@link ChartValueAxisLabels}, {@link ChartValueAxisNotes}, {@link ChartValueAxisTitle}. */ export declare const ChartValueAxisItem: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisItem component ([see example]({% slug axes_chart_charts %}#toc-categorical-chart-axes)). */ export declare interface ChartValueAxisItemProps extends ValueAxis { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartValueAxisLabels component ([see example]({% slug labels_chart_charts %}#toc-setting-the-appearance)). */ export declare const ChartValueAxisLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisLabels component ([see example]({% slug labels_chart_charts %}#toc-setting-the-appearance)). */ export declare interface ChartValueAxisLabelsProps extends ValueAxisLabels { } /** * Represents the KendoReact ChartValueAxisNotes component. * * @remarks * Supported children components are: {@link ChartValueAxisNotesIcon} and {@link ChartValueAxisNotesLabel}. */ export declare const ChartValueAxisNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartValueAxisNotesIcon component. */ export declare const ChartValueAxisNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisNotesIcon component. */ export declare interface ChartValueAxisNotesIconProps extends ValueAxisNotesIcon { } /** * Represents the KendoReact ChartValueAxisNotesLabel component. */ export declare const ChartValueAxisNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisNotesLabel component. */ export declare interface ChartValueAxisNotesLabelProps extends ValueAxisNotesLabel { } /** * Represents the props of the KendoReact ChartValueAxisNotes component. */ export declare interface ChartValueAxisNotesProps extends ValueAxisNotes { children?: React_2.ReactNode; } /** * Represents the props of the KendoReact ChartValueAxis component ([see example]({% slug axes_chart_charts %}#toc-categorical-chart-axes)). */ export declare interface ChartValueAxisProps { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartValueAxisTitle component. */ export declare const ChartValueAxisTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartValueAxisTitle component. */ export declare interface ChartValueAxisTitleProps extends ValueAxisTitle { } /** * Represents the KendoReact ChartXAxis component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). * * @remarks * Supported children components are: {@link ChartXAxisItem}. */ export declare const ChartXAxis: React_2.FunctionComponent; /** * Represents the KendoReact ChartXAxisCrosshair component. * * @remarks * Supported children components are: {@link ChartXAxisCrosshairTooltip}. */ export declare const ChartXAxisCrosshair: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisCrosshair component. */ export declare interface ChartXAxisCrosshairProps extends XAxisCrosshair { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartXAxisCrosshairTooltip component. */ export declare const ChartXAxisCrosshairTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisCrosshairTooltip component. */ export declare interface ChartXAxisCrosshairTooltipProps extends XAxisCrosshairTooltip { } /** * Represents the KendoReact ChartXAxisItem component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). * * @remarks * Supported children components are: {@link ChartXAxisCrosshair}, {@link ChartXAxisLabels}, {@link ChartXAxisNotes}, {@link ChartXAxisTitle}. */ export declare const ChartXAxisItem: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisItem component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). */ export declare interface ChartXAxisItemProps extends XAxis { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartXAxisLabels component. */ export declare const ChartXAxisLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisLabels component. */ export declare interface ChartXAxisLabelsProps extends XAxisLabels { } /** * Represents the KendoReact ChartXAxisNotes component. * * @remarks * Supported children components are: {@link ChartXAxisNotesIcon}, {@link ChartXAxisNotesLabel}. */ export declare const ChartXAxisNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartXAxisNotesIcon component. */ export declare const ChartXAxisNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisNotesIcon component. */ export declare interface ChartXAxisNotesIconProps extends XAxisNotesIcon { } /** * Represents the KendoReact ChartXAxisNotesLabel component. */ export declare const ChartXAxisNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisNotesLabel component. */ export declare interface ChartXAxisNotesLabelProps extends XAxisNotesLabel { } /** * Represents the props of the KendoReact ChartXAxisNotes component. */ export declare interface ChartXAxisNotesProps extends XAxisNotes { children?: React_2.ReactNode; } /** * Represents the props of the KendoReact ChartXAxis component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). */ export declare interface ChartXAxisProps { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartXAxisTitle component. */ export declare const ChartXAxisTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartXAxisTitle component. */ export declare interface ChartXAxisTitleProps extends XAxisTitle { } /** * Represents the KendoReact ChartYAxis component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). * * @remarks * Supported children components are: {@link ChartYAxisItem}. */ export declare const ChartYAxis: React_2.FunctionComponent; /** * Represents the KendoReact ChartYAxisCrosshair component. * * @remarks * Supported children components are: {@link ChartYAxisCrosshairTooltip}. */ export declare const ChartYAxisCrosshair: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisCrosshair component. */ export declare interface ChartYAxisCrosshairProps extends YAxisCrosshair { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartYAxisCrosshairTooltip component. */ export declare const ChartYAxisCrosshairTooltip: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisCrosshairTooltip component. */ export declare interface ChartYAxisCrosshairTooltipProps extends YAxisCrosshairTooltip { } export declare const ChartYAxisItem: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisItem component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). */ export declare interface ChartYAxisItemProps extends YAxis { /** * @hidden */ children?: React_2.ReactNode; } /** * Represents the KendoReact ChartYAxisLabels component. */ export declare const ChartYAxisLabels: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisLabels component. */ export declare interface ChartYAxisLabelsProps extends YAxisLabels { } /** * Represents the KendoReact ChartYAxisNotes component. * * @remarks * Supported children components are: {@link ChartYAxisNotesIcon}, {@link ChartYAxisNotesLabel}. */ export declare const ChartYAxisNotes: React_2.FunctionComponent; /** * Represents the KendoReact ChartYAxisNotesIcon component. */ export declare const ChartYAxisNotesIcon: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisNotesIcon component. */ export declare interface ChartYAxisNotesIconProps extends YAxisNotesIcon { } /** * Represents the KendoReact ChartYAxisNotesLabel component. */ export declare const ChartYAxisNotesLabel: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisNotesLabel component. */ export declare interface ChartYAxisNotesLabelProps extends YAxisNotesLabel { } /** * Represents the props of the KendoReact ChartYAxisNotes component. */ export declare interface ChartYAxisNotesProps extends YAxisNotes { } /** * Represents the props of the KendoReact ChartXAxis component ([see example]({% slug axes_chart_charts %}#toc-scatter-chart-axes)). */ export declare interface ChartYAxisProps { children?: React_2.ReactNode; } /** * Represents the KendoReact ChartYAxisTitle component. */ export declare const ChartYAxisTitle: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartYAxisTitle component. */ export declare interface ChartYAxisTitleProps extends YAxisTitle { } /** * Represents the KendoReact ChartZoomable component. */ export declare const ChartZoomable: React_2.FunctionComponent; /** * Represents the props of the KendoReact ChartZoomable component. */ export declare interface ChartZoomableProps extends Zoomable { } /** * @hidden */ export declare class CollectionConfigurationComponent extends React_2.Component { static contextType: React_2.Context; context: React_2.ContextType; get optionsStore(): Store_2 | undefined; renderChildren(child: any, index: number): React_2.DetailedReactHTMLElement; render(): any; } /** * @hidden */ declare interface CollectionConfigurationProps { _chartKey: string; _parentStore?: any; [x: string]: any; } /** * @hidden */ export declare class ConfigurationComponent extends React_2.Component { static contextType: React_2.Context; context: React_2.ContextType; childStore: any; get optionsStore(): Store_3 | undefined; constructor(props: any); render(): any; componentDidMount(): void; componentDidUpdate(): void; private dispatch; private renderChildren; } /** * @hidden */ declare interface ConfigurationComponentProps { _chartKey?: string; _chartCollectionIdxKey?: string; _parentStore?: any; [x: string]: any; } /** * Converts data objects to Sankey data. */ export declare const createSankeyData: typeof createSankeyData_2; /** * @hidden */ export declare class CrosshairTooltip extends React_2.Component { static contextType: React_2.Context; context: React_2.ContextType; readonly state: CrosshairTooltipState; chartObserver: InstanceObserver; constructor(props: any); componentDidMount(): void; render(): JSX.Element; componentWillUnmount(): void; onShowTooltip(e: any): void; onHideTooltip(): void; } /** * @hidden */ export declare class CrosshairTooltipContainer extends React_2.Component<{}, CrosshairTooltipContainerState> { static contextType: React_2.Context; context: React_2.ContextType; readonly state: CrosshairTooltipContainerState; private storeUnsubscriber; componentDidMount(): void; render(): JSX.Element; componentWillUnmount(): void; subscriber: () => void; } /** * @hidden */ declare interface CrosshairTooltipContainerState { tooltips: Tooltips; } /** * @hidden */ export declare interface CrosshairTooltipProps { index: number; name: string; } /** * @hidden */ declare interface CrosshairTooltipState { className?: string | undefined; popupShown: boolean; popupAlign?: Align; popupOffset?: Offset; popupStyles?: any; popupContend?: any; } export { CrosshatchPattern } /** * The dash line type. * * @example * ```jsx * import { * Chart, * ChartSeries, * ChartSeriesItem * } from '@progress/kendo-react-charts'; * * const data = [1, 2, 3]; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type DashType = 'dash' | 'dashDot' | 'dot' | 'longDash' | 'longDashDot' | 'longDashDotDot' | 'solid'; /** * The format that is used to display the labels when they are dates. * * The Chart selects the appropriate format for the current `baseUnit`. Setting the `format` option of the labels overrides the date formats. */ export declare interface DateFormats { /** * The provided format when the axis `baseUnit` is set to `"milliseconds"`. */ milliseconds?: string; /** * The provided format when the axis `baseUnit` is set to `"seconds"`. */ seconds?: string; /** * The provided format when the axis `baseUnit` is set to `"minutes"`. */ minutes?: string; /** * The provided format when the axis `baseUnit` is set to `"hours"`. */ hours?: string; /** * The provided format when the axis `baseUnit` is set to `"days"`. */ days?: string; /** * The provided format when the axis `baseUnit` is set to `"weeks"`. */ weeks?: string; /** * The provided format when the axis `baseUnit` is set to `"months"`. */ months?: string; /** * The provided format when the axis `baseUnit` is set to `"years"`. */ years?: string; } export { DiagonalStripesPattern } /** * @hidden */ declare class DomEvent { /** * The `Chart` component that triggered the event. */ sender: React.Component; /** * The syntheticEvent */ syntheticEvent: T; /** * @hidden */ constructor(sender: React.Component, e: T); } /** * @hidden */ export declare class DonutCenter extends React_2.Component { static contextType: React_2.Context; context: React_2.ContextType; readonly state: DonutCenterState; chartObserver: InstanceObserver; constructor(props: DonutCenterProps); componentDidMount(): void; render(): any; onRender(event: any): void; } /** * @hidden */ declare interface DonutCenterProps { render?: () => React_2.ReactElement; } /** * @hidden */ declare interface DonutCenterState { donutCenterStyles: DonutCenterStyle | null; } /** * @hidden */ declare interface DonutCenterStyle { height: number; left: number; top: number; width: number; } export { DotsPattern } /** * Configures the drag behavior during the pan and zoom operations. */ export declare interface DragAction { /** * Specifies a keyboard key that has to be pressed to activate the gesture. */ key?: ModifierKey; /** * Specifies an axis that will not be panned or zoomed. */ lock?: LockAxis; } /** * Arguments for the `dragEnd` event. */ export declare class DragEndEvent extends BaseEvent { /** * A dictionary which contains the range (min and max values) of named axes. The axis name is used as a key. */ axisRanges: { [name: string]: AxisRange; }; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `drag` event. */ declare class DragEvent_2 extends PreventableEvent { /** * A dictionary which contains the range (min and max values) of named axes. The axis name is used as a key. */ axisRanges: { [name: string]: AxisRange; }; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * @hidden */ constructor(e: any, target: Charts); } export { DragEvent_2 as DragEvent } /** * Arguments for the `dragStart` event. */ export declare class DragStartEvent extends PreventableEvent { /** * A dictionary which contains the range (min and max values) of named axes. The axis name is used as a key. */ axisRanges: { [name: string]: AxisRange; }; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `drilldown` event. * * See [Drilldown Charts](slug:drilldown_charts). */ export declare class DrilldownEvent extends BaseEvent { /** * The clicked series point. */ point: SeriesPointType; /** * The clicked point series options. */ series: EventSeriesOptions; /** * The data point value. */ value: any; /** * The current Chart [drilldown state](slug:api_charts_chartprops#toc-drilldownstate). */ currentState: ChartDrilldownState; /** * The Chart [drilldown state](slug:api_charts_chartprops#toc-drilldownstate) that will apply the current drilldown operation. * * See [Drilldown](slug:drilldown_charts) for an application example. */ nextState: ChartDrilldownState; /** * @hidden */ constructor(e: any, target: Charts); } /** * Represents the props of a [Drilldown Series Factory](slug:api_charts_chartseriesitemprops#toc-drilldownseriesfactory) component. */ export declare interface DrilldownSeriesFactoryProps { /** * The drilldown field value. */ drilldownValue: any; /** * The series point to drill down to. */ point: any; /** * The series to drill down to. */ series: any; } /** * Arguments for the `drilldownStateChange` event on the Chart Breadcrumb. * * See [Drilldown Charts](slug:drilldown_charts). */ export declare class DrilldownStateChangeEvent { /** * The current Chart [drilldown state](slug:api_charts_chartprops#toc-drilldownstate). */ currentState: ChartDrilldownState; /** * The Chart [drilldown state](slug:api_charts_chartprops#toc-drilldownstate) that will apply the current drilldown operation. * * See [Drilldown](slug:drilldown_charts) for an application example. */ nextState: ChartDrilldownState; /** * @hidden */ constructor(e: any); } /** * The appearance settings for the error bar lines. */ export declare interface ErrorBarLine { /** * The dash type of the line. */ dashType?: DashType; /** * The width of the line in pixels. */ width?: number; } /** * The context for the error bars visual function. */ export declare interface ErrorBarsVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The high value of the error bar. */ high: number; /** * The low value of the error bar. */ low: number; /** * The `options` object of the error bar. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; } /** * The axis options for the Chart events. */ export declare interface EventAxisOptions { /** * The axis name. */ name: string; } /** * The series options for the Chart events. */ export declare interface EventSeriesOptions { /** * The series index. */ index: number; /** * The series name. */ name: string; /** * The series visibility. */ visible: boolean; } /** * Exports a Chart component as a Drawing `Scene`. * * @param {Chart} chartComponent - The instance of the KendoReact Chart component. * @param {any} options - The parameters for the export operation. * @returns {Group} - The root Group of the scene. */ export declare const exportVisual: (chartComponent: Charts, options?: any) => Group | undefined; /** * Returns the axis with the specified name. * * @param {Chart} chartComponent - The instance of the KendoReact Chart component. * @param {string} name - The axis name. * @returns {ChartAxis} - The axis with a corresponding name. */ export declare const findAxisByName: (chartComponent: Charts, name: string) => ChartAxisType | undefined; /** * Returns the pane at the specified index. * * @param {Chart} chartComponent - The instance of the KendoReact Chart component. * @param {number} index - The pane index. * @returns {ChartPane} - The pane at the specified index. */ export declare const findPaneByIndex: (chartComponent: Charts, index: number) => ChartPaneType | undefined; /** * Returns the pane with the specified name. * * @param {Chart} chartComponent - The instance of the KendoReact Chart component. * @param {string} name - The name of the pane. * @returns {ChartPane} - The pane with the provided name. */ export declare const findPaneByName: (chartComponent: Charts, name: string) => ChartPaneType | undefined; export { FocusHighlight } export { FocusHighlightBorder } /** * The appearance configuration for the major and minor axis grid lines (see the [basic usage example]({% slug api_charts_chartaxisdefaults %})). */ export declare interface GridLines { /** * The color of the grid lines. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The dash type of the grid lines. */ dashType?: DashType; /** * The number of lines to skip at the beginning. */ skip?: number; /** * The tick-rendering step. Renders every nth line, where `n` is the step. */ step?: number; /** * If set to `true`, the Chart displays the lines. By default, only the major axis grid lines are visible. */ visible?: boolean; /** * The width of the lines in pixels. */ width?: number; } export { GridPattern } /** * The appearance settings for the highlight line of the Candlestick and OHLC series. */ export declare interface HighlightLine { /** * The color of the highlighted line. Accepts a valid CSS color string, including hex and rgb. The default color is computed from the base-point color. */ color?: string; /** * The dash type of the line. */ dashType?: DashType; /** * The opacity of the line. By default, the border is opaque (`opacity = 1`). */ opacity?: number; /** * The width of the line in pixels. */ width?: number; } /** * The context for the highlight toggle function. */ export declare interface HighlightToggleArgs { /** * A function that can be used to prevent the showing of the default highlight overlay. */ preventDefault: () => void; /** * A Boolean value which indicates whether to show the highlight. */ show: boolean; /** * The visual element that needs to be highlighted. */ visual: drawing.Element; /** * The point category. */ category: any; /** * The point `dataItem`. */ dataItem?: any; /** * The value of the point. */ value: any; /** * The series of the point. */ series?: any; } /** * The context for the point highlight visual function. */ export declare interface HighlightVisualArgs { /** * The point category. */ category: any; /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The data item of the point. */ dataItem: any; /** * The point options. */ options: any; /** * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked series. */ percentage?: number; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The sum of point values since the last `runningTotal` summary point. Available for the Waterfall series. */ runningTotal?: number; /** * The instance of the Chart component. */ sender: Chart; /** * The series of the point. */ series: any; /** * The sum of all previous series values. Available for the Waterfall series. */ total?: number; /** * The value of the point. */ value: any; } /** * The appearance settings for the label connectors on the Donut and Pie series. */ export declare interface LabelConnectors { /** * The color of the connecting line. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The distance between the connector line and the main chart. */ padding?: number; /** * The width of the connector line in pixels. */ width?: number; } /** * The rotation configuration for the axis labels. */ export declare interface LabelRotation { /** * The alignment of the rotated labels relative to the slot center. * * The supported values are: * * `"end"` * * `"center"` * * By default, the Charts align the closest end of the label to the center. If set to `"center"`, the center of the rotated label will be aligned instead. */ align?: 'end' | 'center'; /** * The rotation angle of the labels. By default, the labels are not rotated. Can be set to `"auto"`. In this case, the labels will be rotated only if the slot size is not sufficient for the entire labels. */ angle?: number | 'auto'; } /** * @hidden */ export declare interface Legend { /** * The legend is horizontally aligned when [`legend.position`]({% slug api_charts_chartlegendprops %}#toc-position) is set to `"top"` or `"bottom"`. The legend is vertically aligned when [`legend.position`]({% slug api_charts_chartlegendprops %}#toc-position) is set to `"left"` or `"right"`. * * The supported values are: * - `"start"`—The legend is aligned to the start. * - `"center"`—The legend is aligned to the center. * - `"end"`—The legend is aligned to the end. */ align?: 'start' | 'center' | 'end'; /** * The background color of the legend. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the legend. */ border?: Border; /** * The height of the legend when [`legend.orientation`]({% slug api_charts_chartlegendprops %}#toc-orientation) is set to `"vertical"`. */ height?: number; /** * The label configuration of the Chart legend. */ labels?: LegendLabels; /** * The margin of the Chart legend. A numeric value sets all paddings. */ margin?: Margin | number; /** * The X offset of the Chart legend. The offset is relative to the default position of the legend. For example, a value of `20` moves the legend 20 pixels to the right of its initial position. Negative values move the legend to the left of its current position. */ offsetX?: number; /** * The Y offset of the chart legend. The offset is relative to the current position of the legend. For example, a value of `20` moves the legend 20 pixels down from its initial position. Negative values move the legend upwards from its current position. */ offsetY?: number; /** * The orientation of the legend items. * * The supported values are: * - `"vertical"`—The legend items are added vertically. * - `"horizontal"`—The legend items are added horizontally. */ orientation?: 'vertical' | 'horizontal'; /** * The padding of the Chart legend. A numeric value sets all paddings. */ padding?: Padding | number; /** * The positions of the Chart legend. * * The supported values are: * - `"top"`—The legend is positioned on the top. * - `"bottom"`—The legend is positioned on the bottom. * - `"left"`—The legend is positioned on the left. * - `"right"`—The legend is positioned on the right. * - `"custom"`—The legend is positioned by using [`legend.offsetX`]({% slug api_charts_chartlegendprops %}#toc-offsetx) and [`legend.offsetY`]({% slug api_charts_chartlegendprops %}#toc-offsety). */ position?: 'top' | 'bottom' | 'left' | 'right' | 'custom'; /** * If set to `true`, the legend items are reversed. */ reverse?: boolean; /** * If set to `true`, the Chart displays the legend ([see example]({% slug legend_chart_charts %}#toc-hiding-the-legend)). By default, the Chart legend is visible. */ visible?: boolean; /** * The legend width when the [`legend.orientation`]({% slug api_charts_chartlegendprops %}#toc-orientation) is set to `"horizontal"`. */ width?: number; /** * The configuration of the Chart inactive legend items. */ inactiveItems?: LegendInactiveItems; /** * The configuration of the Chart legend item. */ item?: LegendItem; /** * The title of the Chart legend. * By default, the Chart will not render a legend title. */ title?: LegendTitle; /** * The focus highlight configuration options of the Chart legend. */ focusHighlight?: FocusHighlight; } /** * @hidden */ export declare interface LegendInactiveItems { /** * The label configuration of the Chart legend. */ labels?: LegendLabels; } /** * The configuration of the Chart legend item. */ export declare interface LegendItem { /** * The cursor style of the legend item. */ cursor?: string; /** * Sets the type of the legend item. * The default value is based on the series type. */ type?: LegendItemType; /** * Sets the configuration of the legend items of type `line`. * This is the default legend item type for all line and scatter series. */ line?: LegendItemLine; /** * Sets the configuration of the legend items of type `area`. * By default, all series except line and scatter use this legend type. */ area?: LegendItemArea; /** * The markers configuration of the legend item. * Defaults to the series options. */ markers?: LegendItemMarkers; /** * The highlight configuration of the legend item. */ highlight?: LegendItemHighlight; /** * A function for creating a custom visual for the legend items. * * The available argument fields are: * - `options`—The item options. * - `createVisual`—A function for getting the default visual. * - `series`—The item series. * - `pointIndex`—The index of the point in the series. Available for the Pie, Donut, and Funnel series. */ visual?: (e: LegendItemVisualArgs) => drawing.Element; } /** * The configuration of the Chart legend items of type `area`. * Defaults to the series options. */ export declare interface LegendItemArea { /** * The background color of the legend item. Accepts a valid CSS color string, including HEX and RGB. * Defaults to the series color. */ background?: string; /** * The opacity of the legend item. * Defaults to the series opacity. */ opacity?: number; } /** * Arguments for the `legendItemClick` event. */ export declare class LegendItemClickEvent extends PreventableEvent { /** * An object which contains the series options. */ series: EventSeriesOptions; /** * The index of the series in the parent Chart. */ seriesIndex: number; /** * The point index in the series. Applicable only to the Pie, Donut, Funnel and Pyramid series. */ pointIndex: number; /** * The text of the legend item. */ text: string; /** * @hidden */ constructor(e: any, target: Charts); /** * If called, the series visibility is not toggled as a result of clicking the legend item. */ preventDefault(): void; } /** * The configuration of the Chart legend item highlight state. */ export declare interface LegendItemHighlight { /** * If set to `false`, the hover effect of the legend item is disabled. */ visible?: boolean; /** * The `markers` configuration of the legend item when it is hovered. */ markers?: LegendItemMarkers; } /** * Arguments for the `legendItemHover` event. */ export declare class LegendItemHoverEvent extends PreventableEvent { /** * An object which contains the series options. */ series: EventSeriesOptions; /** * The index of the series in the parent Chart. */ seriesIndex: number; /** * The point index in the series. Applicable only to the Pie, Donut, Funnel and Pyramid series. */ pointIndex: number; /** * The text of the legend item. */ text: string; /** * @hidden */ constructor(e: any, target: Charts); /** * If called, the series highlight is not shown as a result of hovering over the legend item. */ preventDefault(): void; } /** * The configuration of the Chart legend item of type `line`. * Defaults to the series options. */ export declare interface LegendItemLine { /** * The color of the legend item. Accepts a valid CSS color string, including HEX and RGB. * Defaults to the series color. */ color?: string; /** * The opacity of the legend item. * Defaults to the series opacity. */ opacity?: number; /** * The dash type of the legend item. * Defaults to the series dash type. */ dashType?: DashType; } /** * The configuration of the Chart legend item markers. */ export declare interface LegendItemMarkers extends Omit { /** * The border of the markers. */ border?: LegendItemMarkersBorder; } /** * The configuration of the Chart legend item markers border. */ export declare interface LegendItemMarkersBorder extends Omit { } /** * The type of the Chart legend item. * * - `"line"`—the legend items are rendered as a line. This is the default value for line charts. * - `"area"`—the legend items are rendered as a filled rectangle. This is the default value for area charts. */ export declare type LegendItemType = 'line' | 'area'; /** * The context for the legend item visual function. */ export declare interface LegendItemVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The options of the legend item. */ options: any; /** * The index of the point in the series. Available for the Donut, Pie, and Funnel series. */ pointIndex: any; /** * The instance of the Chart component. */ sender: Chart; /** * The item series. */ series: any; } /** * The appearance configuration for the legend labels. */ export declare interface LegendLabels { /** * The color of the legend label text. Accepts a valid [CSS `color`](https://developer.mozilla.org/en-US/docs/Web/CSS/color) configuration string, including hex and rgb. */ color?: string; /** * The font of the legend label text. Accepts a valid [CSS `font`](https://developer.mozilla.org/en-US/docs/Web/CSS/font) configuration string. */ font?: string; /** * The margin of the labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the labels. A numeric value sets all paddings. */ padding?: Padding | number; /** * A function used to generate the content of each label. */ content?: (e: LegendLabelsContentArgs) => string; } /** * The context for the legend label content function. */ export declare interface LegendLabelsContentArgs { /** * The text of the legend item. */ text: string; /** * The series configuration object. */ series: any; /** * The point value of the Donut and Pie charts. */ value?: any; /** * The point value which is represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. */ percentage?: number; } /** * @hidden */ export declare interface LegendTitle { /** * The alignment of the title. * * The available options are: * - `"center"`—The text is aligned to the middle. * - `"left"`—The text is aligned to the left. * - `"right"`—The text is aligned to the right. */ align?: 'center' | 'left' | 'right'; /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all margins. */ padding?: Padding | number; /** * The position of the title. * * The available options are: * - `"bottom"`—The title is positioned beneath the legend. * - `"top"`—The title is positioned above the legend. */ position?: 'top' | 'bottom'; /** * The text of the title. * You can split the text into multiple lines by using the line feed characters ("\n"). */ text?: string; /** * If set to `true`, the Chart displays the Legend title. By default, the title is displayed. */ visible?: boolean; /** * A function for creating a custom visual for the title. */ visual?: (args: TitleVisualArgs) => Element_2; } /** * The line style of the series. * * @example * ```jsx * import { * Chart, * ChartSeries, * ChartSeriesItem * } from '@progress/kendo-react-charts'; * * const data = [1, 2, 3]; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type LineStyle = 'normal' | 'step' | 'smooth'; /** * Specifies an axis for locking during the pan and zoom operations. */ export declare type LockAxis = 'none' | 'x' | 'y'; /** * The margin configuration for each side. */ export declare interface Margin { /** * The top margin in pixels. */ top?: number; /** * The right margin in pixels. */ right?: number; /** * The bottom margin in pixels. */ bottom?: number; /** * The left margin in pixels. */ left?: number; } /** * The context for the markers visual function. */ export declare interface MarkersVisualArgs { /** * The point category. */ category: any; /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The point data item. */ dataItem: any; /** * The marker options. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The point series. */ series: any; /** * The point value. */ value: any; } /** * Specifies the marker type. * * > Note that `"rect"` is an alias for `"square"`. * * @example * ```jsx * import { * Chart, * ChartSeries, * ChartSeriesItem * } from '@progress/kendo-react-charts'; * * const data = [1, 2, 3]; * const markerType = "cross"; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type MarkerType = 'square' | 'circle' | 'triangle' | 'cross' | 'rect' | 'roundedRect'; /** * Specifies a modifier key. */ export declare type ModifierKey = 'none' | 'ctrl' | 'shift' | 'alt'; /** * Configuration of the mousewheel action for selection. */ export declare interface MousewheelSelect { /** * If set to `true`, the option reverses the mousewheel direction. For `"zoom out"`, the regular direction is down. For `"zoom in"`, the regular direction is up. */ reverse?: boolean; /** * The zoom direction of the selection. * * The supported values are: * * `"both"`—Zooming expands and contracts the selection on both sides. * * `"left"`—Zooming expands and contracts the selection on the left side only. * * `"right"`—Zooming expands and contracts the selection on the right side only. */ zoom?: 'both' | 'left' | 'right'; } /** * The configuration of the mousewheel action for zooming. */ export declare interface MousewheelZoom { /** * Specifies an axis that will not be zoomed. */ lock?: LockAxis; /** * Specifies the zoom rate as percentage of the axis range. The default value is 0.3 or 30% of the axis range. * * The accepted range is from 0.01 to 0.9 (1% to 90%). * * @default 0.3 */ rate?: number; } /** * @hidden */ declare interface Navigator_2 { /** * The visibility of the navigator. */ visible?: boolean; /** * The configuration options of the category axis. */ categoryAxis?: CategoryAxis; /** * The default options of the navigator hint. */ hint?: NavigatorHint; /** * The configuration of the navigator pane. */ pane?: Pane; /** * The position of the navigator. * By default, the navigator is positioned at the bottom. */ position?: 'top' | 'bottom'; /** * Specifies the initially selected range. If no range is specified, the full range of values is shown. */ select?: NavigatorSelect; /** * An array of series definitions. Accepts the same options as the root series collection. Omitting the array and specifying a single series is also acceptable. */ series?: Series | Series[]; } export { Navigator_2 as Navigator } /** * The arguments for the `navigatorFilter` event. */ export declare class NavigatorFilterEvent extends BaseEvent { /** * The start of the navigator range. */ from: Date; /** * The end of the navigator range. */ to: Date; /** * Constructs the event arguments from a raw object. */ constructor(e: any, target: Charts); } /** * @hidden */ export declare interface NavigatorHint { /** * The function that returns the content of the hint. * * The available fields in the event argument are: * - `from`—The lower boundary of the selected range. * - `to`—The upper boundary of the selected range. */ content?: (e: any) => string; /** * The format of the hint. */ format?: string; /** * The visibility of the hint. */ visible?: boolean; } /** * @hidden */ export declare interface NavigatorSelect { /** * The lower boundary of the selected range. */ from?: Date; /** * The configuration of the mousewheel selection. If set to `false`, the mousewheel does not update the selection. */ mousewheel?: boolean | MousewheelSelect; /** * The upper boundary of the selected range. */ to?: Date; } /** * The appearance settings for the negative values in the Bubble series. */ export declare interface NegativeBubbleValues { /** * The color of the negative bubble Chart values. */ color?: string; /** * If set to `true`, the Chart displays the negative bubbles. By default, the negative bubbles are not displayed. */ visible?: boolean; } /** * Arguments for the `noteClick` event. */ export declare class NoteClickEvent extends BaseEvent { /** * The data point category. Available only for the Categorical charts (Bar, Line, Area, and similar). */ category: any; /** * The data item of the point note. */ dataItem: any; /** * An object which contains the note series options. */ series: EventSeriesOptions; /** * The note value. */ value: any; /** * The note visual element. */ visual: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `noteHover` event. */ export declare class NoteHoverEvent extends BaseEvent { /** * The data point category. Available only for the Categorical charts (Bar, Line, Area, and similar). */ category: any; /** * The data item of the point note. */ dataItem: any; /** * An object containing the note series options. */ series: EventSeriesOptions; /** * The note value. */ value: any; /** * The note visual element. */ visual: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * The position of a note label. * * @example * ```jsx * import { * Chart, * ChartValueAxis, * ChartValueAxisItem * } from '@progress/kendo-react-charts'; * * const data = [{value: 1, label: { text: 'Foo' }}]; * const position = "outside"; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type NoteLabelPosition = 'inside' | 'outside'; /** * The appearance settings for the note-connecting line. */ export declare interface NoteLine { /** * The color of the note line. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The dash type of the note line. */ dashType?: DashType; /** * The length of the connecting line in pixels. */ length?: number; /** * The width of the connecting line in pixels. */ width?: number; } /** * Specifies the position of a note. * * @example * ```jsx * import { * Chart, * ChartValueAxis, * ChartValueAxisItem * } from '@progress/kendo-react-charts'; * * const data = [{value: 1}]; * const position = "right"; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type NotePosition = 'top' | 'bottom' | 'left' | 'right'; /** * The appearance settings for the overlay of the series elements. */ export declare interface Overlay { /** * The gradient of the Chart series. * * The supported values are: * * `"glass"`—Applicable for the Bar, Column, and Candlestick series. * * `"none"` * * `"roundedBevel"`—Applicable for the Donut and Pie series. * * `"sharpBevel"`—Applicable for the Donut and Pie series. */ gradient?: 'glass' | 'none' | 'roundedBevel' | 'sharpBevel'; } /** * The padding configuration for each side (see the [basic usage example]({% slug api_charts_charttitle %})). */ export declare interface Padding extends Margin { } /** * @hidden */ export declare interface Pane { /** * The background color of the pane. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the pane. */ border?: Border; /** * Specifies whether the Charts in the pane have to be clipped. By default, all Charts except the Radar and Polar Charts are clipped. */ clip?: boolean; /** * The height of the pane in pixels. */ height?: number; /** * The margin of the pane. A numeric value sets all margins. */ margin?: Margin | number; /** * The unique name of the pane. */ name?: string; /** * The padding of the pane. A numeric value sets all paddings. */ padding?: Padding | number; /** * The title configuration of the pane. To display the title, set the [`panes.title.text`]({% slug api_charts_chartpanetitleprops %}#toc-text) option. */ title?: string | PanesTitle; } /** * The configuration options of the Chart pane defaults. */ export declare interface PaneDefaults { /** * The background color of the pane. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the pane. */ border?: Border; /** * Specifies whether the Charts in the pane have to be clipped. By default, all Charts except the Radar and Polar Charts are clipped. */ clip?: boolean; /** * The height of the pane in pixels. */ height?: number; /** * The margin of the pane. A numeric value sets all margins. */ margin?: Margin | number; /** * The unique name of the pane. */ name?: string; /** * The padding of the pane. A numeric value sets all paddings. */ padding?: Padding | number; /** * The title configuration of the pane. To display the title, set the [`panes.title.text`]({% slug api_charts_chartpanetitleprops %}#toc-text) option. */ title?: PaneDefaultsTitle; } /** * The configuration options of the default pane title. */ export declare interface PaneDefaultsTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The position of the title. * * The supported values are: * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: 'left' | 'right' | 'center'; /** * If set to `true`, the Chart displays the pane title. By default, the pane title is visible. */ visible?: boolean; /** * A function that can be used to create a custom visual for the title. * * The available argument fields are: * * - `text`—The label text. * - `rect`—The [geometry Rect]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (might be `undefined`). * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. */ visual?: (e: any) => drawing.Element; } /** * @hidden */ export declare interface PanesTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The position of the title. * * The supported values are: * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: 'left' | 'right' | 'center'; /** * The text of the title. You can split the text into multiple lines by using line feed characters (`"\n"`). */ text?: string; /** * If set to `true`, the Chart displays the pane title. By default, the pane title is visible. */ visible?: boolean; /** * A function that can be used to create a custom visual for the title. * * The available argument fields are: * * - `text`—The label text. * - `rect`—The [geometry Rect]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (might be `undefined`). * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. */ visual?: (e: any) => drawing.Element; } /** * @hidden */ export declare interface PlotArea { /** * The background color of the Chart plot area. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the plot area. */ border?: Border; /** * The margin of the plot area. A numeric value sets all margins. */ margin?: Margin | number; /** * The background opacity of the plot area. By default, the background is opaque. */ opacity?: number; /** * The padding of the plot area. A numeric value sets all paddings. The default padding for the Pie, Donut, Radar, and Polar Charts is proportional of the Chart size. */ padding?: Padding | number; } /** * Arguments for the `plotAreaClick` event. */ export declare class PlotAreaClickEvent extends BaseEvent { /** * The data point category. Available only for the Categorical charts (Bar, Line, Area, and similar). */ category: any; /** * The original browser event that triggered the click action. */ nativeEvent: any; /** * The data point value. Available only for the Categorical charts (Bar, Line, Area, and similar). */ value: any; /** * The X axis value or array of values for multi-axis charts. */ x: any; /** * The Y axis value or array of values for multi-axis charts. */ y: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `plotAreaHover` event. */ export declare class PlotAreaHoverEvent extends BaseEvent { /** * The data point category. Available only for the Categorical charts (Bar, Line, Area, and similar). */ category: any; /** * The original browser event that triggered the click action. */ nativeEvent: any; /** * The data point value. Available only for the Categorical charts (Bar, Line, Area, and similar). */ value: any; /** * The X axis value or array of values for multi-axis charts. */ x: any; /** * The Y axis value or array of values for multi-axis charts. */ y: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * A plot band ([see example]({% slug plotbands_chart_charts %})). */ export declare interface PlotBand { /** * The color of the plot band. */ color?: string; /** * The start position of the plot band in axis units. */ from?: number | Date; /** * The opacity of the plot band. */ opacity?: number; /** * The end position of the plot band in axis units. */ to?: number | Date; /** * The label configuration of the plot band. * * To display a label, set the text option. * * See [Plot Bands - Labels]({% slug plotbands_chart_charts %}#toc-labels) for sample usage. */ label?: PlotBandLabel; } /** * The appearance configuration for the plot band label. */ export declare interface PlotBandLabel { /** * The horizontal alignment of the label text. * * By default, the label is aligned to the left. * * The supported values are: * - `"center"`—The label is positioned in the center of the plot band. * - `"right"`—The label is positioned on the right side of the plot band. * - `"left"`—The label is positioned on the left side of the plot band. */ align?: 'center' | 'right' | 'left'; /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The color of the plot band label text. * Accepts a valid [CSS `color`](https://developer.mozilla.org/en-US/docs/Web/CSS/color) * configuration string, including hex and rgb. */ color?: string; /** * The font of the plot band label text. * Accepts a valid [CSS `font`](https://developer.mozilla.org/en-US/docs/Web/CSS/font) * configuration string. */ font?: string; /** * The margin of the label. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the label. A numeric value sets all paddings. */ padding?: Padding | number; /** * The vertical position of the label inside the plot band. * * By default, the label is aligned to the top. * * The supported values are: * - `"bottom"`—The label is positioned on the bottom of the plot band. * - `"center"`—The label is positioned in the center of the plot band. * - `"top"`—The label is positioned on the top of the plot band. */ position?: 'bottom' | 'center' | 'top'; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * The text of the label. * * > The text can be split into multiple lines by using line feed characters ("\n"). */ text?: string; /** * If set to `false`, the will not display the plot band label. * By default, the plot band labels are not displayed. */ visible?: boolean; /** * A function that can be used to create a custom visual for the label. * * The available argument fields are: * * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. * - `sender`—A reference to the Chart instance. */ visual?: (e: PlotBandLabelVisualArgs) => drawing.Element; } /** * The context for the function of the plot bands label visual. */ export declare interface PlotBandLabelVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The label options. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The label text. */ text: string; } /** * @hidden */ declare abstract class PreventableEvent extends BaseEvent { private prevented; /** * Prevents the default action for a specified event. In this way, the source component suppresses the built-in behavior that follows the event. */ preventDefault(): void; /** * Returns `true` if the event was prevented by any of its subscribers. * * @returns `true` if the default action was prevented. * Otherwise, returns `false`. */ isDefaultPrevented(): boolean; } /** * Arguments for the `render` event. */ export declare class RenderEvent extends BaseEvent { /** * @hidden */ constructor(_e: any, sender: Charts); } /** * The KendoReact Sankey component. */ export declare const Sankey: React_2.ForwardRefExoticComponent>; export { SankeyData } /** * The KendoReact Sankey event object. */ export declare interface SankeyEvent extends Omit, Omit, 'syntheticEvent'> { } /** * @hidden */ export declare type SankeyEventHandler = (event: SankeyEvent) => void; export { SankeyExportVisualOptions } /** * Represents the object which is passed to the [`ref`](https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom) * callback of the [Sankey]({% slug api_charts_sankey %}) component. */ export declare interface SankeyHandle { /** * The root DOM element of the Sankey component. */ element: HTMLDivElement | null; /** * The props of the Sankey component. */ props: SankeyProps; /** * Exports the visual of the Sankey component to a drawing group. */ exportVisual(options?: SankeyExportVisualOptions): Group; } export { SankeyLabel } export { SankeyLabelDefaults } /** * Represents the Sankey legend options. */ export declare interface SankeyLegend extends Omit { /** * The configuration of the legend items. */ item?: SankeyLegendItem; } export { SankeyLink } export { SankeyLinkDataItem } export { SankeyLinkDefaults } export { SankeyLinkHighlight } export { SankeyNode } export { SankeyNodeDataItem } export { SankeyNodeDefaults } export { SankeyOptions } /** * Represents the props of the KendoReact [Sankey]({% slug api_charts_sankey %}) component. */ export declare interface SankeyProps { /** * The styles that are applied to the Sankey component. */ style?: React.CSSProperties; /** * Sets additional CSS classes to the Sankey component. */ className?: string; /** * Represents the `dir` attribute of the Sankey component. */ dir?: string; /** * The data of the Sankey component containing the `links` and `nodes` props. */ data: SankeyData; /** * The `links` default props of the Sankey component. * The value will be applied to all links unless overridden by the `links` prop of the `data` prop. */ links?: SankeyLinkDefaults; /** * The `nodes` default props of the Sankey component. * The value will be applied to all nodes unless overridden by the `nodes` prop of the `data` prop. */ nodes?: SankeyNodeDefaults; /** * The `labels` default props of the Sankey component. * The value will be applied to all labels unless overridden by the `nodes` label prop of the `data` prop. */ labels?: SankeyLabelDefaults; /** * The title configuration of the Sankey component. */ title?: SankeyTitle; /** * The legend configuration of the Sankey component. */ legend?: SankeyLegend; /** * The configuration of the Sankey tooltips. */ tooltip?: SankeyTooltip; /** * If set to `true`, the Sankey component will not perform automatic layout. */ disableAutoLayout?: boolean; /** * If set to `true`, the Sankey keyboard navigation will be disabled. */ disableKeyboardNavigation?: boolean; /** * Fires when the mouse pointer enters a node. Similar to the `mouseenter` event. */ onNodeEnter?: (event: SankeyEvent) => void; /** * Fires when the mouse pointer leaves a node. Similar to the `mouseleave` event. */ onNodeLeave?: (event: SankeyEvent) => void; /** * Fires when the mouse pointer enters a link. Similar to the `mouseenter` event, */ onLinkEnter?: (event: SankeyEvent) => void; /** * Fires when the mouse pointer leaves a link. Similar to the `mouseleave` event. */ onLinkLeave?: (event: SankeyEvent) => void; /** * Fires when a node is clicked. */ onNodeClick?: (event: SankeyEvent) => void; /** * Fires when a link is clicked. */ onLinkClick?: (event: SankeyEvent) => void; } /** * Represents the Sankey title options. */ export declare interface SankeyTitle extends Title { } /** * Represents the Sankey tooltip configuration. */ export declare interface SankeyTooltip extends SankeyTooltip_2, TooltipAppendTo { /** * Indicates whether the Sankey tooltips will be rendered. */ visible?: boolean; /** * The distance between the tooltip and the mouse pointer in pixels. * * @default 12 */ offset?: number; /** * The component that will be rendered as the content of the Sankey tooltip when the hovered element is a link. */ linkComponent?: React.ComponentType; /** * The component that will be rendered as the content of the Sankey tooltip when the hovered element is a node. */ nodeComponent?: React.ComponentType; } /** * Represents the props of the Sankey tooltip component. * * @hidden */ export declare interface SankeyTooltipProps extends TooltipAppendTo { /** * The event object of the Sankey tooltip. */ event: SankeyTooltipEvent; /** * The content component of the Sankey tooltip. */ Content: React.ComponentType; /** * The distance between the tooltip and the mouse pointer in pixels. */ offset: number; /** * The `dir` attribute of the Sankey tooltip. */ dir?: string; } /** * Arguments for the `selectEnd` event. */ export declare class SelectEndEvent extends BaseEvent { /** * The target axis options. */ axis: EventAxisOptions; /** * The lower boundary of the selected range. */ from: any; /** * The upper boundary of the selected range. */ to: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `select` event. */ export declare class SelectEvent extends PreventableEvent { /** * The target axis options. */ axis: EventAxisOptions; /** * The lower boundary of the selected range. */ from: any; /** * The upper boundary of the selected range. */ to: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `selectStart` event. */ export declare class SelectStartEvent extends PreventableEvent { /** * The target axis options. */ axis: EventAxisOptions; /** * The lower boundary of the selected range. */ from: any; /** * The upper boundary of the selected range. */ to: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * @hidden */ export declare interface Series { /** * The aggregate function for the date series ([see example]({% slug axes_chart_charts %}#toc-aggregating-data)). The function is used when a category (year, month, or other) contains two or more points. The Chart displays the return value of the function instead of the individual points. * * The supported values are: * - `"avg"`—The average of all values for the date period. * - `"count"`—The number of values for the date period. * - `"max"`—The highest value for the date period. * - `"min"`—The lowest value for the date period. * - `"sum"`—The sum of all values for the date period. Defaults to `0` if no data points are defined. * - `"sumOrNull"`—The sum of all values for the date period. Defaults to `null` if no data points are defined. * - `"first"`—The first value. * - function (values, series, dataItems, category)—A user-defined aggregate function. Returns a single value or a data item. * - object (compound aggregate)—Applicable to the Candlestick, Box Plot, and OHLC series. Specifies the aggregate for each data item field. */ aggregate?: any; /** * The name of the value axis. The axis option is supported for Scatter plots. For more information on Scatter plots, refer to [`xAxis`]({% slug api_charts_chartxaxisitemprops %}) and [`yAxis`]({% slug api_charts_chartyaxisitemprops %}). */ axis?: string; /** * If set to true, the Chart automatically scales down to fit the content area. Applicable for the Pie and Donut series. */ autoFit?: boolean; /** * The border of the Chart series. The border option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"donut"`, `"pie"`, `"bubble"`, `"boxPlot"`, `"candlestick"`, or `"ohlc"`. */ border?: Border; /** * The name of the category axis that will be used for the series. If no [`categoryAxis`]({% slug api_charts_chartcategoryaxisitemprops %}) is specified, the first axis is used. */ categoryAxis?: string; /** * The data item field which contains the category name or date. If the category is a date, the points are rendered in chronological order. */ categoryField?: string; /** * The data field that contains the `close` value. The `closeField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"` or `"ohlc"`. */ closeField?: string; /** * The series base color. * * The supported values are: * - CSS color string, including hex and rgb. * - function (point)—A user-defined function that is evaluated for each point. Returning `undefined` assumes the default series color. */ color?: any; /** * The data item field which contains the series color. The `colorField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"rangeBar"`, `"rangeColumn"`, `"bubble"`, `"donut"`, `"pie"`, `"candlestick"`, `"ohlc"`, or `"waterfall"`. */ colorField?: string; /** * The label connectors options. The connectors option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"` or `"pie"` and [`series.labels.visible`]({% slug api_charts_chartserieslabelsprops %}#toc-visible) is set to `true`. */ connectors?: LabelConnectors; /** * The data item field which contains the current value. The `currentField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bullet"` or `"verticalBullet"`. */ currentField?: string; /** * The dash type of line Chart. The `dashType` option is considered only if the [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) option is set to `"line"`. * * The following dash types are supported: * - `"dash"`—A line consisting of dashes. * - `"dashDot"`—A line consisting of a repeating pattern of dash-dot. * - `"dot"`—A line consisting of dots. * - `"longDash"`—A line consisting of a repeating pattern of long-dash. * - `"longDashDot"`—A line consisting of a repeating pattern of long-dash-dot. * - `"longDashDotDot"`—A line consisting of a repeating pattern of long-dash-dot-dot. * - `"solid"`—A solid line. */ dashType?: DashType; /** * The array of data items which represent the series data. * * You can set it to: * - Array of objects. Each point is bound to the field specified through the [`series.field`]({% slug api_charts_chartseriesitemprops %}#toc-field) option. * - Array of numbers. Supported when the [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) option is set to `"area"`, `"bar"`, `"column"`, `"donut"`, `"pie"`, `"line"`, or `"waterfall"`. * - Array of arrays of numbers. Supported when the [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) option is set to `"bubble"`, `"scatter"`, `"scatterLine"`, `"ohlc"`, `"polar"`, `"rangeBar"`, or `"rangeArea"`. * * The Bubble series need arrays of three values—X value, Y value, and Size value—for example, `[1, 1, 10]`. The Scatter and ScatterLine series need arrays of two values—X value and Y value. The OHLC and Candlestick series need arrays of four values—open, high, low, and close. The RangeBar and RangeArea series need arrays of two values—the from and to value. */ data?: any[]; /** * The series color when the open value is greater than the close value. The `downColor` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"`. */ downColor?: string; /** * The data field which contains the color that is applied when the `open` value is greater than the `close` value. The `downColorField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"`. */ downColorField?: string; /** * The data field which contains the value to use to [drill down]({% slug drilldown_charts %}) into detailed data for the point. */ drilldownField?: string; /** * The `dynamicHeight` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"funnel"` or `"pyramid"`. When set to `false`, all segments become with the same height. Otherwise, the height of each segment is based on its value. */ dynamicHeight?: boolean; /** * The `dynamicSlope` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"funnel"`. When set to `true`, the ratio of the bases of each segment is calculated based on the ratio of `currentDataItem.value`/`nextDataItem.value`. The last element is always created like a rectangle since there is no following element. */ dynamicSlope?: boolean; /** * The data item field which contains the [`series.errorBars`]({% slug api_charts_chartseriesitemprops %}#toc-errorbars) high value ([see example]({% slug errorbars_chart_charts %}#toc-categorical-charts)). The `errorHighField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"line"`, or `"area"`. */ errorHighField?: string; /** * The data item field which contains the [`series.errorBars`]({% slug api_charts_chartseriesitemprops %}#toc-errorbars) low value ([see example]({% slug errorbars_chart_charts %}#toc-categorical-charts)). The `errorLowField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"line"`, or `"area"`. */ errorLowField?: string; /** * The data item field which contains a Boolean value indicating whether the sector is exploded. The `explodeField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"` or `"pie"`. */ explodeField?: string; /** * The data item field which contains the series value. */ field?: string; /** * The name of the parent series of the trendline. * * The `for` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to * "`linearTrendline`", "`exponentialTrendline`", "`logarithmicTrendline`", "`powerTrendline`", "`polynomialTrendline`" or "`movingAverageTrendline`". */ for?: string; /** * The data item field which contains the series from value. */ fromField?: string; /** * The distance between the categories expressed as a percentage of the bar width. See the related spacing setting. The `gap` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"candlestick"`, `"ohlc"`, `"radarColumn"`, or `"waterfall"`. */ gap?: number; /** * The data field which contains the high value. The `highField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"` or `"ohlc"`. */ highField?: string; /** * The diameter of the donut hole in pixels. The `holeSize` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"`. */ holeSize?: number; /** * The Chart line configuration options. The line option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"area"`, `"candlestick"`, `"ohlc"`, or `"waterfall"`. */ line?: SeriesLine; /** * The data field containing the low value. The `lowField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"` or `"ohlc"`. */ lowField?: string; /** * The data item field which contains the series lower value. */ lowerField?: string; /** * The margin around each donut series (ring). A numeric value sets all margins. */ margin?: Margin | number; /** * The maximum size of the Chart bubble series marker. */ maxSize?: number; /** * The data item field which contains the series mean value. */ meanField?: string; /** * The data item field which contains the series median value. */ medianField?: string; /** * The minimum size of the Chart bubble series marker. */ minSize?: number; /** * The behavior for handling missing values. The `missingValues` option is available when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"area"`, `"rangeArea"`, `"line"`, `"scatterLine"`, `"radarLine"`, `"radarArea"`, `"polarLine"`, or `"polarArea"`. * * The supported values are: * - `"gap"`—The plot stops before the missing point and continues after it. * - `"interpolate"`—The value is interpolated from neighboring points. Represents the default value for all series except for the `"area"` and stacked series. Area and stacked series default to `"zero"`. * - `"zero"`—The value is assumed to be zero. */ missingValues?: 'gap' | 'interpolate' | 'zero'; /** * The name of the Chart series which is visible in the legend. */ name?: string; /** * Specifies the top-base/bottom-base ratio of the whole Funnel Chart. If the `neckRatio` is set to `3`, it means the top base is three times smaller than the bottom base. The `neckRatio` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"funnel"` and `dynamicSlope` is set to `false`. */ neckRatio?: number; /** * The color to use for the Bar, Column, or Waterfall series with negative values. Accepts a valid CSS color string, including hex and rgb. */ negativeColor?: string; /** * The options for displaying the Chart negative bubble values. */ negativeValues?: NegativeBubbleValues; /** * The data item field which contains the series note text ([see example]({% slug notes_chart_charts %}#toc-series-notes)). */ noteTextField?: string; /** * The opacity of the series. By default, the series are opaque. */ opacity?: number; /** * The data field which contains the open value. The `openField` option is available when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"` or `"ohlc"`. */ openField?: string; /** * The data item field which contains the series outliers value. */ outliersField?: string; /** * The overlay options of the Chart series. */ overlay?: Overlay; /** * The padding around the Chart (equal on all sides). The padding option is available when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"` or `"pie"`. */ padding?: number; /** * The data item field which contains the series `q1` value. */ q1Field?: string; /** * The data item field which contains the series `q3` value. */ q3Field?: string; /** * The space in pixels between the different segments of the Funnel or Pyramid Chart. The `segmentSpacing` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"funnel"` or `"pyramid"`. */ segmentSpacing?: number; /** * The radius of the Chart Donut series in pixels. If not set, the available space is split evenly between the series. */ size?: number; /** * The data field which contains the bubble size value. */ sizeField?: string; /** * The distance between series points within a category. Expressed as a percentage of the bar width. See the related `gap` setting. The spacing option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"candlestick"`, `"ohlc"`, or `"radarColumn"`. */ spacing?: number; /** * A Boolean value which indicates if the series have to be stacked. A string value is interpreted as [`series.stack.group`]({% slug api_charts_seriesstack %}#toc-group). * * The `stack` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"line"`, `"area"`, `"verticalLine"`, `"verticalArea"`, `"radarLine"`, `"radarArea"`, and `"radarColumn"`. If not overridden, the stack settings of the first series are inherited as a default value by the rest of the series. */ stack?: boolean | string | SeriesStack; /** * The start angle (in degrees) of the first Donut or Pie segment. Angles increase clockwise with zero to the left. Negative values are acceptable. */ startAngle?: number; /** * The `style` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"line"`, `"scatterLine"`, `"radarLine"`, or `"polarLine"`. * * The supported values are: * - `"normal"` (default)—The values are connected with a straight line. * - `"step"`—The values are connected with a right-angled line. * Only available when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"line"`. * - `"smooth"`—The values are connected with a smooth line. * Not supported for stacked area series with missing values. */ style?: LineStyle; /** * The data item field which contains the summary type for the Waterfall series. The value (if any) of a data item marked as a summary point will be discarded. * * Summary columns are optional and can be one of two types: * - `"runningTotal"`—Displays the sum of all items since the last `"runningTotal"` point. * - `"total"`—Displays the sum of all previous items. */ summaryField?: string; /** * The configuration options of the target. The `target` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bullet"` or `"verticalBullet"`. */ target?: BulletTarget; /** * The data item field which contains the series to value. */ toField?: string; /** * The type of the series. * * The supported values are: * - `area` * - `bar` * - `boxPlot` * - `bubble` * - `bullet` * - `candlestick` * - `column` * - `donut` * - `exponentialTrendline` * - `funnel` * - `pyramid` * - `heatmap` * - `horizontalWaterfall` * - `line` * - `linearTrendline` * - `logarithmicTrendline` * - `movingAverageTrendline` * - `ohlc` * - `pie` * - `polarArea` * - `polarLine` * - `polarScatter` * - `polynomialTrendline` * - `powerTrendline` * - `radarArea` * - `radarColumn` * - `radarLine` * - `rangeArea` * - `rangeBar` * - `rangeColumn` * - `scatter` * - `scatterLine` * - `verticalArea` * - `verticalBoxPlot` * - `verticalBullet` * - `verticalLine` * - `verticalRangeArea` * - `waterfall` */ type?: SeriesType; /** * The data item field which contains the series upper value. */ upperField?: string; /** * Sets the visible property of a Chart series. */ visible?: boolean; /** * A value which indicates whether to show the point category (for Funnel, Pyramid, Donut, and Pie series) or the series name (for other available series types) in the legend. */ visibleInLegend?: boolean; /** * The data item field which indicates whether to show the point category name in the legend. The `visibleInLegendField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"funnel"`, `"pyramid"`, `"donut"`, or `"pie"`. */ visibleInLegendField?: string; /** * A function that can be used to create a custom visual for the points. Applicable for the Bar, Column, Pie, Donut, Funnel, Pyramid, Range Bar, Range Column, and Waterfall series. * * The available argument fields are: * * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `options`—The point options. * - `createVisual`—A function that can be used to get the default visual. * - `category`—The point category. * - `dataItem`—The point `dataItem`. * - `value`—The point value. * - `stackValue`—The cumulative point value on the stack. Available only for the stackable series. * - `sender`—The Chart instance. * - `series`—The point series. * - `percentage`—The point value represented as a percentage value. Available only for the Donut, Pie, and 100% Stacked Charts. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. * - `radius`—The segment radius. Available for the Donut and Pie series. * - `innerRadius`—The segment inner radius. Available for the Donut series. * - `startAngle`—The segment start angle. Available for the Donut and Pie series. * - `endAngle`—The segment end angle. Available for the Donut and Pie series. * - `center`—The segment center point. Available for the Donut and Pie series. * - `points`—The segment points. Available for the Funnel and Pyramid series. */ visual?: (e: SeriesVisualArgs) => drawing.Element; /** * The line width. The `width` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"line"`, `"scatterLine"`, `"radarLine"`, or `"polarLine"`. */ width?: number; /** * The name of the X axis. The [`xAxis`]({% slug api_charts_chartxaxisitemprops %}) option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bubble"`, `"scatter"`, `"scatterLine"`, or `"polar"` series. For the Polar series, the [`xAxis`]({% slug api_charts_chartxaxisitemprops %}) range is expressed in degrees. */ xAxis?: string; /** * The data item field which contains the [`series.errorBars`]({% slug api_charts_chartseriesitemprops %}#toc-errorbars) xAxis high value ([see example]({% slug errorbars_chart_charts %}#toc-scatter-charts)). The `xErrorHighField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"scatter"``, `"scatterLine"`, or `"bubble"`. */ xErrorHighField?: string; /** * The data item field which contains the [`series.errorBars`]({% slug api_charts_chartseriesitemprops %}#toc-errorbars) xAxis low value ([see example]({% slug errorbars_chart_charts %}#toc-scatter-charts)). The `xErrorLowField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"scatter"`, `"scatterLine"`, or `"bubble"`. */ xErrorLowField?: string; /** * The data item field containing the x value. The `xField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bubble"`, `"scatter"`, `"scatterLine"`, or `"polar"` series. */ xField?: string; /** * The name of the Y axis to use. Available for the Bubble, Scatter, Scatter Line, and Polar series. */ yAxis?: string; /** * The data item field which contains the [`series.errorBars`]({% slug api_charts_chartseriesitemprops %}#toc-errorbars) yAxis high value ([see example]({% slug errorbars_chart_charts %}#toc-scatter-charts)). The `yErrorHighField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"scatter"`, `"scatterLine"`, or `"bubble"`. */ yErrorHighField?: string; /** * The data item field which contains the [`series.errorBars`]({% slug api_charts_chartseriesitemprops %}#toc-errorbars) yAxis low value ([see example]({% slug errorbars_chart_charts %}#toc-scatter-charts)). The `yErrorLowField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"scatter"`, `"scatterLine"`, or `"bubble"`. */ yErrorLowField?: string; /** * The data item field containing the y value. The `yField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bubble"`, `"scatter"`, or `"scatterLine"`. */ yField?: string; /** * An optional Z-index that can be used to change the default stacking order of series. The series with the highest Z-index are placed on top. Series with no Z-index use the default stacking order based on the series type. For example, Line series will be on top with the Bar and Area following after. */ zIndex?: number; /** * The error bars of the Chart series. The `errorBars` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"line"`, `"area"`, `"scatter"`, `"scatterLine"`, or `"bubble"`. */ errorBars?: SeriesErrorBars; /** * The configuration of the Chart series extremes. Applies to extreme outliers. For more information, refer to [`series.outliers`]({% slug api_charts_chartseriesitemprops %}#toc-outliers). */ extremes?: SeriesExtremes; /** * The configuration of the Chart series highlight. */ highlight?: SeriesHighlight; /** * The configuration of the Chart series label. The Chart displays the series labels when the [`series.labels.visible`]({% slug api_charts_chartserieslabelsprops %}#toc-visible) option is set to `true`. */ labels?: SeriesLabels; /** * The configuration of the Chart series marker. The Chart displays the series markers when the [`series.markers.visible`]({% slug api_charts_chartseriesmarkersprops %}#toc-visible) option is set to `true`. The markers option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"area"`, `"rangeArea"`, `"line"`, `"scatter"`, `"scatterLine"`, `"radarLine"`, `"radarArea"`, `"polarLine"`, `"polarScatter"`, or `"polarArea"`. */ markers?: SeriesMarkers; /** * The configuration of the Chart legend item. * By default, the Legend item type and markers are inherited from the series. */ legendItem?: LegendItem; /** * The configuration of the series notes. */ notes?: SeriesNotes; /** * The configuration of the Chart series outliers. Applies to mild outliers. For more information, refer to [`series.extremes`]({% slug api_charts_chartseriesitemprops %}#toc-extremes). */ outliers?: SeriesOutliers; /** * The configuration options of the Chart series tooltip. */ tooltip?: SeriesTooltip_2; /** * The configuration options of the series trendlines. * * The `trendline` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to * "`linearTrendline`", "`exponentialTrendline`", "`logarithmicTrendline`", "`powerTrendline`", "`polynomialTrendline`" or "`movingAverageTrendline`". */ trendline?: SeriesTrendline; /** * The configuration options of the series pattern. */ pattern?: SeriesPattern | ((point: any) => SeriesPattern); /** * The data item field which contains the series pattern. * The `patternField` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"pie"`, `"donut"`, `"funnel"`, `"heatmap"`, or `"pyramid"`. */ patternField?: string; } /** * Arguments for the `seriesClick` event. */ export declare class SeriesClickEvent extends BaseEvent { /** * The data point category. */ category: any; /** * The original data item. */ dataItem: any; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. */ percentage: number; /** * The clicked series point. */ point: SeriesPointType; /** * The clicked point series options. */ series: EventSeriesOptions; /** * The cumulative point value on the stack. Available only for the stackable series. */ stackValue: number; /** * The data point value. */ value: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * @hidden */ export declare interface SeriesDefaults { /** * The border of the series. */ border?: Border; /** * The distance between category clusters. */ gap?: number; /** * The Chart series overlay options. */ overlay?: Overlay; /** * The space between the Chart series as a proportion of the series width. The `spacing` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"candlestick"`, `"ohlc"`, and `"waterfall"`. */ spacing?: number; /** * A Boolean value which indicates if the series has to be stacked. The stack option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"line"`, `"area"`, `"verticalLine"`, `"verticalArea"`, `"radarLine"`, `"radarArea"`, and `"radarColumn"`. */ stack?: boolean | string | SeriesStack; /** * The default type of the series. * * The supported values are: * - `area` * - `bar` * - `bubble` * - `bullet` * - `candlestick` * - `column` * - `donut` * - `funnel` * - `pyramid` * - `line` * - `ohlc` * - `pie` * - `polarArea` * - `polarLine` * - `polarScatter` * - `radarArea` * - `radarColumn` * - `radarLine` * - `rangeArea` * - `rangeBar` * - `rangeColumn` * - `scatter` * - `scatterLine` * - `waterfall` * - `verticalArea` * - `verticalBullet` * - `verticalLine` * - `verticalRangeArea` * - `waterfall` */ type?: SeriesType; /** * A function for creating custom visuals for the points. Applicable for the Bar and Column series. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `options`—The point options. * - `createVisual`—A function that can be used to get the default visual. * - `category`—The point category. * - `dataItem`—The point `dataItem`. * - `value`—The point value. * - `sender`—The Chart instance. * - `series`—The point series. */ visual?: (e: SeriesVisualArgs) => drawing.Element; /** * The label configuration of the Chart series. The Chart displays the series labels when the [`seriesDefaults.labels.visible`]({% slug api_charts_chartseriesdefaultslabelsprops %}#toc-visible) option is set to `true`. */ labels?: SeriesDefaultsLabels; /** * The `seriesDefaults` notes configuration. */ notes?: SeriesDefaultsNotes; /** * The configuration options of the Chart series tooltip. */ tooltip?: SeriesDefaultsTooltip; /** * The focus highlight configuration options. */ focusHighlight?: FocusHighlight; } /** * @hidden */ export declare interface SeriesDefaultsLabels { /** * 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 Chart series labels content. You can split the text into multiple lines by using line feed characters (`"\n"`). * * The available fields in the function argument are: * - `category`—The category name. Available for the Area, Bar, Column, Bubble, Donut, Funnel, Pyramid, Line, and Pie series. * - `dataItem`—The original data item used to construct the point. If binding to an array, it will be `null`. * - `percentage`—The point value represented as a percentage value. Available for the Donut, Funnel, Pyramid and Pie series. * - `series`—The data series. * - `value`—The point value. Can be a number or object containing each bound field. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. */ content?: (e: any) => string; /** * The font style of the labels. */ font?: string; /** * The format of the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. */ format?: string; /** * The margin of the labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the labels. A numeric value sets all margins. */ padding?: Padding | number; /** * If set to `true`, the Chart displays the series labels. By default, the Chart series labels are not displayed. */ visible?: boolean; /** * A function that can be used to create a custom visual for the labels. * * The available argument fields are: * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (might be `undefined`). * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. */ visual?: (e: SeriesLabelsVisualArgs) => drawing.Element; /** * The Chart series `from` label configuration. The Chart displays the series labels when either the [`seriesDefaults.labels.visible`]({% slug api_charts_chartseriesdefaultslabelsprops %}#toc-visible) or the [`seriesDefaults.labels.from.visible`]({% slug api_charts_chartseriesdefaultslabelsfromprops %}#toc-visible) option is set to `true`. */ from?: SeriesDefaultsLabelsFrom; /** * The Chart series `to` label configuration. The Chart displays the series labels when either the [`seriesDefaults.labels.visible`]({% slug api_charts_chartseriesdefaultslabelsprops %}#toc-visible) or the [`seriesDefaults.labels.to.visible`]({% slug api_charts_chartseriesdefaultslabelstoprops %}#toc-visible) option is set to `true`. */ to?: SeriesDefaultsLabelsTo; } /** * @hidden */ export declare interface SeriesDefaultsLabelsFrom { /** * The background color of the `from` labels. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the `from` labels. */ border?: Border; /** * The text color of the `from` labels. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The function which returns the `from` label content of the Chart series. You can split the text into multiple lines by using line feed characters (`"\n"`). * * The available fields in the function argument are: * - `category`—The category name. Available for the Area, Bar, Column, Bubble, Donut, Funnel, Pyramid, Line, and Pie series. * - `dataItem`—The original data item used to construct the point. If binding to an array, it will be `null`. * - `percentage`—The point value represented as a percentage value. Available for the Donut, Funnel, Pyramid and Pie series. * - `series`—The data series. * - `value`—The point value. Can be a number or object which contain each bound field. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. */ content?: (e: any) => string; /** * The font style of the from labels. */ font?: string; /** * The format of the `from` labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) of IntlService. */ format?: string; /** * The margin of the `from` labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the `from` labels. A numeric value sets all paddings. */ padding?: Padding | number; /** * If set to `true`, the Chart displays the series `from` labels. By default, the Chart series from labels are not displayed. */ visible?: boolean; } /** * @hidden */ export declare interface SeriesDefaultsLabelsTo { /** * The background color of `to` lables. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of `to` labels. */ border?: Border; /** * The text color of `to` labels. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The function which returns the `from` label content of the Chart series. You can split the text into multiple lines by using the line feed characters (`"\n"`). * * The available fields in the function argument are: * - `category`—The category name. Available for the Area, Bar, Column, Bubble, Donut, Funnel, Pyramid, Line, and Pie series. * - `dataItem`—The original data item used to construct the point. If binding to an array, it will be `null`. * - `percentage`—The point value represented as a percentage value. Available for the Donut, Funnel, Pyramid and Pie series. * - `series`—The data series. * - `value`—The point value. Can be a number or object containing each bound field. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. */ content?: (e: any) => string; /** * The font style of the `to` labels. */ font?: string; /** * The format of the `to` labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. */ format?: string; /** * The margin of the `to` labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the `to` labels. A numeric value sets all paddings. */ padding?: Padding | number; /** * If set to `true`, the Chart displays the `to` labels of the series. By default, the `to` labels of the Chart series are not displayed. */ visible?: boolean; } /** * @hidden */ export declare interface SeriesDefaultsNotes { /** * The line of the notes. */ line?: NoteLine; /** * A function for creating a custom visual for the notes. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect. * - `options`—The note options. * - `createVisual`—A function for getting the default visual. * - `category`—The category of the note point. * - `dataItem`—The `dataItem` of the note point. * - `value`—The value of the note point. * - `sender`—The Chart instance. * - `series`—The series of the note point. * - `text`—The note text. */ visual?: (e: SeriesNoteVisualArgs) => drawing.Element; /** * The icon of the notes. */ icon?: SeriesDefaultsNotesIcon; /** * The label of the notes. */ label?: SeriesDefaultsNotesLabel; } /** * @hidden */ export declare interface SeriesDefaultsNotesIcon { /** * The background color of the notes icon. */ background?: string; /** * The border of the notes icon. */ border?: Border; /** * The size of the notes icon. */ size?: number; /** * The shape of the notes icon. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; /** * The visibility of the notes icon. */ visible?: boolean; } /** * @hidden */ export declare interface SeriesDefaultsNotesLabel { /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The text color of the label. 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 which defines the point value. You can split the text into multiple lines by using line feed characters (`"\n"`). */ content?: (e: any) => string; /** * The font style of the label. */ font?: string; /** * The format for displaying the notes label. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the axis value. */ format?: string; /** * The position of the labels. * * The available options are: * - `"inside"`—The label is positioned inside the icon. * - `"outside"`—The label is positioned outside the icon. */ position?: NoteLabelPosition; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * If set to `true`, the Chart displays the [`seriesDefaults`]({% slug api_charts_chartseriesdefaultsprops %}) notes label. By default, the [`seriesDefaults`]({% slug api_charts_chartseriesdefaultsprops %}) notes label is visible. */ visible?: boolean; } /** * @hidden */ export declare interface SeriesDefaultsTooltip { /** * The background color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border configuration options. */ border?: Border; /** * The text color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The tooltip font. */ font?: string; /** * The format of the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. * * The available format placeholders are: * - Area, Bar, Column, Funnel, Line, and Pie: {0} - value. * - Bubble: {0} - x value{1} - y value{2} - size value{3} - category name. * - Scatter and Scatter Line: {0} - x value, {1} - y value. * - Candlestick and OHLC: {0} - open value, {1} - high value, {2} - low value, {3} - close value, {4} - category name. * - RangeArea, rangeBar, rangeColumn: {0} - from value, {1} - to value. */ format?: string; /** * The padding of the tooltip. A numeric value sets all paddings. */ padding?: Padding | number; /** * If set to `true`, the Chart displays the series tooltip. By default, the series tooltip is not displayed. */ visible?: boolean; } /** * @hidden */ export declare interface SeriesErrorBars { /** * The color of the error bars. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * If set to `false`, the caps of the error bars are not displayed. By default, the caps are visible. */ endCaps?: boolean; /** * The error bars line options. */ line?: ErrorBarLine; /** * The error bars value ([see example]({% slug errorbars_chart_charts %}#toc-calculating-values-based-on-data)). The value option is supported when [series.type]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bar"`, `"column"`, `"line"`, or `"area"`. * * The following value types are supported: * - `"stderr"`—The standard error of the series values will be used to calculate the point low and high values. * - `"stddev(n)"`—The standard deviation of the series values will be used to calculate the point low and high values. Between the parentheses, a number can be specified that will be multiplied by the calculated standard deviation. * - `"percentage(n)"`—A percentage of the point value. * - A number that will be subtracted or added to the point value. * - An array that holds the low and high difference from the point value. * - A function that returns the `errorBars` point value. */ value?: string | number | any[] | ((data: { value: number; }) => string | number | any[]); /** * A function that for creating custom visuals for the error bars. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `options`—The error bar options. * - `createVisual`—A function that can be used to get the default visual. * - `low`—The error bar low value. * - `high`—The error bar high value. * - `sender`—The Chart instance. */ visual?: (e: ErrorBarsVisualArgs) => drawing.Element; /** * The value of the [`xAxis`]({% slug api_charts_chartxaxisitemprops %}) error bars ([see example]({% slug errorbars_chart_charts %}#toc-calculating-values-based-on-data)). * * For a list of the supported value types, refer to the [`series.errorBars.value`]({% slug api_charts_chartserieserrorbarsprops %}#toc-value) option. The `xValue` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"scatter"`, `"scatterLine"`, or `"bubble"`. */ xValue?: string; /** * The value of the [`yAxis`]({% slug api_charts_chartyaxisitemprops %}) error bars ([see example]({% slug errorbars_chart_charts %}#toc-calculating-values-based-on-data)). * * For a list of supported value types, refer to the [`series.errorBars.value`]({% slug api_charts_chartserieserrorbarsprops %}#toc-value) option. The `yValue` option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"scatter"`, `"scatterLine"`, or `"bubble"`. */ yValue?: string; } /** * @hidden */ export declare interface SeriesExtremes { /** * The background color of the series extremes. */ background?: string; /** * The border of the extremes. */ border?: Border; /** * The rotation angle of the extremes. */ rotation?: number; /** * The extremes size in pixels. */ size?: number; /** * The shape of the series extremes. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; } /** * @hidden */ export declare interface SeriesHighlight { /** * The border of the highlighted Chart series. * * The color is computed automatically from the base point color. The border option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"`, `"bubble"`, `"pie"`, `"candlestick"`, or `"ohlc"`. */ border?: Border; /** * The highlight color. Accepts a valid CSS color string, including hex and rgb. The color option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"` or `"pie"`. */ color?: string; /** * The line of the highlighted Chart series. The color is computed automatically from the base point color. The line option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"candlestick"` or `"ohlc"`. */ line?: HighlightLine; /** * The opacity of the highlighted points. The opacity option is supported when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"bubble"`, `"pie"`, or `"donut"`. */ opacity?: number; /** * The opacity of the series when another series is highlighted. */ inactiveOpacity?: number | string; /** * A function for handling the toggling of the points highlight. * * The available argument fields are: * - `preventDefault`—A function that can be used to prevent the showing of the default highlight overlay. * - `show`—A Boolean value indicating whether the highlight has to be shown. * - `visual`—The visual element that needs to be highlighted. * - `category`—The point category. * - `dataItem`—The point `dataItem`. * - `value`—The point value. * - `series`—The point series. */ toggle?: (e: HighlightToggleArgs) => void; /** * If set to `true`, the Chart highlights the series when the user hovers over it with the mouse. By default, the highlighting of the Chart series is enabled. */ visible?: boolean; /** * A function for setting custom visuals for the point highlights. * * The available argument fields are: * - `createVisual`—A function that can be used to get the default highlight visual. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `visual`—The visual element that needs to be highlighted. * - `options`—The point options. * - `category`—The point category. * - `dataItem`—The point `dataItem`. * - `value`—The point value. * - `sender`—The Chart instance. * - `series`—The point series. * - `stackValue`—The cumulative point value on the stack. Available only for the stackable series. * - `percentage`—The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. * - `from`—The `from` point highlight visual options. Available for the RangeArea and VerticalRangeArea series. * - `to`—The `to` point highlight visual options. Available for the RangeArea and VerticalRangeArea series. */ visual?: (e: HighlightVisualArgs) => drawing.Element; } /** * Arguments for the `seriesHover` event. */ export declare class SeriesHoverEvent extends PreventableEvent { /** * The data point category. */ category: any; /** * A list of all points that are in the same category. Each item has the same fields—`value`, `series`, `dataItem`, and other. */ categoryPoints: any[]; /** * The original data item. */ dataItem: any; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. */ percentage: number; /** * The hovered series point. */ point: SeriesPointType; /** * The hovered point series options. */ series: EventSeriesOptions; /** * The cumulative point value on the stack. Available only for the stackable series. */ stackValue: number; /** * The data point value. */ value: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * @hidden */ export declare interface SeriesLabels { /** * The alignment of the label when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"`, `"funnel"`, `"pyramid"` or `"pie"`. * * The supported values for `"donut"` and `"pie"` are: * - `"circle"`—The labels are positioned in circle around the Chart. * - `"column"`—The labels are positioned in columns to the left and right of the Chart. * * The supported values for `"funnel"` and `"pyramid"` are: * - `"center"`—The labels are positioned in the center over the funnel segment. * - `"right"`—The labels are positioned on the right side of the Chart and, if there is enough space, do not overlap the funnel segments. * - `"left"`—The labels are positioned on the left side of the Chart and, if there is enough space, do not overlap the funnel segments. */ align?: 'circle' | 'column' | 'center' | 'right' | 'left'; /** * 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 Chart series label content. You can split the text into multiple lines by using line feed characters (`"\n"`). * * The fields available in the function argument are: * * - `category`—The category name. Available for the Area, Bar, Column, Bubble, Donut, Line, Pie, and Waterfall series. * - `dataItem`—The original data item used to construct the point. If binding to an array, it will be `null`. * - `percentage`—The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. * - `series`—The data series. * - `stackValue`—The cumulative point value on the stack. Available only for the stackable series. * - `value`—The point value. Can be a number or object containing each bound field. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. */ content?: (e: any) => string; /** * The distance between the labels when [`series.type`]({% slug api_charts_chartseriesitemprops %}#toc-type) is set to `"donut"` or `"pie"`. */ distance?: number; /** * The font style of the labels. */ font?: string; /** * The format of the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. */ format?: string; /** * The margin of the labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the labels. A numeric value sets all paddings. Bar and Column series always apply full padding and ignore this setting. */ padding?: Padding | number; /** * The position of the labels. */ position?: SeriesLabelsPosition; /** * If set to `true`, the Chart displays the series labels. By default, the Chart series labels are not displayed. */ visible?: boolean; /** * A function that can be used to create a custom visual for the labels. * * The available argument fields are: * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. * - `sender`—The Chart instance (might be `undefined`). */ visual?: (e: SeriesLabelsVisualArgs) => drawing.Element; /** * The `from` label configuration of the Chart series. The Chart displays the series from labels when either the [`series.labels.visible`]({% slug api_charts_chartserieslabelsprops %}#toc-visible) or the [`series.labels.from.visible`]({% slug api_charts_chartseriesdefaultslabelsfromprops %}#toc-visible) option is set to `true`. */ from?: SeriesLabelsFrom; /** * The `to` label configuration of the Chart series. The Chart displays the series to labels when either the [`series.labels.visible`]({% slug api_charts_chartserieslabelsprops %}#toc-visible) or the [`series.labels.to.visible`]({% slug api_charts_chartserieslabelstoprops %}#toc-visible) option is set to `true`. */ to?: SeriesLabelsTo; } /** * @hidden */ export declare interface SeriesLabelsFrom { /** * The background color of the `from` labels. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the `from` labels. */ border?: Border; /** * The text color of the `from` labels. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The function which returns the Chart series `from` label content. * * The fields available in the function argument are: * - `category`—The category name. Available for the Area, Bar, Column, Bubble, Donut, Line, Pie, and Waterfall series. * - `dataItem`—The original data item used to construct the point. If binding to an array, it will be `null`. * - `percentage`—The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. * - `series`—The data series. * - `value`—The point value. Can be a number or object containing each bound field. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. * * The text can be split into multiple lines by using the line feed characters (`"\n"`). */ content?: (e: any) => string; /** * The font style of the `from` labels. */ font?: string; /** * The format of the `from` labels. Uses the IntlService [`format`]({% slug api_intl_intlservice %}#toc-format) method. */ format?: string; /** * The margin of the `from` labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the `from` labels. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the `from` labels. * * The supported values are: * - `"center"`—The label is positioned at the point center. * - `"insideBase"`—The label is positioned inside, near the base of the bar. * - `"insideEnd"`—The label is positioned inside, near the end of the point. * - `"outsideEnd"`—The label is positioned outside, near the end of the point. * - `"above"`—the label is positioned at the top of the marker. Applicable for `"rangeArea"` and `"verticalRangeArea"` series. * - `"below"`—the label is positioned at the bottom of the marker. Applicable for `"rangeArea"` and `"verticalRangeArea"` series. * - `"left"`—the label is positioned to the left of the marker. Applicable for `"rangeArea"` and `"verticalRangeArea"` series. * - `"right"`—the label is positioned to the right of the marker. Applicable for `"rangeArea"` and `"verticalRangeArea"` series. */ position?: 'center' | 'insideBase' | 'insideEnd' | 'outsideEnd'; /** * If set to `true`, the Chart displays the series `from` labels. By default, the Chart series `from` labels are not displayed. */ visible?: boolean; } /** * Configures the position of the series labels. * * - `"above"`—The label is positioned at the top of the marker. Applicable for series that render points, including the Bubble series. * - `"below"`—The label is positioned at the bottom of the marker. Applicable for series that render points, including the Bubble series. * - `"center"`—The label is positioned at the point center. Applicable for the Bar, Column, Donut, Pie, Funnel, Pyramid, RadarColumn, and Waterfall series. * - `"insideBase"`—The label is positioned inside, near the base of the bar. Applicable for the Bar, Column, and Waterfall series. * - `"insideEnd"`—The label is positioned inside, near the end of the point. Applicable for the Bar, Column, Donut, Pie, RadarColumn, and Waterfall series. * - `"left"`—The label is positioned to the left of the marker. Applicable for series that render points, including the Bubble series. * - `"outsideEnd"`—The label is positioned outside, near the end of the point. Applicable for the Bar, Column, Donut, Pie, RadarColumn, and Waterfall series. Not applicable for stacked series. * - `"right"`—The label is positioned to the right of the marker. Applicable for series that render points, including the Bubble series. * - `"top"`—The label is positioned at the top of the segment. Applicable for the Funnel and Pyramid series. * - `"bottom"`—The label is positioned at the bottom of the segment. Applicable for the Funnel and Pyramid series. * - `"auto"`—The from and to labels are positioned at the top or bottom (for the RangeArea series), or to the left or right (for the VerticalRangeArea series), so that they are outside the filled area. Applicable for the RangeArea and VerticalRangeArea series. */ export declare type SeriesLabelsPosition = 'auto' | 'above' | 'below' | 'center' | 'insideBase' | 'insideEnd' | 'left' | 'outsideEnd' | 'right' | 'top' | 'bottom'; /** * @hidden */ export declare interface SeriesLabelsTo { /** * The background color of the `to` labels. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the `to` labels. */ border?: Border; /** * The text color of the `to` labels. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The function which returns the Chart series `to` label content. You can split the text into multiple lines by using line feed characters (`"\n"`). * * The fields available in the function argument are: * - `category`—The category name. Available for the Area, Bar, Column, Bubble, Donut, Line, Pie, and Waterfall series. * - `dataItem`—The original data item used to construct the point. If binding to an array, it will be `null`. * - `percentage`—The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. * - `series`—The data series. * - `value`—The point value. Can be a number or object containing each bound field. * - `runningTotal`—The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. * - `total`—The sum of all previous series values. Available for the Waterfall series. */ content?: (e: any) => string; /** * The font style of the `to` labels. */ font?: string; /** * The format of the `to` labels. Uses [IntlService format]({% slug api_intl_intlservice %}#toc-format). */ format?: string; /** * The margin of the `to` labels. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the `to` labels. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the `to` labels. * * The available options are: * - `"center"`—The label is positioned at the point center. * - `"insideBase"`—The label is positioned inside, near the base of the bar. * - `"insideEnd"`—The label is positioned inside, near the end of the point. * - `"outsideEnd"`—The label is positioned outside, near the end of the point. * - `"above"`—The label is positioned at the top of the marker. Applicable for the RangeArea and VerticalRangeArea series. * - `"below"`—The label is positioned at the bottom of the marker. Applicable for the RangeArea and VerticalRangeArea series. * - `"left"`—The label is positioned to the left of the marker. Applicable for the RangeArea and VerticalRangeArea series. * - `"right"`—The label is positioned to the right of the marker. Applicable for the RangeArea and VerticalRangeArea series. */ position?: 'center' | 'insideBase' | 'insideEnd' | 'outsideEnd'; /** * If set to `true`, the Chart displays the series `to` labels. By default, the Chart series `to` labels are not displayed. */ visible?: boolean; } /** * The context for the series label visual function. */ export declare interface SeriesLabelsVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The options of the label. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The text of the label. */ text: string; } /** * The appearance settings for the line of the Area, Candlestick, OHLC, and Waterfall series. */ export declare interface SeriesLine { /** * The color of the line. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The line opacity. By default, the line is opaque (`opacity = 1`). */ opacity?: number; /** * The drawing style of the line. Applicable for the Area, Range Area, Polar Area, and Radar Area series. * * The supported values are: * * `"normal" (default)`—The values are connected with a straight line. * * `"step"`—The values are connected with a right-angled line. Supported only for the Area and Range Area series. * * `"smooth"`—The values are connected with a smooth line. */ style?: LineStyle; /** * The line width in pixels. * By default, the width is set to `0` and the line is not visible. */ width?: number; } /** * @hidden */ export declare interface SeriesMarkers { /** * The background color of the series markers. */ background?: string; /** * The border of the markers. */ border?: Border; /** * The rotation angle of the markers. */ rotation?: number; /** * The marker size in pixels. */ size?: number; /** * The border radius in pixels when `type` is set to `"roundedRect"`. Defaults to 1/5 of the marker size. */ borderRadius?: number; /** * The shape of the series markers. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. * * `"rect"`—An alias for "square". * * `"roundedRect"`—The marker shape is a rounded rectangle. */ type?: MarkerType; /** * If set to `true`, the Chart displays the series markers. By default, the Chart series markers are displayed. */ visible?: boolean; /** * A function for creating a custom visual for the markers. * * The available argument fields are: * - `rect`—The [geometry Rect]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `options`—The marker options. * - `createVisual`—A function that can be used to get the default visual. * - `category`—The category of the marker point. * - `dataItem`—The `dataItem` of the marker point. * - `value`—The value of the marker point. * - `sender`—The Chart instance. * - `series`—The series of the marker point. */ visual?: (e: MarkersVisualArgs) => drawing.Element; /** * The Chart series marker configuration for the `from` point. Supported for the RangeArea and VerticalRangeArea series. */ from?: SeriesMarkers; /** * The Chart series marker configuration for the `to` point. Supported for the RangeArea and VerticalRangeArea series. */ to?: SeriesMarkers; } /** * @hidden */ export declare interface SeriesNotes { /** * The line of the series notes. */ line?: NoteLine; /** * The position of the series note. * * The available options are: * - `"top"`—The note is positioned on the top. * - `"bottom"`—The note is positioned on the bottom. * - `"left"`—The note is positioned on the left. * - `"right"`—The note is positioned on the right. */ position?: NotePosition; /** * A function for creating a custom visual for the notes. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect. * - `options`—The note options. * - `createVisual`—A function that can be used to get the default visual. * - `category`—The category of the note point. * - `dataItem`—The `dataItem` of the note point. * - `value`—The value of the note point. * - `sender`—The Chart instance. * - `series`—The series of the note point. * - `text`—The note text. */ visual?: (e: SeriesNoteVisualArgs) => drawing.Element; /** * The icon of the notes. */ icon?: SeriesNotesIcon; /** * The label of the notes. */ label?: SeriesNotesLabel; } /** * @hidden */ export declare interface SeriesNotesIcon { /** * The background color of the notes icon. */ background?: string; /** * The border of the notes icon. */ border?: Border; /** * The size of the notes icon. */ size?: number; /** * The icon shape. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; /** * The visibility of the notes icon. */ visible?: boolean; } /** * @hidden */ export declare interface SeriesNotesLabel { /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The text color of the label. 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 which defines the point value. You can split the text into multiple lines by using line feed characters (`"\n"`). */ content?: (e: any) => string; /** * The font style of the label. */ font?: string; /** * The format for displaying the notes label. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the axis value. */ format?: string; /** * The position of the labels. * * The available options are: * - `"inside"`—The label is positioned inside the icon. * - `"outside"`—The label is positioned outside the icon. */ position?: NoteLabelPosition; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * If set to `true`, the Chart displays the series notes label. By default, the series notes label is visible. */ visible?: boolean; } /** * The context for the point highlight visual function. */ export declare interface SeriesNoteVisualArgs { /** * The point category. */ category: any; /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The point data item. */ dataItem: any; /** * The options of the note. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The point series. */ series: any; /** * The value of the point. */ value: string; /** * The text of the note. */ text: string; } /** * @hidden */ export declare interface SeriesOutliers { /** * The background color of the series outliers. */ background?: string; /** * The border of the outliers. */ border?: Border; /** * The rotation angle of the outliers. */ rotation?: number; /** * The marker size in pixels. */ size?: number; /** * The outliers shape. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; } export { SeriesPattern } /** * A series point. */ export declare interface SeriesPointType { /** * The point category value. Available only for the Categorical points (Bar, Line, and other). */ category?: string | Date | number; /** * The point `dataItem`. */ dataItem?: any; /** * The point options. */ options?: any; /** * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% Stacked chart points. */ percentage?: number; /** * The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series points. */ runningTotal?: number; /** * The sum of all previous series values. Available for the Waterfall series points. */ total?: number; /** * The point value. */ value?: any; /** * The Drawing element used to draw the point. */ visual?: drawing.Element; } /** * Configures the Stacked series. */ export declare interface SeriesStack { /** * The optional stack group name. The `group` option is supported for the Bar and Column series. */ group?: string; /** * The type of stack to plot. * * The supported types are: * * `"normal"`—The value of the stack is the sum of all points in the category (or group). * * `"100%"`—The value of the stack is always 100% (1.00). Points within the category (or group) are represented in percentage. */ type?: 'normal' | '100%'; } /** * @hidden */ export declare class SeriesTooltip extends React_2.Component<{}, SeriesTooltipState> { static contextType: React_2.Context; context: React_2.ContextType; readonly state: SeriesTooltipState; chartObserver: InstanceObserver | null; componentDidMount(): void; render(): JSX.Element; componentWillUnmount(): void; onShowTooltip(e: any): void; onHideTooltip(): void; createSharedTooltipContext(e: any): SharedTooltipContext; createTooltipContext(e: any): TooltipContext; findRenderFunctionByIndex(seriesIdx: number): any; findRenderFunction(): any; } /** * @hidden */ declare interface SeriesTooltip_2 { /** * The background color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border configuration options. */ border?: Border; /** * The text color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font of the tooltip. */ font?: string; /** * The format of the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. * * The available format placeholders are: * - Area, Bar, Column, Line, Funnel, Pyramid, Pie, radarArea, radarColumn and radarLine: {0} - value. * - Bubble: {0} - x value, {1} - y value, {2} - size value, {3} - category name. * - Scatter, scatterLine: {0} - x value, {1} - y value. * - PolarArea, polarLine and polarScatterL: {0} - x value (degrees), {1} - y value. * - Candlestick and OHLC: {0} - open value, {1} - high value, {2} - low value, {3} - close value, {4} - category name. * - RangeArea, rangeBar, rangeColumn: {0} - from value, {1} - to value. */ format?: string; /** * The padding of the tooltip. A numeric value sets all paddings. */ padding?: Padding | number; /** * If set to `true`, the Chart displays the series tooltip. By default, the series tooltip is not displayed. */ visible?: boolean; } /** * @hidden */ declare interface SeriesTooltipState { className?: string | undefined; popupShown: boolean; popupAlign?: Align; popupOffset?: Offset; popupStyles?: any; popupContext?: TooltipContext | SharedTooltipContext; shared?: boolean; } /** * The configuration options of the series trendlines. */ export declare interface SeriesTrendline { /** * The trendline forecast settings. By default, the trendline does not display a forecast. * * The forecast setting is supported for Linear Trendlines on date and scatter series. */ forecast?: TrendlineForecast; /** * The number of intervals to take when calculating averages. The value should be an integer greater than 2. * * The period setting is supported only for Moving Average trendlines. */ period?: number; /** * The order (degree) of the Polynomial trendline. The default value is 2. * * Accepted values are from 2 to 6: * * 2: a Quadratic polynomial trendline with a single extreme point (minimum or maximum) point. * * 3: a Cubic polynomial trendline with up to 2 extreme points. * * 4: a polynomial trendline of 4th degree with up to 3 extreme points. * * 5: a polynomial trendline of 5th degree with up to 4 extreme points. * * 6: a polynomial trendline of 6th degree with up to 5 extreme points. * */ order?: number; } /** * The series type. * * The supported values are: * - `"area"`—Displays the data as continuous lines that show trends over time, evenly distributed along the category field. * - `"bar"`—Displays the data as sets of horizontal bars that show the relationship between individual items and the whole category. * - `"boxPlot"`—Displays the data as a box-and-whisker diagram, which shows the distribution of values in a series. * - `"bubble"`—Displays the data as bubbles, where each bubble represents a value from the series data. * - `"bullet"`—Displays the data as vertical bars that show the performance measure, and markers that show the comparative measure. * - `"candlestick"`—Displays the data as candlesticks, which show the open, close, high, and low values of a series. * - `"column"`—Displays the data as sets of vertical bars that show the relationship between individual items and the whole category. * - `"donut"`—Displays the data as a series of rings that are sliced depending on the value. * - `"exponentialTrendline"`—Displays an exponential [trendline]({% slug trendlines_chart_charts %}#toc-exponential-trendline) for the specified parent series. * - `"funnel"`—Displays the data as a funnel, which is useful for sales data visualization. * - `"heatmap"`—Displays the data as a heatmap, which is useful for comparing values in a matrix. * - `"horizontalWaterfall"`—Displays the data as a horizontal waterfall chart, which is useful for comparing positive and negative values over a period. * - `"line"`—Displays the data as continuous lines that connect data points evenly distributed along the category field. * - `"linearTrendline"`—Displays a linear [trendline]({% slug trendlines_chart_charts %}#toc-linear-trendline) for the specified parent series. * - `"logarithmicTrendline"`—Displays a logarithmic [trendline]({% slug trendlines_chart_charts %}#toc-logarithmic-trendline) for the specified parent series. * - `"movingAverageTrendline"`—Displays a moving average [trendline]({% slug trendlines_chart_charts %}#toc-moving-average-trendline) for the specified parent series. * - `"ohlc"`—Displays the data as OHLC (open-high-low-close) bars, which show the open, high, low, and close values of a series. * - `"pie"`—Displays the data as a series of pie slices, which show the contribution of each value to a total. * - `"polarArea"`—Displays the data as a series of polar area segments, which show the contribution of each value to a total. * - `"polarLine"`—Displays the data as continuous lines that connect data points evenly distributed along the category field. * - `"polarScatter"`—Displays the data as points distributed in a polar coordinate system. * - `"polynomialTrendline"`—Displays a polynomial [trendline]({% slug trendlines_chart_charts %}#toc-polynomial-trendline) for the specified parent series. * - `"powerTrendline"`—Displays a power [trendline]({% slug trendlines_chart_charts %}#toc-power-trendline) for the specified parent series. * - `"pyramid"`—Displays the data as a pyramid divided in segments proportional to each value. * - `"radarArea"`—Displays the data as a series of radar area segments, which show the contribution of each value to a total. * - `"radarColumn"`—Displays the data as sets of vertical bars that show the relationship between individual items and the whole category. * - `"radarLine"`—Displays the data as continuous lines that connect data points evenly distributed along the category field. * - `"rangeArea"`—Displays the data as a series of range area segments, which show the contribution of each value to a total. * - `"rangeBar"`—Displays the data as sets of horizontal bars that show the relationship between individual items and the whole category. * - `"rangeColumn"`—Displays the data as sets of vertical bars that show the relationship between individual items and the whole category. * - `"scatter"`—Displays the data as points that show the relationship between two variables. * - `"scatterLine"`—Displays the data as continuous lines that connect data points evenly distributed along the category field. * - `"verticalArea"`—Displays the data as continuous lines that show trends over time, evenly distributed along the category field. * - `"verticalBoxPlot"`—Displays the data as a box-and-whisker diagram, which shows the distribution of values in a series. * - `"verticalBullet"`—Displays the data as vertical bars that show the performance measure, and markers that show the comparative measure. * - `"verticalLine"`—Displays the data as continuous lines that connect data points evenly distributed along the category field. * - `"verticalRangeArea"`—Displays the data as a series of range area segments, which show the contribution of each value to a total. * - `"waterfall"`—Displays the data as a waterfall chart, which is useful for comparing positive and negative values over a period. * * @example * ```jsx * import { * Chart, * ChartSeries, * ChartSeriesItem * } from '@progress/kendo-react-charts'; * * const data = [1, 2, 3]; * const seriesType = "verticalLine"; * * const ChartContainer = () => ( * * * * * * ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare type SeriesType = 'area' | 'bar' | 'boxPlot' | 'bubble' | 'bullet' | 'candlestick' | 'column' | 'donut' | 'exponentialTrendline' | 'funnel' | 'pyramid' | 'heatmap' | 'horizontalWaterfall' | 'line' | 'linearTrendline' | 'logarithmicTrendline' | 'movingAverageTrendline' | 'ohlc' | 'pie' | 'polarArea' | 'polarLine' | 'polarScatter' | 'polynomialTrendline' | 'powerTrendline' | 'radarArea' | 'radarColumn' | 'radarLine' | 'rangeArea' | 'rangeBar' | 'rangeColumn' | 'scatter' | 'scatterLine' | 'verticalArea' | 'verticalBoxPlot' | 'verticalBullet' | 'verticalLine' | 'verticalRangeArea' | 'waterfall'; /** * The context for the series point visual function. */ export declare interface SeriesVisualArgs { /** * The point category. */ category: any; /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The center point of the segment. * Available for the Donut and Pie series. */ center?: geometry.Point; /** * The point data item. */ dataItem: any; /** * The end angle of the segment. Available for the Donut and Pie series. */ endAngle?: number; /** * The inner radius of the segment. Available for the Donut and Pie series. */ innerRadius?: number; /** * The point options. */ options: any; /** * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% stacked charts. */ percentage?: number; /** * The segment points. Available for the Donut and Pie series. */ points?: geometry.Point[]; /** * The segment radius. Available for the Donut and Pie series. */ radius?: number; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The sum of point values since the last `runningTotal` summary point. Available for the Waterfall series. */ runningTotal?: number; /** * The instance of the Chart component. */ sender: Chart; /** * The point series. */ series: any; /** * The start angle of the segment. Available for the Donut and Pie series. */ startAngle?: number; /** * The sum of all previous series values. Available for the Waterfall series. */ total?: number; /** * The point value. */ value: any; } /** * @hidden */ export declare const SharedTooltipContent: (props: SharedTooltipProps) => JSX.Element; export declare interface SharedTooltipContext { categoryText?: string; colorMarker?: boolean; colspan: number; nameColumn?: boolean; points: Array; } /** * @hidden */ declare interface SharedTooltipProps extends SharedTooltipContext { } /** * The root Sparkline component. * * @remarks * Supported children components are: {@link ChartValueAxis}. * * @example * ```jsx * import { * Sparkline, * ChartValueAxis, * ChartValueAxisItem * } from '@progress/kendo-react-charts'; * * const sparklineData = [ 936, 968, 1025, 999, 998, 1014, 1017, 1010, 1010, 1007 ]; * const bulletData = [ 21, 23 ]; * const bulletValueAxis = { * min: 0, * max: 30, * plotBands: [{ * from: 0, to: 15, color: '#787878', opacity: 0.15 * }, { * from: 15, to: 22, color: '#787878', opacity: 0.3 * }, { * from: 22, to: 30, color: '#787878', opacity: 0.15 * }] * }; * * const SparklineContainer = () => ( *
    *
  • * Base Sparkline chart * *
  • *
  • * Bar/Column type Sparkline chart * *
  • *
  • * Area type Sparkline chart * *
  • *
  • * Pie type Sparkline chart * *
  • *
  • * Bullet type Sparkline chart * * * * * *
  • *
* ); * * ReactDOM.render( * , * document.querySelector('my-app') * ); * ``` */ export declare class Sparkline extends React_2.Component { private _baseChart; /** * @hidden */ get chartInstance(): any; /** * The Drawing `Surface` of the Sparkline. */ get surface(): Surface | null; /** * The DOM element of the Sparkline. */ get element(): HTMLDivElement | null; /** * @hidden */ deriveOptionsFromParent: (options: any) => any; /** * @hidden */ render(): any; private getTarget; } /** * Represents the props of the KendoReact Sparkline component. */ export declare interface SparklineProps extends Omit { /** * The data for the default Sparkline series. Discarded if series are supplied. */ data?: any; /** * The data for the default Sparkline series. Discarded if series are supplied. */ type?: string; } /** * The root StockChart component. * * @remarks * Supported children components are: {@link ChartAxisDefaults}, {@link ChartCategoryAxis}, {@link ChartArea}, {@link ChartNavigator}, * {@link ChartLegend}, {@link ChartPane}, {@link ChartPaneDefaults}, {@link ChartPanes}, {@link ChartPlopArea}, {@link ChartPlopArea}, * {@link ChartSeries}, {@link ChartSeriesDefaults}, {@link ChartSubTitle}, {@link ChartTitle}, {@link ChartTooltip}, * {@link ChartValueAxis}, {@link ChartXAxis}, {@link ChartYAxis}, {@link ChartZoomable}. */ export declare class StockChart extends React_2.Component { private _baseChart; /** * @hidden */ get chartInstance(): any; /** * The Drawing `Surface` of the StockChart. */ get surface(): Surface | null; /** * The DOM element of the StockChart. */ get element(): HTMLDivElement | null; /** * @hidden */ deriveOptionsFromParent: (options: any) => any; /** * @hidden */ onRefresh: (chartOptions: any, themeOptions: any, chartInstance: any) => void; /** * @hidden */ render(): any; private getTarget; } /** * Represents the props of the KendoReact StockChart component. */ export declare interface StockChartProps extends Omit { /** * Specifies whether the StockChart will perform full or partial redraw upon re-render. The partial redraw is required when the `onNavigatorFilter` event is handled and the data for the main panes is limited to a specific set. The default value is `false`. */ partialRedraw?: boolean; /** * Fires when the navigator range is changed. */ onNavigatorFilter?: (event: NavigatorFilterEvent) => void; } /** * @hidden */ declare interface Store { getState(): any; dispatch(action: StoreAction | object): void; subscribe(f: Function): Function; } /** * @hidden */ declare interface StoreAction { chartKey?: string; chartCollectionIdxKey?: string; type?: string; payload: any; } /** * @hidden */ export declare interface Subtitle { /** * The alignment of the subtitle. * * By default, the subtitle has the same alignment as the title. * * The available options are: * - `"center"`—The text is aligned to the middle. * - `"left"`—The text is aligned to the left. * - `"right"`—The text is aligned to the right. */ align?: 'center' | 'left' | 'right'; /** * The background color of the subtitle. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the subtitle. */ border?: Border; /** * The text color of the subtitle. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font of the subtitle. */ font?: string; /** * The margin of the subtitle. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the subtitle. A numeric value sets all margins. */ padding?: Padding | number; /** * The position of the subtitle. * * By default, the subtitle is placed in the same position as the title. * * The available options are: * - `"bottom"`—The title is positioned on the bottom. * - `"top"`—The title is positioned on the top. */ position?: 'top' | 'bottom'; /** * The text of the chart subtitle. You can also set the text directly for a title with default options. * * You can split the text into multiple lines by using the line feed characters ("\n"). */ text?: string; /** * If set to `true`, the Chart displays the subtitle. By default, the subtitle is displayed. */ visible?: boolean; } /** * @hidden */ export declare interface Title { /** * The alignment of the title. * * The available options are: * - `"center"`—The text is aligned to the middle. * - `"left"`—The text is aligned to the left. * - `"right"`—The text is aligned to the right. */ align?: 'center' | 'left' | 'right'; /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the series. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all margins. */ padding?: Padding | number; /** * The position of the title. * * The available options are: * - `"bottom"`—The title is positioned on the bottom. * - `"top"`—The title is positioned on the top. */ position?: 'top' | 'bottom'; /** * The text of the chart title. You can also set the text directly for a title with default options. You can split the text into multiple lines by using the line feed characters ("\n"). */ text?: string; /** * The accessible description of the Chart. The description is announced by screen readers when the Chart is focused.("\n"). */ description?: string; /** * If set to `true`, the Chart displays the title. By default, the title is displayed. */ visible?: boolean; } /** * The context for the title visual function. */ export declare interface TitleVisualArgs { /** * A function that can be used to get the default visual. */ createVisual: () => drawing.Element; /** * The title options. */ options: any; /** * The rectangle that defines the normal position of the visual. */ rect: geometry.Rect; /** * The instance of the Chart component. */ sender: Chart; /** * The text of the title. */ text: string; } /** * @hidden */ export declare interface Tooltip { /** * The background color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border configuration options. */ border?: TooltipBorder; /** * The text color of the tooltip. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font of the tooltip. */ font?: string; /** * The format of the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. * * The available format placeholders are: * - Area, Bar, Column, Funnel, Pyramid, Line, and Pie: {0} - value. * - Bubble: {0} - x value, {1} - y value, {2} - size value, {3} - category name. * - Scatter and scatterLine: {0} - x value, {1} - y value. * - Candlestick and OHLC: {0} - open value, {1} - high value, {2} - low value, {3} - close value, {4} - category name. */ format?: string; /** * The opacity of the tooltip. */ opacity?: number; /** * The padding of the tooltip. A numeric value sets all paddings. */ padding?: Padding | number; /** * If set to `true`, the Chart displays a single tooltip for every category ([see example]({% slug tooltips_chart_charts %}#toc-shared-tooltip)). */ shared?: boolean; /** * If set to `true`, the Chart displays the series tooltip. By default, the series tooltip is not displayed. */ visible?: boolean; } /** * @hidden */ declare interface TooltipAppendTo { /** * Defines the container to which the Tooltip will be appended. Defaults to [`body`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/body). */ appendTo?: HTMLElement | null; } /** * The border options of the tooltip. */ export declare interface TooltipBorder extends Omit { /** * * @hidden * * **Deprecated**. The `dashType` setting is ignored. Use the `border-style` CSS property instead. * * @deprecated */ dashType?: DashType; } /** * Represents the props of the Sankey tooltip content component. */ export declare interface TooltipContentProps { /** * Represents the dataItem object of the hovered node or link element. */ dataItem: SankeyNodeDataItem | SankeyLinkDataItem; /** * The value of the hovered node element. * The value is available only when the hovered element is a node. */ nodeValue?: number; /** * The `dir` attribute of the Sankey tooltip content component. */ dir?: string; } export declare interface TooltipContext { point: TooltipPoint; } /** * The point that is passed to the tooltip component. */ export declare class TooltipPoint { /** * The point value. */ value: any; /** * The point category. Available only for the Categorical series. */ category: string | Date | number; /** * The point category index. Available only for the Categorical series. */ categoryIndex: number; /** * The point series options. */ series: any; /** * The point `dataItem`. */ dataItem: any; /** * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% Stacked charts. */ percentage: number; /** * The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series. */ runningTotal: number; /** * The sum of all previous series values. Available for the Waterfall series. */ total: number; /** * The low value of the point error bar. Available for the Categorical series with error bars. */ low: number; /** * The high value of the point error bar. Available for the Categorical series with error bars. */ high: number; /** * The x low value of the point error bar. Available for the Scatter series with error bars. */ xLow: number; /** * The x high value of the point error bar. Available for the Scatter series with error bars. */ xHigh: number; /** * The y low value of the point error bar. Available for the Scatter series with error bars. */ yLow: number; /** * The y low value of the point error bar. Available for the Scatter series with error bars. */ yHigh: number; private point; private format?; /** * @hidden */ constructor(point: any, format?: string); get formattedValue(): string; } /** * @hidden */ export declare class TooltipPopup extends React_2.Component { static contextType: React_2.Context; context: React_2.ContextType; chartObserver: InstanceObserver; element: HTMLDivElement | null; constructor(props: TooltipPopupProps); componentDidMount(): void; render(): JSX.Element; componentWillUnmount(): void; onChartMouseLeave: (e: DomEvent>) => boolean; onMouseLeave: (e: React_2.MouseEvent) => void; private popupRef; } /** * @hidden */ export declare interface TooltipPopupProps { className?: string | undefined; popupShown: boolean; popupAlign?: Align; popupOffset?: Offset; popupStyles?: any; popupContent: Function; } /** * @hidden */ declare interface Tooltips { [key: string]: CrosshairTooltipProps; } /** * The series trendline forecast settings. */ export declare interface TrendlineForecast { /** * The number of intervals to extend the trendline before the first data point. */ before?: number; /** * The number of intervals to extend the trendline after the last data point. */ after?: number; } /** * @hidden */ export declare interface ValueAxis { /** * * (Only for objects) The value at which the category axis crosses this axis. * * (Only for arrays) The value indices at which the category axes cross the value axis. * * (Only for dates) The date at which the category axis crosses this axis. */ axisCrossingValue?: any | any[]; /** * The background color of the axis. */ background?: string; /** * The color of the value axis. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The configuration of the axis lines. Also affects the major and minor ticks, but not the grid lines. */ line?: AxisLine; /** * The configuration of the major grid lines. These are the lines that are an extension of the major ticks through the body of the Chart. */ majorGridLines?: GridLines; /** * The configuration of the value axis major ticks. */ majorTicks?: AxisTicks; /** * The interval between major divisions. If [`valueAxis.type`]({% slug api_charts_chartvalueaxisitemprops %}#toc-type) is set to `"log"`, the `majorUnit` value is used for the base of the logarithm. */ majorUnit?: number; /** * The maximum value of the axis. */ max?: any; /** * The minimum value of the axis. */ min?: any; /** * The configuration of the minor grid lines. These are the lines that are an extension of the minor ticks through the body of the Chart. */ minorGridLines?: GridLines; /** * The configuration of the value axis minor ticks. */ minorTicks?: AxisTicks; /** * The interval between minor divisions. It defaults to one-fifth (1/5) of the [`valueAxis.majorUnit`]({% slug api_charts_chartvalueaxisitemprops %}#toc-majorunit). If [`valueAxis.type`]({% slug api_charts_chartvalueaxisitemprops %}#toc-type) is set to `"log"`, the `minorUnit` value represents the number of divisions between two major units and defaults to the major unit minus one. */ minorUnit?: number; /** * The unique axis name. Used to associate a series with a value axis by using the [`series.axis`]({% slug api_charts_chartseriesitemprops %}#toc-axis) option. */ name?: string; /** * If set to `true`, the Chart prevents the automatic axis range from snapping to zero. Setting it to `false` forces the automatic axis range to snap to zero. */ narrowRange?: boolean; /** * The name of the pane that the value axis has to be rendered in. If not set, the axis is rendered in the first (default) pane. */ pane?: string; /** * The plot bands of the value axis. */ plotBands?: PlotBand[]; /** * If set to `true`, the value axis direction is reversed. By default, the categories are listed from left to right and from bottom to top. * * > Radar and Polar Charts do not support reverse value axes. */ reverse?: boolean; /** * The axis type. * * The supported values are: * - `"numeric"`—Numeric axis. * - `"log"`—Logarithmic axis. */ type?: 'numeric' | 'log'; /** * If set to `true`, the Chart displays the value axis. By default, the value axis is visible. */ visible?: boolean; /** * The crosshair configuration options. * * The crosshair is displayed when the [`valueAxis.crosshair.visible`]({% slug api_charts_chartvalueaxiscrosshairprops %}#toc-visible) option is set to `true`. */ crosshair?: ValueAxisCrosshair; /** * The axis labels configuration. */ labels?: ValueAxisLabels; /** * The value axis notes configuration. */ notes?: ValueAxisNotes; /** * The title configuration of the value axis. * * To display the title, set the [`valueAxis.title.text`]({% slug api_charts_chartvalueaxistitleprops %}#toc-text) option. */ title?: ValueAxisTitle; } /** * @hidden */ export declare interface ValueAxisCrosshair { /** * The color of the crosshair. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The opacity of the crosshair. By default, the crosshair is opaque. */ opacity?: number; /** * If set to `true`, the Chart displays the value axis crosshair. By default, the value axis crosshair is not visible. */ visible?: boolean; /** * The width of the crosshair in pixels. */ width?: number; /** * The options of the crosshair tooltip. The crosshair tooltip is displayed when the [`valueAxis.crosshair.tooltip.visible`]({% slug api_charts_chartvalueaxiscrosshairtooltipprops %}#toc-visible) option is set to `true`. */ tooltip?: ValueAxisCrosshairTooltip; } /** * @hidden */ export declare interface ValueAxisCrosshairTooltip extends AxisCrosshairTooltip { } /** * @hidden */ export declare interface ValueAxisLabels { /** * 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 label 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 font style of the labels. */ font?: string; /** * The format for displaying the labels. Uses the [`format`]({% slug api_intl_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 margins. */ padding?: Padding | number; /** * The rotation angle (in degrees) of the labels. By default, the labels are not rotated. Angles increase clockwise and zero is to the left. Negative values are acceptable. Can be set to `"auto"` if the axis is horizontal. In this case, the labels will be rotated only if the slot size is not sufficient for the entire labels. */ rotation?: LabelRotation | number | 'auto'; /** * The number of labels to skip. By default, no labels are skipped. */ skip?: number; /** * The label rendering step. * Every nth label is rendered where `n` is the step. */ step?: number; /** * If set to `true`, the Chart displays the value axis labels. By default, the category axis labels are visible. */ visible?: boolean; /** * A function for creating custom visuals for the labels. * * The available argument fields are: * - `createVisual`—A function for getting 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`]({% slug api_kendo-drawing_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; } /** * @hidden */ export declare interface ValueAxisNotes { /** * The items of the notes. */ data?: any[]; /** * The line of the notes. */ line?: NoteLine; /** * The position of the value axis note. * * The supported values are: * - `"top"`—The note is positioned on the top. * - `"bottom"`—The note is positioned on the bottom. * - `"left"`—The note is positioned on the left. * - `"right"`—The note is positioned on the right. */ position?: NotePosition; /** * A function for creating custom visuals for the notes. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect. * - `options`—The note options. * - `createVisual`—A function that can be used to get the default visual. * - `value`—The note value. */ visual?: (e: AxisNoteVisualArgs) => drawing.Element; /** * The icon of the notes. */ icon?: ValueAxisNotesIcon; /** * The label of the notes. */ label?: ValueAxisNotesLabel; } /** * @hidden */ export declare interface ValueAxisNotesIcon { /** * The background color of the notes icon. */ background?: string; /** * The border of the notes icon. */ border?: Border; /** * The size of the notes icon. */ size?: number; /** * The shape of the notes icon. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; /** * The visibility of the notes icon. */ visible?: boolean; } /** * @hidden */ export declare interface ValueAxisNotesLabel { /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The text color of the label. 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"`). */ content?: (e: any) => string; /** * The font style of the label. */ font?: string; /** * The format used to display the notes label. Uses the IntlService [`format`]({% slug api_intl_intlservice %}#toc-format) method. Contains one placeholder (`"{0}"`) which represents the axis value. */ format?: string; /** * The position of the labels. * * The supported values are: * - `"inside"`—The label is positioned inside the icon. * - `"outside"`—The label is positioned outside the icon. */ position?: NoteLabelPosition; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * If set to `true`, the Chart displays the value axis notes label. By default, the value axis notes label is visible. */ visible?: boolean; } /** * @hidden */ export declare interface ValueAxisTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the title. * * The supported values are: * - `"top"`—The axis title is positioned on the top (applicable to the vertical axis). * - `"bottom"`—The axis title is positioned on the bottom (applicable to the vertical axis). * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: AxisTitlePosition; /** * The rotation angle of the title. By default, the title is not rotated. */ rotation?: number; /** * The text of the title. You can split the text into multiple lines by using the line feed characters (`"\n"`). */ text?: string; /** * If set to `true`, the Chart displays the value axis title. By default, the value axis title is visible. */ visible?: boolean; /** * A function for creating a custom visual for the title. * * The available argument fields are: * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) * that defines where the visual has to be rendered. * - `sender`—The Chart instance (might be `undefined`). * - `options`—The label options. * - `createVisual`—A function for getting the default visual. */ visual?: (e: TitleVisualArgs) => drawing.Element; } export { VerticalStripesPattern } /** * Specifies the `weekStartDay` of a [ChartCategoryAxisItem]({% slug api_charts_chartcategoryaxisitem %}). */ export declare enum WeekStartDay { /** * Specifies Sunday as the first day of the week. */ Sunday = 0, /** * Specifies Monday as the first day of the week. */ Monday = 1, /** * Specifies Tuesday as the first day of the week. */ Tuesday = 2, /** * Specifies Wednesday as the first day of the week. */ Wednesday = 3, /** * Specifies Thursday as the first day of the week. */ Thursday = 4, /** * Specifies Friday as the first day of the week. */ Friday = 5, /** * Specifies Saturday as the first day of the week. */ Saturday = 6 } /** * @hidden */ export declare interface XAxis { /** * * (Only for objects) The value at which the Y axis crosses this axis. * * (Only for arrays) The value indices at which the y axes cross the value axis. * * (Only for dates) The date at which the Y axis crosses this axis. * * To denote the far end of the axis, set a value that is greater than or equal to the axis maximum value. */ axisCrossingValue?: any | any[]; /** * The background color of the axis. */ background?: string; /** * The category names. Applicable for charts with X and Y category axes. */ categories?: any[]; /** * The base time interval for the axis labels. The default `baseUnit` is automatically determined from the value range. * * The available options are: * - milliseconds * - seconds * - minutes * - hours * - days * - weeks * - months * - years */ baseUnit?: BaseUnit; /** * The color of the axis. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The configuration of the axis lines. Also affects the major and minor ticks, but not the grid lines. */ line?: AxisLine; /** * The configuration of the major grid lines. These are the lines that are an extension of the major ticks through the body of the Chart. */ majorGridLines?: GridLines; /** * The configuration of the Scatter Chart X-axis major ticks. */ majorTicks?: AxisTicks; /** * The interval between major divisions. If this is a date axis, the value represents the number of [`xAxis.baseUnits`]({% slug api_charts_chartxaxisitemprops %}#toc-baseunit) between major divisions. If [`xAxis.type`]({% slug api_charts_chartxaxisitemprops %}#toc-type) is set to `"log"`, the `majorUnit` value is used for the base of the logarithm. */ majorUnit?: number; /** * The maximum value of the axis. */ max?: any; /** * The minimum value of the axis. */ min?: any; /** * The configuration of the minor grid lines. These are the lines that are an extension of the minor ticks through the body of the Chart. */ minorGridLines?: GridLines; /** * The configuration of the X-axis minor ticks. */ minorTicks?: AxisTicks; /** * The interval between minor divisions. It defaults to 1/5 of the [`xAxis.majorUnit`]({% slug api_charts_chartxaxisitemprops %}#toc-majorunit). If [`xAxis.type`]({% slug api_charts_chartxaxisitemprops %}#toc-type) is set to `"log"`, the `minorUnit` value represents the number of divisions between two major units and defaults to the major unit minus one. */ minorUnit?: number; /** * The unique axis name. Used to associate a series with a X axis by using the [`series.xAxis`]({% slug api_charts_chartseriesitemprops %}#toc-xaxis) option. */ name?: string; /** * If set to `true`, the Chart prevents the automatic axis range from snapping to zero. Setting it to `false` forces the automatic axis range to snap to zero. */ narrowRange?: boolean; /** * The name of the pane in which the axis has to be rendered. If not set, the axis is rendered in the first (default) pane. */ pane?: string; /** * The plot bands of the X axis. */ plotBands?: PlotBand[]; /** * If set to `true`, the value axis direction is reversed. By default, values increase from left to right and from bottom to top. */ reverse?: boolean; /** * The angle (in degrees) where the zero value is placed. Angles increase counterclockwise and zero is to the right. Negative values are acceptable. */ startAngle?: number; /** * The axis type. * * The supported values are: * - `"numeric"`—Numeric axis. * - `"date"`—Specialized axis for displaying chronological data. * - `"log"`—Logarithmic axis. * * If the series X value is of the `date` type, the Chart automatically switches to a date axis. To avoid this behavior, set the `type`. */ type?: 'numeric' | 'log' | 'date'; /** * If set to `true`, the Chart displays the X axis. By default, the X axis is visible. */ visible?: boolean; /** * The configuration options of the crosshair. The crosshair is displayed when the [`xAxis.crosshair.visible`]({% slug api_charts_chartxaxiscrosshairprops %}#toc-visible) option is set to `true`. */ crosshair?: XAxisCrosshair; /** * The axis labels configuration. */ labels?: XAxisLabels; /** * The X-axis notes configuration. */ notes?: XAxisNotes; /** * The title configuration of the Scatter Chart X axis. To display the title, set the [`xAxis.title.text`]({% slug api_charts_chartxaxistitleprops %}#toc-text) option. */ title?: XAxisTitle; } /** * @hidden */ export declare interface XAxisCrosshair { /** * The color of the crosshair. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The opacity of the crosshair. By default, the crosshair is opaque. */ opacity?: number; /** * If set to `true`, the Chart displays the X-axis crosshair of the Scatter Chart. By default, the X-axis crosshair of the Scatter Chart is not visible. */ visible?: boolean; /** * The width of the crosshair in pixels. */ width?: number; /** * The options of the crosshair tooltip. The crosshair tooltip is displayed when the [`xAxis.crosshair.tooltip.visible`]({% slug api_charts_chartxaxiscrosshairtooltipprops %}#toc-visible) option is set to `true`. */ tooltip?: XAxisCrosshairTooltip; } /** * @hidden */ export declare interface XAxisCrosshairTooltip extends AxisCrosshairTooltip { } /** * @hidden */ export declare interface XAxisLabels { /** * 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]({% slug overview_intl %}). */ culture?: string; /** * The format for displaying the labels when the X values are dates. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the category value. The Chart selects the appropriate format for the current [`xAxis.baseUnit`]({% slug api_charts_chartxaxisitemprops %}#toc-baseunit). Setting the [`categoryAxis.labels.format`]({% slug api_charts_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`]({% slug api_intl_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. Can be set to `"auto"`. In this case, the labels are rotated only if the slot size is not sufficient for the entire labels. */ rotation?: LabelRotation | number | 'auto'; /** * The number of labels to skip. */ skip?: number; /** * The label rendering step—renders every nth label. By default, every label is rendered. */ step?: number; /** * If set to `true`, the Chart displays the X-axis labels. By default, the X-axis labels are visible. */ visible?: boolean; /** * A function for creating custom visuals 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) of the label. * - `format`—The default format of the label. * - `options`—The label options. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_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; } /** * @hidden */ export declare interface XAxisNotes { /** * The items of the notes. */ data?: any[]; /** * The line of the notes. */ line?: NoteLine; /** * The position of the X-axis note. * * The supported values are: * - `"top"`—The note is positioned on the top. * - `"bottom"`—The note is positioned on the bottom. * - `"left"`—The note is positioned on the left. * - `"right"`—The note is positioned on the right. */ position?: NotePosition; /** * A function for creating custom visuals for the notes. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect. * - `sender`—The chart instance (might be `undefined`). * - `options`—The note options. * - `createVisual`—A function that can be used to get the default visual. * - `value`—The note value. */ visual?: (e: AxisNoteVisualArgs) => drawing.Element; /** * The icon of the notes. */ icon?: XAxisNotesIcon; /** * The label of the notes. */ label?: XAxisNotesLabel; } /** * @hidden */ export declare interface XAxisNotesIcon { /** * The background color of the notes icon. */ background?: string; /** * The border of the notes icon. */ border?: Border; /** * The size of the notes icon. */ size?: number; /** * The shape of the notes icon. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; /** * The visibility of the notes icon. */ visible?: boolean; } /** * @hidden */ export declare interface XAxisNotesLabel { /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The text color of the label. 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"`). */ content?: (e: any) => string; /** * The font style of the label. */ font?: string; /** * The format for displaying the notes label. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the axis value. */ format?: string; /** * The position of the labels. * * The available options are: * - `"inside"`—The label is positioned inside the icon. * - `"outside"`—The label is positioned outside the icon. */ position?: NoteLabelPosition; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * If set to `true`, the Chart displays the X-axis notes label. By default, the X-axis notes label is visible. */ visible?: boolean; } /** * @hidden */ export declare interface XAxisTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the title. * * The supported values are: * - `"top"`—The axis title is positioned on the top (applicable to the vertical axis). * - `"bottom"`—The axis title is positioned on the bottom (applicable to the vertical axis). * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: AxisTitlePosition; /** * The rotation angle of the title. By default, the title is not rotated. */ rotation?: number; /** * The text of the title. You can split the text into multiple lines by using the line feed characters (`"\n"`). */ text?: string; /** * If set to `true`, the Chart displays the X axis title of the Scatter Chart. By default, the X-axis title of the Scatter Chart is visible. */ visible?: boolean; /** * A function that can be used to create a custom visual for the title. * * The available argument fields are: * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered. * - `sender`—The Chart instance (might be `undefined`). * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. */ visual?: (e: TitleVisualArgs) => drawing.Element; } /** * @hidden */ export declare interface YAxis { /** * * (Only for objects) The value at which the Y axis crosses this axis. * * (Only for arrays) The value indices at which the Y axes cross the value axis. * * (Only for dates) The date at which the Y axis crosses this axis. * * To denote the far end of the axis, set a value that is greater than or equal to the axis maximum value. */ axisCrossingValue?: any | any[]; /** * The background color of the axis. */ background?: string; /** * The category names. Applicable for charts with X and Y category axes. */ categories?: any[]; /** * The base time interval for the axis labels. The default `baseUnit` is automatically determined from the value range. * * The available options are: * - `milliseconds` * - `seconds` * - `minutes` * - `hours` * - `days` * - `weeks` * - `months` * - `years` */ baseUnit?: BaseUnit; /** * The color of the axis. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The configuration of the axis lines. Also affects the major and minor ticks, but not the grid lines. */ line?: AxisLine; /** * The configuration of the major grid lines. These are the lines that are an extension of the major ticks through the body of the Chart. */ majorGridLines?: GridLines; /** * The configuration of the Scatter Chart Y-axis major ticks. */ majorTicks?: AxisTicks; /** * The interval between major divisions. If this is a date axis, the value represents the number of [`yAxis.baseUnits`]({% slug api_charts_chartyaxisitemprops %}#toc-baseunit) between major divisions. If the [`yAxis.type`]({% slug api_charts_chartyaxisitemprops %}#toc-type) is set to `"log"`, the `majorUnit` value is used for the base of the logarithm. */ majorUnit?: number; /** * The maximum value of the axis. */ max?: any; /** * The minimum value of the axis. */ min?: any; /** * The configuration of the minor grid lines. These are the lines that are an extension of the minor ticks through the body of the Chart. */ minorGridLines?: GridLines; /** * The configuration of the Y-axis minor ticks. */ minorTicks?: AxisTicks; /** * The interval between minor divisions. It defaults to one-fifth (1/5) of [`yAxis.majorUnit`]({% slug api_charts_chartyaxisitemprops %}#toc-majorunit). If [`yAxis.type`]({% slug api_charts_chartyaxisitemprops %}#toc-type) is set to `"log"`, the `minorUnit` value represents the number of divisions between two major units and defaults to the major unit minus one. */ minorUnit?: number; /** * The unique axis name. Used to associate a series with a Y axis by using the [`series.yAxis`]({% slug api_charts_chartseriesitemprops %}#toc-yaxis) option. */ name?: string; /** * If set to `true`, the Chart prevents the automatic axis range from snapping to zero. Setting it to `false` forces the automatic axis range to snap to zero. */ narrowRange?: boolean; /** * The name of the pane in which the axis has to be rendered. If not set, the axis is rendered in the first (default) pane. */ pane?: string; /** * The plot bands of the Y axis. */ plotBands?: PlotBand[]; /** * If set to `true`, the value axis direction is reversed. By default, the values increase from left to right and from bottom to top. */ reverse?: boolean; /** * The axis type. * * The supported values are: * - `"numeric"`—Numeric axis. * - `"date"`—Specialized axis for displaying chronological data. * - `"log"`—Logarithmic axis. * * If the series Y value is of the `date` type, the Chart automatically switches to a date axis. To avoid this behavior, set the `type`. */ type?: 'numeric' | 'log' | 'date'; /** * If set to `true`, the Chart displays the Y axis. By default, the Y axis is visible. */ visible?: boolean; /** * The configuration options of the crosshair. The crosshair is displayed when the [`yAxis.crosshair.visible`]({% slug api_charts_chartyaxiscrosshairprops %}#toc-visible) option is set to `true`. */ crosshair?: YAxisCrosshair; /** * The axis labels configuration. */ labels?: YAxisLabels; /** * The Y-axis notes configuration. */ notes?: YAxisNotes; /** * The title configuration of the Scatter Chart Y axis. To display the title, set the [`yAxis.title.text`]({% slug api_charts_chartyaxistitleprops %}#toc-text) option. */ title?: YAxisTitle; } /** * @hidden */ export declare interface YAxisCrosshair { /** * The color of the crosshair. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The opacity of the crosshair. By default, the crosshair is opaque. */ opacity?: number; /** * If set to `true`, the Chart displays the Y-axis crosshair of the Scatter Chart. By default, the Y-axis crosshair of the Scatter Chart is not visible. */ visible?: boolean; /** * The width of the crosshair in pixels. */ width?: number; /** * The options of the crosshair tooltip. The crosshair tooltip is displayed when the [`yAxis.crosshair.tooltip.visible`]({% slug api_charts_chartyaxiscrosshairtooltipprops %}#toc-visible) option is set to `true`. */ tooltip?: YAxisCrosshairTooltip; } /** * @hidden */ export declare interface YAxisCrosshairTooltip extends AxisCrosshairTooltip { } /** * @hidden */ export declare 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]({% slug overview_intl %}). */ culture?: string; /** * The format for displaying the labels when the X values are dates. Uses the [`format`]({% slug api_intl_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`]({% slug api_charts_chartyaxisitemprops %}#toc-baseunit). Setting the [`categoryAxis.labels.format`]({% slug api_charts_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`]({% slug api_intl_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`th 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`]({% slug api_kendo-drawing_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; } /** * @hidden */ export declare interface YAxisNotes { /** * The items of the notes. */ data?: any[]; /** * The line of the notes. */ line?: NoteLine; /** * The position of the Y-axis notes. * * The supported values are: * - `"top"`—The note is positioned on the top. * - `"bottom"`—The note is positioned on the bottom. * - `"left"`—The note is positioned on the left. * - `"right"`—The note is positioned on the right. */ position?: NotePosition; /** * A function for creating custom visuals for the notes. * * The available argument fields are: * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect. * - `options`—The note options. * - `createVisual`—A function that can be used to get the default visual. * - `value`—The note value. */ visual?: (e: AxisNoteVisualArgs) => drawing.Element; /** * The icon of the notes. */ icon?: YAxisNotesIcon; /** * The label of the notes. */ label?: YAxisNotesLabel; } /** * @hidden */ export declare interface YAxisNotesIcon { /** * The background color of the notes icon. */ background?: string; /** * The border of the notes icon. */ border?: Border; /** * The size of the notes icon. */ size?: number; /** * The shape of the notes icon. * * The supported values are: * * `"circle"`—The marker shape is a circle. * * `"square"`—The marker shape is a square. * * `"triangle"`—The marker shape is a triangle. * * `"cross"`—The marker shape is a cross. */ type?: MarkerType; /** * The visibility of the notes icon. */ visible?: boolean; } /** * @hidden */ export declare interface YAxisNotesLabel { /** * The background color of the label. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the label. */ border?: Border; /** * The text color of the label. 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"`). */ content?: (e: any) => string; /** * The font style of the label. */ font?: string; /** * The format for displaying the notes label. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the axis value. */ format?: string; /** * The position of the labels. * * The available options are: * - `"inside"`—The label is positioned inside the icon. * - `"outside"`—The label is positioned outside the icon. */ position?: NoteLabelPosition; /** * The rotation angle of the label. By default, the label is not rotated. */ rotation?: number; /** * If set to `true`, the Chart displays the Y-axis notes label. By default, the Y-axis notes label is visible. */ visible?: boolean; } /** * @hidden */ export declare interface YAxisTitle { /** * The background color of the title. Accepts a valid CSS color string, including hex and rgb. */ background?: string; /** * The border of the title. */ border?: Border; /** * The text color of the title. Accepts a valid CSS color string, including hex and rgb. */ color?: string; /** * The font style of the title. */ font?: string; /** * The margin of the title. A numeric value sets all margins. */ margin?: Margin | number; /** * The padding of the title. A numeric value sets all paddings. */ padding?: Padding | number; /** * The position of the title. * * The supported values are: * - `"top"`—The axis title is positioned on the top (applicable to the vertical axis). * - `"bottom"`—The axis title is positioned on the bottom (applicable to the vertical axis). * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis). * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis). * - `"center"`—The axis title is positioned in the center. */ position?: AxisTitlePosition; /** * The rotation angle of the title. By default, the title is not rotated. */ rotation?: number; /** * The text of the title. You can split the text into multiple lines by using the line feed characters (`"\n"`). */ text?: string; /** * If set to `true`, the Chart displays the Scatter Chart Y-axis title. By default, the Scatter Chart Y-axis title is visible. */ visible?: boolean; /** * A function for creating custom visuals for the title. * * The available argument fields are: * - `text`—The label text. * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) * that defines where the visual has to be rendered. * - `sender`—The Chart instance (can be `undefined`). * - `options`—The label options. * - `createVisual`—A function that can be used to get the default visual. */ visual?: (e: TitleVisualArgs) => drawing.Element; } /** * @hidden */ export declare interface Zoomable { /** * Specifies if the Chart can be zoomed by using the mousewheel. */ mousewheel?: boolean | MousewheelZoom; /** * Specifies if the Chart can be zoomed by using selection. */ selection?: boolean | DragAction; } /** * Arguments for the `zoomEnd` event. */ export declare class ZoomEndEvent extends BaseEvent { /** * A dictionary which contains the range (min and max values) of the named axes. The axis name is used as a key. * * > The dictionary includes only the affected axis ranges. If an axis is locked or its range is not modified, the axis will not be listed. */ axisRanges: { [name: string]: AxisRange; }; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `zoom` event. */ export declare class ZoomEvent extends PreventableEvent { /** * A dictionary which contains the range (min and max values) of named axes. The axis name is used as a key. * * > The dictionary includes only the affected axis ranges. If an axis is locked or its range is not modified, the axis will not be listed. */ axisRanges: { [name: string]: AxisRange; }; /** * A number that indicates the zoom amount and direction. A negative value indicates a zoom-in action. A positive value indicates a zoom-out action. */ delta: number; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * @hidden */ constructor(e: any, target: Charts); } /** * Arguments for the `zoomStart` event. */ export declare class ZoomStartEvent extends PreventableEvent { /** * A dictionary which contains the range (min and max values) of named axes. The axis name is used as a key. */ axisRanges: { [name: string]: AxisRange; }; /** * The original user event that triggered the drag action. */ nativeEvent: any; /** * @hidden */ constructor(e: any, target: Charts); } export { }