UNPKG

igniteui-angular-charts

Version:

Ignite UI Angular charting components for building rich data visualizations for modern web apps.

195 lines (191 loc) 7.9 kB
import { EventEmitter } from '@angular/core'; import { IgxCategoryAxisBaseComponent } from "./igx-category-axis-base-component"; import { CategoryXAxis } from "./CategoryXAxis"; import * as i0 from "@angular/core"; /** * Represents a IgxDataChartComponent category X axis. * * `CategoryXAxis` class represents a IgxDataChartComponent category X axis. * * ```html * <igx-data-chart [dataSource]="data"> * <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> * ``` * * ```ts * let series = new IgxColumnSeriesComponent(); * series.xAxis = this.xAxis; * series.yAxis = this.yAxis; * series.valueMemberPath="value"; * this.chart.series.add(series); * ``` */ export declare class IgxCategoryXAxisComponent extends IgxCategoryAxisBaseComponent { protected createImplementation(): CategoryXAxis; /** * @hidden */ get i(): CategoryXAxis; constructor(); /** * Gets or sets number of visible categories at maximum zooming level * This property is overridden by chart's WindowRectMinWidth property */ get zoomMaximumCategoryRange(): number; set zoomMaximumCategoryRange(v: number); static ngAcceptInputType_zoomMaximumCategoryRange: number | string; /** * Gets or sets maximum pixel span of series item that will be visible at maximum zooming level * This property ensures that series item does not get stretch above specified value. * This property is overridden by chart's WindowRectMinWidth property */ get zoomMaximumItemSpan(): number; set zoomMaximumItemSpan(v: number); static ngAcceptInputType_zoomMaximumItemSpan: number | string; /** * Gets or sets range of categories that the chart will zoom in to and fill plot area * This property is overridden by chart's WindowRect or WindowScaleHorizontal properties */ get zoomToCategoryRange(): number; set zoomToCategoryRange(v: number); static ngAcceptInputType_zoomToCategoryRange: number | string; /** * Gets or sets starting category that chart will move its zoom window. Acceptable value is between 0 and number of data items * This property is overridden by chart's WindowRect or WindowScaleHorizontal properties */ get zoomToCategoryStart(): number; set zoomToCategoryStart(v: number); static ngAcceptInputType_zoomToCategoryStart: number | string; /** * Gets or sets pixel span of series item that will be used to zoom chart such that the item has desired span * Chart will automatically zoom in until series item has specified pixel span. * This property is overridden by chart's WindowRect or WindowScaleHorizontal properties */ get zoomToItemSpan(): number; set zoomToItemSpan(v: number); static ngAcceptInputType_zoomToItemSpan: number | string; /** * Gets or sets the frequency of displayed labels. * The set value is a factor that determines which labels will be hidden. For example, an interval of 2 will display every other label. * * `Interval` determines how often to show a label, tickmark, and/or gridline along the x-axis. Set this property to _n_ to display a label every _nth_ item. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis #xAxis * label="label" * interval="3"> * </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> * ``` * * ```ts * let series = new IgxColumnSeriesComponent(); * series.xAxis = this.xAxis; * xAxis.interval="3"; * series.yAxis = this.yAxis; * * series.valueMemberPath="value"; * this.chart.series.add(series); * ``` */ get interval(): number; set interval(v: number); static ngAcceptInputType_interval: number | string; /** * Gets the effective value for the current Interval. * * ```ts * let effectiveInterval: number = xAxis.actualInterval; * ``` */ get actualInterval(): number; set actualInterval(v: number); static ngAcceptInputType_actualInterval: number | string; /** * Gets or sets the frequency of displayed minor lines. * The set value is a factor that determines how the minor lines will be displayed. * * `MinorInterval` determines how often to show a minor gridline along the x-axis. This property is relevant only when the displayed series is a type with grouping, like column series. * * `MinorInterval` is expressed as a number between 0 and 1, representing the frequency of the interval. To display minor gridlines representing 10ths of an item width, set `MinorInterval` to 0.1. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis #xAxis * label="label" * minorInterval="0.1" * minorStroke="green" * minorStrokeThickness="1"> * </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> * ``` * * ```ts * let series = new IgxColumnSeriesComponent(); * series.xAxis = this.xAxis; * xAxis.minorInterval="0.1"; * series.yAxis = this.yAxis; * series.valueMemberPath="value"; * this.chart.series.add(series); * ``` */ get minorInterval(): number; set minorInterval(v: number); static ngAcceptInputType_minorInterval: number | string; /** * Gets the effective value for the current MinorInterval. * * ```ts * let effectiveMinorInterval: number = xAxis.actualMinorInterval; * ``` */ get actualMinorInterval(): number; set actualMinorInterval(v: number); static ngAcceptInputType_actualMinorInterval: number | string; /** * Scrolls the specified item into view. * @param item * Data item to scroll into view */ scrollIntoView(item: any): void; scrollRangeIntoView(minimum: number, maximum: number): void; /** * Gets window zoom scale required to zoom to specified number of categories */ getWindowZoomFromCategories(categoriesCount: number): number; /** * Gets window zoom scale required to zoom to specified span of series item */ getWindowZoomFromItemSpan(pixels: number): number; private _actualIntervalChange; get actualIntervalChange(): EventEmitter<number>; private _actualMinorIntervalChange; get actualMinorIntervalChange(): EventEmitter<number>; static ɵfac: i0.ɵɵFactoryDeclaration<IgxCategoryXAxisComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxCategoryXAxisComponent, "igx-category-x-axis", never, { "zoomMaximumCategoryRange": "zoomMaximumCategoryRange"; "zoomMaximumItemSpan": "zoomMaximumItemSpan"; "zoomToCategoryRange": "zoomToCategoryRange"; "zoomToCategoryStart": "zoomToCategoryStart"; "zoomToItemSpan": "zoomToItemSpan"; "interval": "interval"; "actualInterval": "actualInterval"; "minorInterval": "minorInterval"; "actualMinorInterval": "actualMinorInterval"; }, { "actualIntervalChange": "actualIntervalChange"; "actualMinorIntervalChange": "actualMinorIntervalChange"; }, never, never>; }