import * as React from 'react';
import { IgrAxis } from './igr-axis';
import { IgrSeries } from './igr-series';
import { GridMode } from './GridMode';
import { IgrSeriesViewer, IIgrSeriesViewerProps } from './igr-series-viewer';
import { XamDataChart } from './XamDataChart';
import { SeriesCollection } from './igr-series-collection';
import { AxisCollection } from './igr-axis-collection';
/**
 * Represents a chart area containing axes, series, an optional legend and other hosted content.
*/
export declare class IgrDataChart extends IgrSeriesViewer<IIgrDataChartProps> {
    contentAxes: IgrAxis[];
    contentSeries: IgrSeries[];
    private _height;
    private _width;
    height: string;
    /**
     * Gets or sets the legend used for the current chart.
    */
    legend: any;
    private _updateContentChildren;
    protected getSeriesRef(child: any): void;
    private _contentChildren;
    private _contentChildrenActual;
    private _contentChildrenMap;
    private _contentChildrenUnresolved;
    private _childrenDiffer;
    private _getMainRef;
    private _elRef;
    render(): React.DetailedReactHTMLElement<{
        ref: (ref: any) => void;
        children: any;
    }, any>;
    protected _tooltipRef(t: any): void;
    componentDidMount(): void;
    width: string;
    /**
     * The series actually present in the chart. Do not directly modify this array.
     * This array's contents can be modified by causing React to reproject the child content.
     * Or adding and removing series from the manual series collection on the series property.
     */
    actualSeries: IgrSeries[];
    /**
     * The axes actually present in the chart. Do not directly modify this array.
     * This array's contents can be modified by causing React to reproject the child content.
     * Or adding and removing axes from the manual axes collection on the axes property.
     */
    actualAxes: IgrAxis[];
    private _container;
    private _series;
    /**
     * A collection or manually added series for the chart.
    */
    readonly series: SeriesCollection;
    private _axes;
    /**
     * A collection or manually added axes for the chart.
    */
    readonly axes: AxisCollection;
    constructor(props: IIgrDataChartProps);
    componentWillUnmount(): void;
    private _initialized;
    private _wrapper;
    protected createImplementation(): XamDataChart;
    private _chart;
    private _dataSource;
    dataSource: any;
    bindData(): void;
    private _axesAdapter;
    private _seriesAdapter;
    initializeContent(): void;
    private _ensureTooltipCreated;
    private _defaultTooltips;
    private _ensureDefaultTooltip;
    private _onDefaultTooltipsReady;
    private _activeTooltips;
    private _activeTooltipElements;
    private _currentTooltips;
    private _uniqueTooltipId;
    private createTooltip;
    private _updateTooltipState;
    readonly i: XamDataChart;
    /**
 * Gets or sets whether to use a square aspect ratio for the chart. This is locked to true for polar and radial charts.
*
* Set `isSquare` to true to constrain the chart to a square, using the minimum of its height and width.
*
* ```html
* <igx-data-chart [dataSource]="data"
*     isSquare="true"
*     width="800px"
*     height="400px">
*   <igx-category-x-axis #xAxis
*     label="label">
*   </igx-category-x-axis>
*   <igx-numeric-y-axis #yAxis
*     majorStroke="green">
*   </igx-numeric-y-axis>
*
*   <igx-column-series
*     [xAxis]="xAxis"
*     [yAxis]="yAxis"
*     valueMemberPath="value">
*   </igx-column-series>
* </igx-data-chart>
* ```
*/
    isSquare: boolean;
    /**
     * A number between 0 and 1 determining the scale of the horizontal zoom.
     * This property is effectively a shortcut to the Width of the WindowRect property.
    *
    * To programmatically change the horizontal zoom level, set `windowScaleHorizontal` to a value between 0 and 1.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     windowScaleHorizontal="0.75">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    windowScaleHorizontal: number;
    /**
     * A number between 0 and 1 determining the scale of the vertical zoom.
     * This property is effectively a shortcut to the Height of the WindowRect property.
    *
    * To programmatically change the vertical zoom level, set `windowScaleVertical` to a value between 0 and 1.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     windowScaleVertical="0.75">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    windowScaleVertical: number;
    /**
     * A number between 0 and 1 determining the scale of the horizontal zoom.
     * This property is effectively a shortcut to the Width of the ActualWindowRect property.
    */
    actualWindowScaleHorizontal: number;
    /**
     * A number between 0 and 1 determining the scale of the vertical zoom.
     * This property is effectively a shortcut to the Height of the ActualWindowRect property.
    */
    actualWindowScaleVertical: number;
    /**
     * Gets or sets horizontal zoomability of the current control
    *
    * Set `isHorizontalZoomEnabled` to enable or disable horizontal zooming.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     isHorizontalZoomEnabled="true">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    isHorizontalZoomEnabled: boolean;
    /**
     * Gets or sets vertical zoomability of the current control
    *
    * Set `isVerticalZoomEnabled` to enable or disable vertical zooming.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     isVerticalZoomEnabled="true">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    isVerticalZoomEnabled: boolean;
    /**
     * Gets or sets how grid lines are rendered in relation to series.
    *
    *  Try setting the `gridMode` property to bring your grid lines in front of the data series.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     gridMode="beforeSeries">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis
    *     majorStroke="green">
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    gridMode: GridMode;
    /**
     * Gets or sets a value indicating whether grid and tick lines are aligned to device pixels.
    */
    alignsGridLinesToPixels: boolean;
    /**
     * Gets or sets the palette of brushes to use for coloring the chart series.
    *
    * `brushes` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     brushes="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    brushes: string[];
    /**
     * Gets or sets the MarkerBrushes property.
     * The brushes property defines the palette from which automatically assigned series brushes are selected.
    *
    * `markerBrushes` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     markerBrushes="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    markerBrushes: string[];
    /**
     * Gets or sets the palette of brushes to use for outlines on the chart series.
    *
    * `outlines` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     outlines="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    outlines: string[];
    /**
     * Gets or sets the MarkerOutlines property.
     * The brushes property defines the palette from which automatically assigned series brushes are selected.
    *
    * `markerOutlines` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     markerOutlines="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    markerOutlines: string[];
    /**
     * Gets or sets the DefaultAxisStroke property.
     * The DefaultAxisStroke property defines the brush which is used by the axes when no Axis.Stroke is set.
    */
    defaultAxisStroke: string;
    /**
     * Gets or sets the DefaultAxisMajorStroke property.
     * The DefaultAxisMajorStroke property defines the brush which is used by the axes when no Axis.MajorStroke is set.
    */
    defaultAxisMajorStroke: string;
    /**
     * Gets or sets the DefaultAxisMinorStroke property.
     * The DefaultAxisMinorStroke property defines the brush which is used by the axes when no Axis.MinorStroke is set.
    */
    defaultAxisMinorStroke: string;
    /**
     * Margin applied to the left of the plot area.
    */
    plotAreaMarginLeft: number;
    /**
     * Margin applied above the plot area.
    */
    plotAreaMarginTop: number;
    /**
     * Margin applied to the right of the plot area.
    */
    plotAreaMarginRight: number;
    /**
     * Margin applied below the plot area.
    */
    plotAreaMarginBottom: number;
    /**
 * Notifies the chart that the CSS styles in effect have been updated.

*/
    styleUpdated(): void;
    /**
     * Export serialized visual data.
    
    */
    exportSerializedVisualData(): string;
}
export interface IIgrDataChartProps extends IIgrSeriesViewerProps {
    width?: string;
    height?: string;
    /**
  * Gets or sets the data for the chart to use. This can be overriden at the series and axis level.
  */
    dataSource?: any[];
    /**
 * Gets or sets whether to use a square aspect ratio for the chart. This is locked to true for polar and radial charts.
*
* Set `isSquare` to true to constrain the chart to a square, using the minimum of its height and width.
*
* ```html
* <igx-data-chart [dataSource]="data"
*     isSquare="true"
*     width="800px"
*     height="400px">
*   <igx-category-x-axis #xAxis
*     label="label">
*   </igx-category-x-axis>
*   <igx-numeric-y-axis #yAxis
*     majorStroke="green">
*   </igx-numeric-y-axis>
*
*   <igx-column-series
*     [xAxis]="xAxis"
*     [yAxis]="yAxis"
*     valueMemberPath="value">
*   </igx-column-series>
* </igx-data-chart>
* ```
*/
    isSquare?: boolean | string;
    /**
     * A number between 0 and 1 determining the scale of the horizontal zoom.
     * This property is effectively a shortcut to the Width of the WindowRect property.
    *
    * To programmatically change the horizontal zoom level, set `windowScaleHorizontal` to a value between 0 and 1.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     windowScaleHorizontal="0.75">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    windowScaleHorizontal?: number | string;
    /**
     * A number between 0 and 1 determining the scale of the vertical zoom.
     * This property is effectively a shortcut to the Height of the WindowRect property.
    *
    * To programmatically change the vertical zoom level, set `windowScaleVertical` to a value between 0 and 1.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     windowScaleVertical="0.75">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    windowScaleVertical?: number | string;
    /**
     * A number between 0 and 1 determining the scale of the horizontal zoom.
     * This property is effectively a shortcut to the Width of the ActualWindowRect property.
    */
    actualWindowScaleHorizontal?: number | string;
    /**
     * A number between 0 and 1 determining the scale of the vertical zoom.
     * This property is effectively a shortcut to the Height of the ActualWindowRect property.
    */
    actualWindowScaleVertical?: number | string;
    /**
     * Gets or sets horizontal zoomability of the current control
    *
    * Set `isHorizontalZoomEnabled` to enable or disable horizontal zooming.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     isHorizontalZoomEnabled="true">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    isHorizontalZoomEnabled?: boolean | string;
    /**
     * Gets or sets vertical zoomability of the current control
    *
    * Set `isVerticalZoomEnabled` to enable or disable vertical zooming.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     isVerticalZoomEnabled="true">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    isVerticalZoomEnabled?: boolean | string;
    /**
     * Gets or sets how grid lines are rendered in relation to series.
    *
    *  Try setting the `gridMode` property to bring your grid lines in front of the data series.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     gridMode="beforeSeries">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis
    *     majorStroke="green">
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    gridMode?: GridMode | string;
    /**
     * Gets or sets a value indicating whether grid and tick lines are aligned to device pixels.
    */
    alignsGridLinesToPixels?: boolean | string;
    /**
     * Gets or sets the palette of brushes to use for coloring the chart series.
    *
    * `brushes` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     brushes="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    brushes?: string[] | string;
    /**
     * Gets or sets the MarkerBrushes property.
     * The brushes property defines the palette from which automatically assigned series brushes are selected.
    *
    * `markerBrushes` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     markerBrushes="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    markerBrushes?: string[] | string;
    /**
     * Gets or sets the palette of brushes to use for outlines on the chart series.
    *
    * `outlines` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     outlines="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    outlines?: string[] | string;
    /**
     * Gets or sets the MarkerOutlines property.
     * The brushes property defines the palette from which automatically assigned series brushes are selected.
    *
    * `markerOutlines` can be set declaratively to a list of color strings.
    *
    * ```html
    * <igx-data-chart [dataSource]="data"
    *     markerOutlines="red,green,blue">
    *   <igx-category-x-axis #xAxis
    *     label="label">
    *   </igx-category-x-axis>
    *   <igx-numeric-y-axis #yAxis>
    *   </igx-numeric-y-axis>
    *
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    *   <igx-column-series
    *     [xAxis]="xAxis"
    *     [yAxis]="yAxis"
    *     valueMemberPath="value"
    *     markerType="circle">
    *   </igx-column-series>
    * </igx-data-chart>
    * ```
    */
    markerOutlines?: string[] | string;
    /**
     * Gets or sets the DefaultAxisStroke property.
     * The DefaultAxisStroke property defines the brush which is used by the axes when no Axis.Stroke is set.
    */
    defaultAxisStroke?: string;
    /**
     * Gets or sets the DefaultAxisMajorStroke property.
     * The DefaultAxisMajorStroke property defines the brush which is used by the axes when no Axis.MajorStroke is set.
    */
    defaultAxisMajorStroke?: string;
    /**
     * Gets or sets the DefaultAxisMinorStroke property.
     * The DefaultAxisMinorStroke property defines the brush which is used by the axes when no Axis.MinorStroke is set.
    */
    defaultAxisMinorStroke?: string;
    /**
     * Margin applied to the left of the plot area.
    */
    plotAreaMarginLeft?: number | string;
    /**
     * Margin applied above the plot area.
    */
    plotAreaMarginTop?: number | string;
    /**
     * Margin applied to the right of the plot area.
    */
    plotAreaMarginRight?: number | string;
    /**
     * Margin applied below the plot area.
    */
    plotAreaMarginBottom?: number | string;
}
