UNPKG

igniteui-angular-charts

Version:

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

294 lines (289 loc) 11.3 kB
import { IgPoint } from "igniteui-angular-core"; import { TrendLineType } from "igniteui-angular-core"; import { CategorySeriesMarkerCollisionAvoidance } from "./CategorySeriesMarkerCollisionAvoidance"; import { ConsolidatedItemHitTestBehavior } from "./ConsolidatedItemHitTestBehavior"; import { ValueLayerValueMode } from "./ValueLayerValueMode"; import { IgxCategorySeriesComponent } from "./igx-category-series-component"; import { AnchoredCategorySeries } from "./AnchoredCategorySeries"; import * as i0 from "@angular/core"; /** * Represents the base class for all IgxDataChartComponent anchored category/value series. * * The `AnchoredCategorySeries` represents the base class for all IgxDataChartComponent anchored category/value series. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </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-data-chart> * ``` */ export declare abstract class IgxAnchoredCategorySeriesComponent extends IgxCategorySeriesComponent { /** * @hidden */ get i(): AnchoredCategorySeries; constructor(); /** * Gets or sets the value mapping property for the current series object. * * The `ValueMemberPath` property is used for the value mapping property of the current series object. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </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> * ``` */ get valueMemberPath(): string; set valueMemberPath(v: string); /** * Gets or sets the value mapping property for the current series object. */ get highlightedValueMemberPath(): string; set highlightedValueMemberPath(v: string); /** * Gets or sets the label displayed before series value in the Data Legend. */ get valueMemberAsLegendLabel(): string; set valueMemberAsLegendLabel(v: string); /** * Gets or sets the unit displayed after series value in the Data Legend. */ get valueMemberAsLegendUnit(): string; set valueMemberAsLegendUnit(v: string); /** * Gets or sets the trend type for the current series object. * * The `TrendLineType` property is used for the current series object's trend type.' * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerType="circle" * trendLineType="simpleAverage" > * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * series.trendLineType= "CubicFit"; * ``` */ get trendLineType(): TrendLineType; set trendLineType(v: TrendLineType); static ngAcceptInputType_trendLineType: TrendLineType | string; /** * Gets or sets the brush to use to draw the trend line. * * The `TrendLineBrush` property is used to brush the trend line. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerType="circle" * trendLineBrush= "grey" > * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * series.trendLineBrush="red"; * ``` */ get trendLineBrush(): string; set trendLineBrush(v: string); /** * Gets the effective TrendLineBrush for this series. * * The `ActualTrendLineBrush` property is used to gets the effective `TrendLineBrush` for this series. */ get actualTrendLineBrush(): string; set actualTrendLineBrush(v: string); /** * Gets or sets the thickness of the current series object's trend line. * * The `TrendLineThickness` property is used for thickness of the current series object's trend line. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerType="circle" * trendLineThickness= 2 > * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * series.trendLineThickness= 2; * ``` */ get trendLineThickness(): number; set trendLineThickness(v: number); static ngAcceptInputType_trendLineThickness: number | string; /** * Gets or sets a collection of double values that indicate the pattern of dashes and gaps that * is used to draw the trend line for the current series object. */ get trendLineDashArray(): number[]; set trendLineDashArray(v: number[]); static ngAcceptInputType_trendLineDashArray: number[] | string; /** * Gets or sets the trend line period for the current series. * The typical, and initial, value for trend line period is 7. * * The `TrendLinePeriod` property is used for trend line period of the current series. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerType="circle" * trendLinePeriod: "7"> * </igx-column-series> * </igx-data-chart> * ``` * * ```ts * series.trendLinePeriod= 7; * ``` */ get trendLinePeriod(): number; set trendLinePeriod(v: number); static ngAcceptInputType_trendLinePeriod: number | string; /** * The desired behavior for markers in this series which are placed too close together for the current view, resulting in a collision. * * The `MarkerCollisionAvoidance` property controls the technique the chart uses to avoid overlapping markers. * * ```html * <igx-data-chart [dataSource]="data"> * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * * <igx-column-series * [xAxis]="xAxis" * [yAxis]="yAxis" * valueMemberPath="value" * markerType="circle" * markerCollisionAvoidance= "fade" * > * </igx-column-series> * </igx-data-chart> * ``` */ get markerCollisionAvoidance(): CategorySeriesMarkerCollisionAvoidance; set markerCollisionAvoidance(v: CategorySeriesMarkerCollisionAvoidance); static ngAcceptInputType_markerCollisionAvoidance: CategorySeriesMarkerCollisionAvoidance | string; /** * Determines the item returned in hit-testing when the pointer is over an object which represents several consolidated items. * * The `ConsolidatedItemHitTestBehavior` property is used to determines returned item in hit-testing when the pointer is over an object which represents several consolidated items. */ get consolidatedItemHitTestBehavior(): ConsolidatedItemHitTestBehavior; set consolidatedItemHitTestBehavior(v: ConsolidatedItemHitTestBehavior); static ngAcceptInputType_consolidatedItemHitTestBehavior: ConsolidatedItemHitTestBehavior | string; getItemValue(item: any, memberPathName: string): any; /** * Gets the value of a requested member path from the series. * @param memberPathName * The property name of a valid member path for the series */ getMemberPathValue(memberPathName: string): string; /** * Scrolls the series to display the item for the specified data item. * The series is scrolled by the minimum amount required to place the specified data item within * the central 80% of the visible axis. * @param item * The data item (item) to scroll to. * * The `ScrollIntoView` method is used to notifies the target axis or series that it should scroll the requested data item into view. * * ```ts * this.series.scrollIntoView(dataItem); * ``` */ scrollIntoView(item: any): boolean; /** * Gets the item that is the best match for the specified world coordinates. * @param world * The world coordinates to use. * * The `getItem` method is used to gets the item that is the best match for the specified world coordinates. * * ```ts * let item: number = this.series.getItem({x:.5,y:.5}); * ``` */ getItem(world: IgPoint): any; /** * Gets a numeric value from the numeric axis associated with this series that matches the desired * value mode. * @param mode * The type of value desired from the series numeric axis. */ getSeriesValueType(mode: ValueLayerValueMode | string): number[]; getSeriesValueTypePosition(mode: ValueLayerValueMode | string): IgPoint; getSeriesValueTypePositionFromValue(values: number[]): IgPoint; static ɵfac: i0.ɵɵFactoryDeclaration<IgxAnchoredCategorySeriesComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxAnchoredCategorySeriesComponent, "ng-component", never, { "valueMemberPath": "valueMemberPath"; "highlightedValueMemberPath": "highlightedValueMemberPath"; "valueMemberAsLegendLabel": "valueMemberAsLegendLabel"; "valueMemberAsLegendUnit": "valueMemberAsLegendUnit"; "trendLineType": "trendLineType"; "trendLineBrush": "trendLineBrush"; "actualTrendLineBrush": "actualTrendLineBrush"; "trendLineThickness": "trendLineThickness"; "trendLineDashArray": "trendLineDashArray"; "trendLinePeriod": "trendLinePeriod"; "markerCollisionAvoidance": "markerCollisionAvoidance"; "consolidatedItemHitTestBehavior": "consolidatedItemHitTestBehavior"; }, {}, never, never>; }