devextreme-angular/fesm2022/devextreme-angular-ui-chart.mjs.map

DevExtreme UI and Visualization Components for Angular

{"version":3,"file":"devextreme-angular-ui-chart.mjs","sources":["../../../dist/ui/chart/index.ts","../../../dist/ui/chart/devextreme-angular-ui-chart.ts"],"sourcesContent":["/*!\n * devextreme-angular\n * Version: 26.1.3\n * Build date: Wed Jun 10 2026\n *\n * Copyright (c) 2012 - 2026 Developer Express Inc. ALL RIGHTS RESERVED\n *\n * This software may be modified and distributed under the terms\n * of the MIT license. See the LICENSE file in the root of the project for details.\n *\n * https://github.com/DevExpress/DevExtreme\n */\n\n/* tslint:disable:max-line-length */\n\n\nimport {\n    TransferState,\n    Component,\n    NgModule,\n    ElementRef,\n    NgZone,\n    PLATFORM_ID,\n    Inject,\n\n    Input,\n    Output,\n    OnDestroy,\n    EventEmitter,\n    OnChanges,\n    DoCheck,\n    SimpleChanges,\n    ContentChildren,\n    QueryList\n} from '@angular/core';\n\n\nimport type * as CommonChartTypes from 'devextreme/common/charts';\nimport type { AnimationEaseMode, TimeInterval, ChartsDataType, ScaleBreak, ScaleBreakLineStyle, DashStyle, Font, RelativePosition, DiscreteAxisDivisionMode, ArgumentAxisHoverMode, ChartsAxisLabelOverlap, TextOverflow, WordWrap, AxisScaleType, VisualRangeUpdateMode, ChartsColor, SeriesHoverMode, HatchDirection, PointInteractionMode, PointSymbol, SeriesSelectionMode, SeriesType, ValueErrorBarDisplayMode, ValueErrorBarType, SeriesLabel, SeriesPoint, LegendItem, LegendHoverMode, Palette, PaletteExtensionMode, ChartsLabelOverlap, Theme, ValueAxisVisualRangeUpdateMode } from 'devextreme/common/charts';\nimport type { dxChartAnnotationConfig, AggregatedPointsPosition, ChartLabelDisplayMode, dxChartCommonAnnotationConfig, chartPointAggregationInfoObject, chartSeriesObject, ChartSeriesAggregationMethod, FinancialChartReductionLevel, chartPointObject, ArgumentAxisClickEvent, DisposingEvent, DoneEvent, DrawnEvent, ExportedEvent, ExportingEvent, FileSavingEvent, IncidentOccurredEvent, InitializedEvent, LegendClickEvent, OptionChangedEvent, PointClickEvent, PointHoverChangedEvent, PointSelectionChangedEvent, SeriesClickEvent, SeriesHoverChangedEvent, SeriesSelectionChangedEvent, TooltipHiddenEvent, TooltipShownEvent, ZoomEndEvent, ZoomStartEvent, dxChartPointInfo, ChartTooltipLocation, ChartZoomAndPanMode, EventKeyModifier } from 'devextreme/viz/chart';\nimport type { HorizontalAlignment, VerticalAlignment, Position, ExportFormat, Orientation, VerticalEdge, SingleOrMultiple } from 'devextreme/common';\nimport type { Format } from 'devextreme/common/core/localization';\nimport type { default as DataSource, DataSourceOptions } from 'devextreme/data/data_source';\nimport type { Store } from 'devextreme/data/store';\nimport type { ChartSeries } from 'devextreme/viz/common';\n\nimport DxChart from 'devextreme/viz/chart';\n\n\nimport {\n    DxComponent,\n    DxTemplateHost,\n    DxIntegrationModule,\n    DxTemplateModule,\n    NestedOptionHost,\n    IterableDifferHelper,\n    WatcherHelper,\n    CollectionNestedOption,\n} from 'devextreme-angular/core';\n\nimport { DxoAdaptiveLayoutModule } from 'devextreme-angular/ui/nested';\nimport { DxoAnimationModule } from 'devextreme-angular/ui/nested';\nimport { DxiAnnotationModule } from 'devextreme-angular/ui/nested';\nimport { DxoBorderModule } from 'devextreme-angular/ui/nested';\nimport { DxoFontModule } from 'devextreme-angular/ui/nested';\nimport { DxoImageModule } from 'devextreme-angular/ui/nested';\nimport { DxoShadowModule } from 'devextreme-angular/ui/nested';\nimport { DxoArgumentAxisModule } from 'devextreme-angular/ui/nested';\nimport { DxoAggregationIntervalModule } from 'devextreme-angular/ui/nested';\nimport { DxiBreakModule } from 'devextreme-angular/ui/nested';\nimport { DxoBreakStyleModule } from 'devextreme-angular/ui/nested';\nimport { DxiConstantLineModule } from 'devextreme-angular/ui/nested';\nimport { DxoLabelModule } from 'devextreme-angular/ui/nested';\nimport { DxoConstantLineStyleModule } from 'devextreme-angular/ui/nested';\nimport { DxoGridModule } from 'devextreme-angular/ui/nested';\nimport { DxoFormatModule } from 'devextreme-angular/ui/nested';\nimport { DxoMinorGridModule } from 'devextreme-angular/ui/nested';\nimport { DxoMinorTickModule } from 'devextreme-angular/ui/nested';\nimport { DxoMinorTickIntervalModule } from 'devextreme-angular/ui/nested';\nimport { DxoMinVisualRangeLengthModule } from 'devextreme-angular/ui/nested';\nimport { DxiStripModule } from 'devextreme-angular/ui/nested';\nimport { DxoStripStyleModule } from 'devextreme-angular/ui/nested';\nimport { DxoTickModule } from 'devextreme-angular/ui/nested';\nimport { DxoTickIntervalModule } from 'devextreme-angular/ui/nested';\nimport { DxoTitleModule } from 'devextreme-angular/ui/nested';\nimport { DxoCommonAnnotationSettingsModule } from 'devextreme-angular/ui/nested';\nimport { DxoCommonAxisSettingsModule } from 'devextreme-angular/ui/nested';\nimport { DxoCommonPaneSettingsModule } from 'devextreme-angular/ui/nested';\nimport { DxoBackgroundColorModule } from 'devextreme-angular/ui/nested';\nimport { DxoCommonSeriesSettingsModule } from 'devextreme-angular/ui/nested';\nimport { DxoAggregationModule } from 'devextreme-angular/ui/nested';\nimport { DxoAreaModule } from 'devextreme-angular/ui/nested';\nimport { DxoHoverStyleModule } from 'devextreme-angular/ui/nested';\nimport { DxoHatchingModule } from 'devextreme-angular/ui/nested';\nimport { DxoConnectorModule } from 'devextreme-angular/ui/nested';\nimport { DxoPointModule } from 'devextreme-angular/ui/nested';\nimport { DxoHeightModule } from 'devextreme-angular/ui/nested';\nimport { DxoUrlModule } from 'devextreme-angular/ui/nested';\nimport { DxoWidthModule } from 'devextreme-angular/ui/nested';\nimport { DxoSelectionStyleModule } from 'devextreme-angular/ui/nested';\nimport { DxoReductionModule } from 'devextreme-angular/ui/nested';\nimport { DxoValueErrorBarModule } from 'devextreme-angular/ui/nested';\nimport { DxoBarModule } from 'devextreme-angular/ui/nested';\nimport { DxoBubbleModule } from 'devextreme-angular/ui/nested';\nimport { DxoCandlestickModule } from 'devextreme-angular/ui/nested';\nimport { DxoColorModule } from 'devextreme-angular/ui/nested';\nimport { DxoFullstackedareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoFullstackedbarModule } from 'devextreme-angular/ui/nested';\nimport { DxoFullstackedlineModule } from 'devextreme-angular/ui/nested';\nimport { DxoFullstackedsplineModule } from 'devextreme-angular/ui/nested';\nimport { DxoFullstackedsplineareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoArgumentFormatModule } from 'devextreme-angular/ui/nested';\nimport { DxoLineModule } from 'devextreme-angular/ui/nested';\nimport { DxoRangeareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoRangebarModule } from 'devextreme-angular/ui/nested';\nimport { DxoScatterModule } from 'devextreme-angular/ui/nested';\nimport { DxoSplineModule } from 'devextreme-angular/ui/nested';\nimport { DxoSplineareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoStackedareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoStackedbarModule } from 'devextreme-angular/ui/nested';\nimport { DxoStackedlineModule } from 'devextreme-angular/ui/nested';\nimport { DxoStackedsplineModule } from 'devextreme-angular/ui/nested';\nimport { DxoStackedsplineareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoStepareaModule } from 'devextreme-angular/ui/nested';\nimport { DxoSteplineModule } from 'devextreme-angular/ui/nested';\nimport { DxoStockModule } from 'devextreme-angular/ui/nested';\nimport { DxoCrosshairModule } from 'devextreme-angular/ui/nested';\nimport { DxoHorizontalLineModule } from 'devextreme-angular/ui/nested';\nimport { DxoVerticalLineModule } from 'devextreme-angular/ui/nested';\nimport { DxoDataPrepareSettingsModule } from 'devextreme-angular/ui/nested';\nimport { DxoExportModule } from 'devextreme-angular/ui/nested';\nimport { DxoLegendModule } from 'devextreme-angular/ui/nested';\nimport { DxoMarginModule } from 'devextreme-angular/ui/nested';\nimport { DxoSubtitleModule } from 'devextreme-angular/ui/nested';\nimport { DxoLoadingIndicatorModule } from 'devextreme-angular/ui/nested';\nimport { DxiPaneModule } from 'devextreme-angular/ui/nested';\nimport { DxoScrollBarModule } from 'devextreme-angular/ui/nested';\nimport { DxiSeriesModule } from 'devextreme-angular/ui/nested';\nimport { DxoSeriesTemplateModule } from 'devextreme-angular/ui/nested';\nimport { DxoSizeModule } from 'devextreme-angular/ui/nested';\nimport { DxoTooltipModule } from 'devextreme-angular/ui/nested';\nimport { DxiValueAxisModule } from 'devextreme-angular/ui/nested';\nimport { DxoZoomAndPanModule } from 'devextreme-angular/ui/nested';\nimport { DxoDragBoxStyleModule } from 'devextreme-angular/ui/nested';\n\nimport { DxoChartAdaptiveLayoutModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAggregationModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAggregationIntervalModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAnimationModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartAnnotationModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAnnotationBorderModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAnnotationImageModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartArgumentAxisModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartArgumentFormatModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAxisConstantLineStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAxisConstantLineStyleLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAxisLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartAxisTitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartBackgroundColorModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartBorderModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartBreakModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartBreakStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartChartTitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartChartTitleSubtitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartColorModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonAnnotationSettingsModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonAxisSettingsModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonAxisSettingsConstantLineStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonAxisSettingsConstantLineStyleLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonAxisSettingsLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonAxisSettingsTitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonPaneSettingsModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonSeriesSettingsModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonSeriesSettingsHoverStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonSeriesSettingsLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCommonSeriesSettingsSelectionStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartConnectorModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartConstantLineModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartConstantLineLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartConstantLineStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartCrosshairModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartDataPrepareSettingsModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartDragBoxStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartExportModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartFontModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartFormatModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartGridModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartHatchingModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartHeightModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartHorizontalLineModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartHorizontalLineLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartHoverStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartImageModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartLegendModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartLegendTitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartLegendTitleSubtitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartLengthModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartLoadingIndicatorModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartMarginModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartMinorGridModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartMinorTickModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartMinorTickIntervalModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartMinVisualRangeLengthModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartPaneModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartPaneBorderModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartPointModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartPointBorderModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartPointHoverStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartPointImageModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartPointSelectionStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartReductionModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartScrollBarModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartSelectionStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartSeriesModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartSeriesBorderModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartSeriesTemplateModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartShadowModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartSizeModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartStripModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartStripLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartStripStyleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartStripStyleLabelModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartSubtitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartTickModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartTickIntervalModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartTitleModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartTooltipModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartTooltipBorderModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartUrlModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxiChartValueAxisModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartValueErrorBarModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartVerticalLineModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartVisualRangeModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartWholeRangeModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartWidthModule } from 'devextreme-angular/ui/chart/nested';\nimport { DxoChartZoomAndPanModule } from 'devextreme-angular/ui/chart/nested';\nimport { \n           PROPERTY_TOKEN_annotations,\n           PROPERTY_TOKEN_breaks,\n           PROPERTY_TOKEN_constantLines,\n           PROPERTY_TOKEN_panes,\n           PROPERTY_TOKEN_series,\n           PROPERTY_TOKEN_strips,\n           PROPERTY_TOKEN_valueAxis,\n     } from 'devextreme-angular/core/tokens';\n\n\n/**\n * The Chart is a UI component that visualizes data from a local or remote storage using a great variety of series types along with different interactive elements, such as tooltips, crosshair pointer, legend, etc.\n\n */\n@Component({\n    selector: 'dx-chart',\n    template: '',\n    styles: [ ' :host {  display: block; }'],\n    host: { ngSkipHydration: 'true' },\n    imports: [ DxIntegrationModule ],\n    providers: [\n        DxTemplateHost,\n        WatcherHelper,\n        NestedOptionHost,\n        IterableDifferHelper\n    ]\n})\nexport class DxChartComponent extends DxComponent implements OnDestroy, OnChanges, DoCheck {\n\n    @ContentChildren(PROPERTY_TOKEN_annotations)\n    set _annotationsContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('annotations', value);\n    }\n\n    @ContentChildren(PROPERTY_TOKEN_breaks)\n    set _breaksContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('breaks', value);\n    }\n\n    @ContentChildren(PROPERTY_TOKEN_constantLines)\n    set _constantLinesContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('constantLines', value);\n    }\n\n    @ContentChildren(PROPERTY_TOKEN_panes)\n    set _panesContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('panes', value);\n    }\n\n    @ContentChildren(PROPERTY_TOKEN_series)\n    set _seriesContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('series', value);\n    }\n\n    @ContentChildren(PROPERTY_TOKEN_strips)\n    set _stripsContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('strips', value);\n    }\n\n    @ContentChildren(PROPERTY_TOKEN_valueAxis)\n    set _valueAxisContentChildren(value: QueryList<CollectionNestedOption>) {\n        this.setChildren('valueAxis', value);\n    }\n\n    instance: DxChart = null;\n\n    /**\n     * Specifies adaptive layout properties.\n    \n     */\n    @Input()\n    get adaptiveLayout(): { height?: number, keepLabels?: boolean, width?: number } {\n        return this._getOption('adaptiveLayout');\n    }\n    set adaptiveLayout(value: { height?: number, keepLabels?: boolean, width?: number }) {\n        this._setOption('adaptiveLayout', value);\n    }\n\n\n    /**\n     * Specifies whether to adjust the value axis&apos;s visualRange when the argument axis is being zoomed or panned.\n    \n     */\n    @Input()\n    get adjustOnZoom(): boolean {\n        return this._getOption('adjustOnZoom');\n    }\n    set adjustOnZoom(value: boolean) {\n        this._setOption('adjustOnZoom', value);\n    }\n\n\n    /**\n     * Specifies animation properties.\n    \n     */\n    @Input()\n    get animation(): boolean | { duration?: number, easing?: AnimationEaseMode, enabled?: boolean, maxPointCountSupported?: number } {\n        return this._getOption('animation');\n    }\n    set animation(value: boolean | { duration?: number, easing?: AnimationEaseMode, enabled?: boolean, maxPointCountSupported?: number }) {\n        this._setOption('animation', value);\n    }\n\n\n    /**\n     * Specifies the annotation collection.\n    \n     */\n    @Input()\n    get annotations(): Array<any | dxChartAnnotationConfig> {\n        return this._getOption('annotations');\n    }\n    set annotations(value: Array<any | dxChartAnnotationConfig>) {\n        this._setOption('annotations', value);\n    }\n\n\n    /**\n     * Configures the argument axis.\n    \n     */\n    @Input()\n    get argumentAxis(): { aggregatedPointsPosition?: AggregatedPointsPosition, aggregationGroupWidth?: number | undefined, aggregationInterval?: number | TimeInterval | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, allowDecimals?: boolean | undefined, argumentType?: ChartsDataType | undefined, axisDivisionFactor?: number, breaks?: Array<ScaleBreak> | { endValue?: Date | number | string | undefined, startValue?: Date | number | string | undefined }[], breakStyle?: { color?: string, line?: ScaleBreakLineStyle, width?: number }, categories?: Array<Date | number | string>, color?: string, constantLines?: { color?: string, dashStyle?: DashStyle, displayBehindSeries?: boolean, extendAxis?: boolean, label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, position?: RelativePosition, text?: string | undefined, verticalAlignment?: VerticalAlignment, visible?: boolean }, paddingLeftRight?: number, paddingTopBottom?: number, value?: Date | number | string | undefined, width?: number }[], constantLineStyle?: { color?: string, dashStyle?: DashStyle, label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, position?: RelativePosition, verticalAlignment?: VerticalAlignment, visible?: boolean }, paddingLeftRight?: number, paddingTopBottom?: number, width?: number }, customPosition?: Date | number | string | undefined, customPositionAxis?: string | undefined, discreteAxisDivisionMode?: DiscreteAxisDivisionMode, endOnTick?: boolean, grid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, holidays?: Array<Date | string> | Array<number>, hoverMode?: ArgumentAxisHoverMode, inverted?: boolean, label?: { alignment?: HorizontalAlignment | undefined, customizeHint?: ((argument: { value: Date | number | string, valueText: string }) => string), customizeText?: ((argument: { value: Date | number | string, valueText: string }) => string), displayMode?: ChartLabelDisplayMode, font?: Font, format?: Format | undefined, indentFromAxis?: number, overlappingBehavior?: ChartsAxisLabelOverlap, position?: Position | RelativePosition, rotationAngle?: number, staggeringSpacing?: number, template?: any, textOverflow?: TextOverflow, visible?: boolean, wordWrap?: WordWrap }, linearThreshold?: number | undefined, logarithmBase?: number, maxValueMargin?: number | undefined, minorGrid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, minorTick?: { color?: string, length?: number, opacity?: number, shift?: number, visible?: boolean, width?: number }, minorTickCount?: number | undefined, minorTickInterval?: number | TimeInterval | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, minValueMargin?: number | undefined, minVisualRangeLength?: number | TimeInterval | undefined | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, offset?: number | undefined, opacity?: number | undefined, placeholderSize?: number, position?: Position, singleWorkdays?: Array<Date | string> | Array<number>, strips?: { color?: string | undefined, endValue?: Date | number | string | undefined, label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, text?: string | undefined, verticalAlignment?: VerticalAlignment }, paddingLeftRight?: number, paddingTopBottom?: number, startValue?: Date | number | string | undefined }[], stripStyle?: { label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, verticalAlignment?: VerticalAlignment }, paddingLeftRight?: number, paddingTopBottom?: number }, tick?: { color?: string, length?: number, opacity?: number | undefined, shift?: number, visible?: boolean, width?: number }, tickInterval?: number | TimeInterval | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, title?: string | { alignment?: HorizontalAlignment, font?: Font, margin?: number, text?: string | undefined, textOverflow?: TextOverflow, wordWrap?: WordWrap }, type?: AxisScaleType | undefined, valueMarginsEnabled?: boolean, visible?: boolean, visualRange?: Array<Date | number | string> | CommonChartTypes.VisualRange, visualRangeUpdateMode?: VisualRangeUpdateMode, wholeRange?: Array<Date | number | string> | undefined | CommonChartTypes.VisualRange, width?: number, workdaysOnly?: boolean, workWeek?: Array<number> } {\n        return this._getOption('argumentAxis');\n    }\n    set argumentAxis(value: { aggregatedPointsPosition?: AggregatedPointsPosition, aggregationGroupWidth?: number | undefined, aggregationInterval?: number | TimeInterval | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, allowDecimals?: boolean | undefined, argumentType?: ChartsDataType | undefined, axisDivisionFactor?: number, breaks?: Array<ScaleBreak> | { endValue?: Date | number | string | undefined, startValue?: Date | number | string | undefined }[], breakStyle?: { color?: string, line?: ScaleBreakLineStyle, width?: number }, categories?: Array<Date | number | string>, color?: string, constantLines?: { color?: string, dashStyle?: DashStyle, displayBehindSeries?: boolean, extendAxis?: boolean, label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, position?: RelativePosition, text?: string | undefined, verticalAlignment?: VerticalAlignment, visible?: boolean }, paddingLeftRight?: number, paddingTopBottom?: number, value?: Date | number | string | undefined, width?: number }[], constantLineStyle?: { color?: string, dashStyle?: DashStyle, label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, position?: RelativePosition, verticalAlignment?: VerticalAlignment, visible?: boolean }, paddingLeftRight?: number, paddingTopBottom?: number, width?: number }, customPosition?: Date | number | string | undefined, customPositionAxis?: string | undefined, discreteAxisDivisionMode?: DiscreteAxisDivisionMode, endOnTick?: boolean, grid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, holidays?: Array<Date | string> | Array<number>, hoverMode?: ArgumentAxisHoverMode, inverted?: boolean, label?: { alignment?: HorizontalAlignment | undefined, customizeHint?: ((argument: { value: Date | number | string, valueText: string }) => string), customizeText?: ((argument: { value: Date | number | string, valueText: string }) => string), displayMode?: ChartLabelDisplayMode, font?: Font, format?: Format | undefined, indentFromAxis?: number, overlappingBehavior?: ChartsAxisLabelOverlap, position?: Position | RelativePosition, rotationAngle?: number, staggeringSpacing?: number, template?: any, textOverflow?: TextOverflow, visible?: boolean, wordWrap?: WordWrap }, linearThreshold?: number | undefined, logarithmBase?: number, maxValueMargin?: number | undefined, minorGrid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, minorTick?: { color?: string, length?: number, opacity?: number, shift?: number, visible?: boolean, width?: number }, minorTickCount?: number | undefined, minorTickInterval?: number | TimeInterval | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, minValueMargin?: number | undefined, minVisualRangeLength?: number | TimeInterval | undefined | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, offset?: number | undefined, opacity?: number | undefined, placeholderSize?: number, position?: Position, singleWorkdays?: Array<Date | string> | Array<number>, strips?: { color?: string | undefined, endValue?: Date | number | string | undefined, label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, text?: string | undefined, verticalAlignment?: VerticalAlignment }, paddingLeftRight?: number, paddingTopBottom?: number, startValue?: Date | number | string | undefined }[], stripStyle?: { label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, verticalAlignment?: VerticalAlignment }, paddingLeftRight?: number, paddingTopBottom?: number }, tick?: { color?: string, length?: number, opacity?: number | undefined, shift?: number, visible?: boolean, width?: number }, tickInterval?: number | TimeInterval | { days?: number, hours?: number, milliseconds?: number, minutes?: number, months?: number, quarters?: number, seconds?: number, weeks?: number, years?: number }, title?: string | { alignment?: HorizontalAlignment, font?: Font, margin?: number, text?: string | undefined, textOverflow?: TextOverflow, wordWrap?: WordWrap }, type?: AxisScaleType | undefined, valueMarginsEnabled?: boolean, visible?: boolean, visualRange?: Array<Date | number | string> | CommonChartTypes.VisualRange, visualRangeUpdateMode?: VisualRangeUpdateMode, wholeRange?: Array<Date | number | string> | undefined | CommonChartTypes.VisualRange, width?: number, workdaysOnly?: boolean, workWeek?: Array<number> }) {\n        this._setOption('argumentAxis', value);\n    }\n\n\n    /**\n     * Specifies whether to hide series point markers automatically to reduce visual clutter.\n    \n     */\n    @Input()\n    get autoHidePointMarkers(): boolean {\n        return this._getOption('autoHidePointMarkers');\n    }\n    set autoHidePointMarkers(value: boolean) {\n        this._setOption('autoHidePointMarkers', value);\n    }\n\n\n    /**\n     * Controls the padding and consequently the width of a group of bars with the same argument using relative units. Ignored if the barGroupWidth property is set.\n    \n     */\n    @Input()\n    get barGroupPadding(): number {\n        return this._getOption('barGroupPadding');\n    }\n    set barGroupPadding(value: number) {\n        this._setOption('barGroupPadding', value);\n    }\n\n\n    /**\n     * Specifies a fixed width for groups of bars with the same argument, measured in pixels. Takes precedence over the barGroupPadding property.\n    \n     */\n    @Input()\n    get barGroupWidth(): number | undefined {\n        return this._getOption('barGroupWidth');\n    }\n    set barGroupWidth(value: number | undefined) {\n        this._setOption('barGroupWidth', value);\n    }\n\n\n    /**\n     * Specifies settings common for all annotations in the chart.\n    \n     */\n    @Input()\n    get commonAnnotationSettings(): dxChartCommonAnnotationConfig {\n        return this._getOption('commonAnnotationSettings');\n    }\n    set commonAnnotationSettings(value: dxChartCommonAnnotationConfig) {\n        this._setOption('commonAnnotationSettings', value);\n    }\n\n\n    /**\n     * Defines common settings for both the argument and value axis in a chart.\n    \n     */\n    @Input()\n    get commonAxisSettings(): { aggregatedPointsPosition?: AggregatedPointsPosition, allowDecimals?: boolean | undefined, breakStyle?: { color?: string, line?: ScaleBreakLineStyle, width?: number }, color?: string, constantLineStyle?: { color?: string, dashStyle?: DashStyle, label?: { font?: Font, position?: RelativePosition, visible?: boolean }, paddingLeftRight?: number, paddingTopBottom?: number, width?: number }, discreteAxisDivisionMode?: DiscreteAxisDivisionMode, endOnTick?: boolean | undefined, grid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, inverted?: boolean, label?: { alignment?: HorizontalAlignment | undefined, displayMode?: ChartLabelDisplayMode, font?: Font, indentFromAxis?: number, overlappingBehavior?: ChartsAxisLabelOverlap, position?: Position | RelativePosition, rotationAngle?: number, staggeringSpacing?: number, template?: any, textOverflow?: TextOverflow, visible?: boolean, wordWrap?: WordWrap }, maxValueMargin?: number | undefined, minorGrid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, minorTick?: { color?: string, length?: number, opacity?: number, shift?: number, visible?: boolean, width?: number }, minValueMargin?: number | undefined, opacity?: number | undefined, placeholderSize?: number, stripStyle?: { label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, verticalAlignment?: VerticalAlignment }, paddingLeftRight?: number, paddingTopBottom?: number }, tick?: { color?: string, length?: number, opacity?: number | undefined, shift?: number, visible?: boolean, width?: number }, title?: { alignment?: HorizontalAlignment, font?: Font, margin?: number, textOverflow?: TextOverflow, wordWrap?: WordWrap }, valueMarginsEnabled?: boolean, visible?: boolean, width?: number } {\n        return this._getOption('commonAxisSettings');\n    }\n    set commonAxisSettings(value: { aggregatedPointsPosition?: AggregatedPointsPosition, allowDecimals?: boolean | undefined, breakStyle?: { color?: string, line?: ScaleBreakLineStyle, width?: number }, color?: string, constantLineStyle?: { color?: string, dashStyle?: DashStyle, label?: { font?: Font, position?: RelativePosition, visible?: boolean }, paddingLeftRight?: number, paddingTopBottom?: number, width?: number }, discreteAxisDivisionMode?: DiscreteAxisDivisionMode, endOnTick?: boolean | undefined, grid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, inverted?: boolean, label?: { alignment?: HorizontalAlignment | undefined, displayMode?: ChartLabelDisplayMode, font?: Font, indentFromAxis?: number, overlappingBehavior?: ChartsAxisLabelOverlap, position?: Position | RelativePosition, rotationAngle?: number, staggeringSpacing?: number, template?: any, textOverflow?: TextOverflow, visible?: boolean, wordWrap?: WordWrap }, maxValueMargin?: number | undefined, minorGrid?: { color?: string, opacity?: number | undefined, visible?: boolean, width?: number }, minorTick?: { color?: string, length?: number, opacity?: number, shift?: number, visible?: boolean, width?: number }, minValueMargin?: number | undefined, opacity?: number | undefined, placeholderSize?: number, stripStyle?: { label?: { font?: Font, horizontalAlignment?: HorizontalAlignment, verticalAlignment?: VerticalAlignment }, paddingLeftRight?: number, paddingTopBottom?: number }, tick?: { color?: string, length?: number, opacity?: number | undefined, shift?: number, visible?: boolean, width?: number }, title?: { alignment?: HorizontalAlignment, font?: Font, margin?: number, textOverflow?: TextOverflow, wordWrap?: WordWrap }, valueMarginsEnabled?: boolean, visible?: boolean, width?: number }) {\n        this._setOption('commonAxisSettings', value);\n    }\n\n\n    /**\n     * Defines common settings for all panes in a chart.\n    \n     */\n    @Input()\n    get commonPaneSettings(): { backgroundColor?: ChartsColor | string, border?: { bottom?: boolean, color?: string, dashStyle?: DashStyle, left?: boolean, opacity?: number | undefined, right?: boolean, top?: boolean, visible?: boolean, width?: number } } {\n        return this._getOption('commonPaneSettings');\n    }\n    set commonPaneSettings(value: { backgroundColor?: ChartsColor | string, border?: { bottom?: boolean, color?: string, dashStyle?: DashStyle, left?: boolean, opacity?: number | undefined, right?: boolean, top?: boolean, visible?: boolean, width?: number } }) {\n        this._setOption('commonPaneSettings', value);\n    }\n\n\n    /**\n     * Specifies settings common for all series in the chart.\n    \n     */\n    @Input()\n    get commonSeriesSettings(): { aggregation?: { calculate?: ((aggregationInfo: chartPointAggregationInfoObject, series: chartSeriesObject) => Record<string, any> | Array<Record<string, any>>) | undefined, enabled?: boolean, method?: ChartSeriesAggregationMethod }, area?: any, argumentField?: string, axis?: string | undefined, bar?: any, barOverlapGroup?: string | undefined, barPadding?: number | undefined, barWidth?: number | undefined, border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, bubble?: any, candlestick?: any, closeValueField?: string, color?: ChartsColor | string | undefined, cornerRadius?: number, dashStyle?: DashStyle, fullstackedarea?: any, fullstackedbar?: any, fullstackedline?: any, fullstackedspline?: any, fullstackedsplinearea?: any, highValueField?: string, hoverMode?: SeriesHoverMode, hoverStyle?: { border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, dashStyle?: DashStyle, hatching?: { direction?: HatchDirection, opacity?: number, step?: number, width?: number }, highlight?: boolean, width?: number }, ignoreEmptyPoints?: boolean, innerColor?: string, label?: { alignment?: HorizontalAlignment, argumentFormat?: Format | undefined, backgroundColor?: string | undefined, border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, connector?: { color?: string | undefined, visible?: boolean, width?: number }, customizeText?: ((pointInfo: any) => string), displayFormat?: string | undefined, font?: Font, format?: Format | undefined, horizontalOffset?: number, position?: RelativePosition, rotationAngle?: number, showForZeroValues?: boolean, verticalOffset?: number, visible?: boolean }, line?: any, lowValueField?: string, maxLabelCount?: number | undefined, minBarSize?: number | undefined, opacity?: number, openValueField?: string, pane?: string, point?: { border?: { color?: string | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, hoverMode?: PointInteractionMode, hoverStyle?: { border?: { color?: string | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, size?: number | undefined }, image?: string | undefined | { height?: number | { rangeMaxPoint?: number | undefined, rangeMinPoint?: number | undefined }, url?: string | undefined | { rangeMaxPoint?: string | undefined, rangeMinPoint?: string | undefined }, width?: number | { rangeMaxPoint?: number | undefined, rangeMinPoint?: number | undefined } }, selectionMode?: PointInteractionMode, selectionStyle?: { border?: { color?: string | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, size?: number | undefined }, size?: number, symbol?: PointSymbol, visible?: boolean }, rangearea?: any, rangebar?: any, rangeValue1Field?: string, rangeValue2Field?: string, reduction?: { color?: string, level?: FinancialChartReductionLevel }, scatter?: any, selectionMode?: SeriesSelectionMode, selectionStyle?: { border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, dashStyle?: DashStyle, hatching?: { direction?: HatchDirection, opacity?: number, step?: number, width?: number }, highlight?: boolean, width?: number }, showInLegend?: boolean, sizeField?: string, spline?: any, splinearea?: any, stack?: string, stackedarea?: any, stackedbar?: any, stackedline?: any, stackedspline?: any, stackedsplinearea?: any, steparea?: any, stepline?: any, stock?: any, tagField?: string, type?: SeriesType, valueErrorBar?: { color?: string, displayMode?: ValueErrorBarDisplayMode, edgeLength?: number, highValueField?: string | undefined, lineWidth?: number, lowValueField?: string | undefined, opacity?: number | undefined, type?: undefined | ValueErrorBarType, value?: number }, valueField?: string, visible?: boolean, width?: number } {\n        return this._getOption('commonSeriesSettings');\n    }\n    set commonSeriesSettings(value: { aggregation?: { calculate?: ((aggregationInfo: chartPointAggregationInfoObject, series: chartSeriesObject) => Record<string, any> | Array<Record<string, any>>) | undefined, enabled?: boolean, method?: ChartSeriesAggregationMethod }, area?: any, argumentField?: string, axis?: string | undefined, bar?: any, barOverlapGroup?: string | undefined, barPadding?: number | undefined, barWidth?: number | undefined, border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, bubble?: any, candlestick?: any, closeValueField?: string, color?: ChartsColor | string | undefined, cornerRadius?: number, dashStyle?: DashStyle, fullstackedarea?: any, fullstackedbar?: any, fullstackedline?: any, fullstackedspline?: any, fullstackedsplinearea?: any, highValueField?: string, hoverMode?: SeriesHoverMode, hoverStyle?: { border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, dashStyle?: DashStyle, hatching?: { direction?: HatchDirection, opacity?: number, step?: number, width?: number }, highlight?: boolean, width?: number }, ignoreEmptyPoints?: boolean, innerColor?: string, label?: { alignment?: HorizontalAlignment, argumentFormat?: Format | undefined, backgroundColor?: string | undefined, border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, connector?: { color?: string | undefined, visible?: boolean, width?: number }, customizeText?: ((pointInfo: any) => string), displayFormat?: string | undefined, font?: Font, format?: Format | undefined, horizontalOffset?: number, position?: RelativePosition, rotationAngle?: number, showForZeroValues?: boolean, verticalOffset?: number, visible?: boolean }, line?: any, lowValueField?: string, maxLabelCount?: number | undefined, minBarSize?: number | undefined, opacity?: number, openValueField?: string, pane?: string, point?: { border?: { color?: string | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, hoverMode?: PointInteractionMode, hoverStyle?: { border?: { color?: string | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, size?: number | undefined }, image?: string | undefined | { height?: number | { rangeMaxPoint?: number | undefined, rangeMinPoint?: number | undefined }, url?: string | undefined | { rangeMaxPoint?: string | undefined, rangeMinPoint?: string | undefined }, width?: number | { rangeMaxPoint?: number | undefined, rangeMinPoint?: number | undefined } }, selectionMode?: PointInteractionMode, selectionStyle?: { border?: { color?: string | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, size?: number | undefined }, size?: number, symbol?: PointSymbol, visible?: boolean }, rangearea?: any, rangebar?: any, rangeValue1Field?: string, rangeValue2Field?: string, reduction?: { color?: string, level?: FinancialChartReductionLevel }, scatter?: any, selectionMode?: SeriesSelectionMode, selectionStyle?: { border?: { color?: string | undefined, dashStyle?: DashStyle | undefined, visible?: boolean, width?: number }, color?: ChartsColor | string | undefined, dashStyle?: DashStyle, hatching?: { direction?: HatchDirection, opacity?: number, step?: number, width?: number }, highlight?: boolean, width?: number }, showInLegend?: boolean, sizeField?: string, spline?: any, splinearea?: any, stack?: string, stackedarea?: any, stackedbar?: any, stackedline?: any, stackedspline?: any, stackedsplinearea?: any, steparea?: any, stepline?: any, stock?: any, tagField?: string, type?: SeriesType, valueErrorBar?: { color?: string, displayMode?: ValueErrorBarDisplayMode, edgeLength?: number, highValueField?: string | undefined, lineWidth?: number, lowValueField?: string | undefined, opacity?: number | undefined, type?: undefined | ValueErrorBarType, value?: number }, valueField?: string, visible?: boolean, width?: number }) {\n        this._setOption('commonSeriesSettings', value);\n    }\n\n\n    /**\n     * Specifies background color of the chart container.\n    \n     */\n    @Input()\n    get containerBackgroundColor(): string {\n        return this._getOption('containerBackgroundColor');\n    }\n    set containerBackgroundColor(value: string) {\n        this._setOption('containerBackgroundColor', value);\n    }\n\n\n    /**\n     * Configures the crosshair feature.\n    \n     */\n    @Input()\n    get crosshair(): { color?: string, dashStyle?: DashStyle, enabled?: boolean, horizontalLine?: boolean | { color?: string, dashStyle?: DashStyle, label?: { backgroundColor?: string, customizeText?: ((info: { point: chartPointObject, value: Date | number | string, valueText: string }) => string), font?: Font, format?: Format | undefined, visible?: boolean }, opacity?: number | undefined, visible?: boolean, width?: number }, label?: { backgroundColor?: string, customizeText?: ((info: { point: chartPointObject, value: Date | number | string, valueText: string }) => string), font?: Font, format?: Format | undefined, visible?: boolean }, opacity?: number | undefined, verticalLine?: boolean | { color?: string, dashStyle?: DashStyle, label?: { backgroundColor?: string, customizeText?: ((info: { point: chartPointObject, value: Date | number | string, valueText: string }) => string), font?: Font, format?: Format | undefined, visible?: boolean }, opacity?: number | undefined, visible?: boolean, width?: number }, width?: number } {\n        return this._getOption('crosshair');\n    }\n    set crosshair(value: { color?: string, dashStyle?: DashStyle, enabled?: boolean, horizontalLine?: boolean | { color?: string, dashStyle?: DashStyle, label?: { backgroundColor?: string, customizeText?: ((info: { point: chartPointObject, value: Date | number | string, valueText: string }) => string), font?: Font, format?: Format | undefined, visible?: boolean }, opacity?: number | undefined, visible?: boolean, width?: number }, label?: { backgroundColor?: string, customizeText?: ((info: { point: chartPointObject, value: Date | number | string, valueText: string }) => string), font?: Font, format?: Format | undefined, visible?: boolean }, opacity?: number | undefined, verticalLine?: boolean | { color?: string, dashStyle?: DashStyle, label?: { backgroundColor?: string, customizeText?: ((info: { point: chartPointObject, value: Date | number | string, valueText: string }) => string), font?: Font, format?: Format | undefined, visible?: boolean }, opacity?: number | undefined, visible?: boolean, width?: number }, width?: number }) {\n        this._setOption('crosshair', value);\n    }\n\n\n    /**\n     * Customizes an individual annotation.\n    \n     */\n    @Input()\n    get customizeAnnotation(): ((annotation: dxChartAnnotationConfig | any) => dxChartAnnotationConfig) | undefined {\n        return this._getOption('customizeAnnotation');\n    }\n    set customizeAnnotation(value: ((annotation: dxChartAnnotationConfig | any) => dxChartAnnotationConfig) | undefined) {\n        this._setOption('customizeAnnotation', value);\n    }\n\n\n    /**\n     * Customizes the appearance of an individual point label.\n    \n     */\n    @Input()\n    get customizeLabel(): ((pointInfo: any) => SeriesLabel) {\n        return this._getOption('customizeLabel');\n    }\n    set customizeLabel(value: ((pointInfo: any) => SeriesLabel)) {\n        this._setOption('customizeLabel', value);\n    }\n\n\n    /**\n     * Customizes the appearance of an individual series point.\n    \n     */\n    @Input()\n    get customizePoint(): ((pointInfo: any) => SeriesPoint) {\n        return this._getOption('customizePoint');\n    }\n    set customizePoint(value: ((pointInfo: any) => SeriesPoint)) {\n        this._setOption('customizePoint', value);\n    }\n\n\n    /**\n     * Processes data before visualizing it.\n    \n     */\n    @Input()\n    get dataPrepareSettings(): { checkTypeForAllData?: boolean, convertToAxisDataType?: boolean, sortingMethod?: boolean | ((a: any, b: any) => number) } {\n        return this._getOption('dataPrepareSettings');\n    }\n    set dataPrepareSettings(value: { checkTypeForAllData?: boolean, convertToAxisDataType?: boolean, sortingMethod?: boolean | ((a: any, b: any) => number) }) {\n        this._setOption('dataPrepareSettings', value);\n    }\n\n\n    /**\n     * Binds the UI component to data.\n    \n     */\n    @Input()\n    get dataSource(): Array<any> | DataSource | DataSourceOptions | null | Store | string {\n        return this._getOption('dataSource');\n    }\n    set dataSource(value: Array<any> | DataSource | DataSourceOptions | null | Store | string) {\n        this._setOption('dataSource', value);\n    }\n\n\n    /**\n     * Specifies which pane should be used by default.\n    \n     */\n    @Input()\n    get defaultPane(): string | undefined {\n        return this._getOption('defaultPane');\n    }\n    set defaultPane(value: string | undefined) {\n        this._setOption('defaultPane', value);\n    }\n\n\n    /**\n     * Specifies whether the UI component responds to user interaction.\n    \n     */\n    @Input()\n    get disabled(): boolean {\n        return this._getOption('disabled');\n    }\n    set disabled(value: boolean) {\n        this._setOption('disabled', value);\n    }\n\n\n    /**\n     * Specifies the global attributes to be attached to the UI component&apos;s container element.\n    \n     */\n    @Input()\n    get elementAttr(): Record<string, any> {\n        return this._getOption('elementAttr');\n    }\n    set elementAttr(value: Record<string, any>) {\n        this._setOption('elementAttr', value);\n    }\n\n\n    /**\n     * Configures the exporting and printing features.\n    \n     */\n    @Inp