UNPKG

igniteui-angular-charts

Version:

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

311 lines (308 loc) 10.8 kB
import { IgRect } from "igniteui-angular-core"; import { IgPoint } from "igniteui-angular-core"; import { IndicatorDisplayType } from "./IndicatorDisplayType"; import { TrendLineType } from "igniteui-angular-core"; import { IgxFinancialSeriesComponent } from "./igx-financial-series-component"; import { FinancialIndicator } from "./FinancialIndicator"; import * as i0 from "@angular/core"; /** * Represents the base functionality for a IgxDataChartComponent financial indicator series. * * The `FinancialIndicator` class represents the base functionality for a IgxDataChartComponent financial indicator series. * * ```html * <igx-data-chart #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" > * </igx-mass-index-indicator > * </igx-data-chart> * ``` * * ```ts * let series = new IgxMassIndexIndicatorComponent(); * series.xAxis = this.xAxis; * series.yAxis = this.yAxis; * series.openMemberPath = "open"; * series.highMemberPath = "high"; * series.lowMemberPath = "low"; * series.closeMemberPath = "close"; * this.chart.series.add(series); * * ``` */ export declare abstract class IgxFinancialIndicatorComponent extends IgxFinancialSeriesComponent { /** * @hidden */ get i(): FinancialIndicator; constructor(); /** * Gets whether the series is financial indicator */ get isFinancialIndicator(): boolean; static ngAcceptInputType_isFinancialIndicator: boolean | string; /** * Gets or sets the display for the current FinancialIndicator object. * * The `DisplayType` property is used to display the current FinancialIndicator object. * * ```ts * series.displayType= IndicatorDisplayType.Column; * ``` * * ```html * <igx-data-chart #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" * displayType="Column" > * </igx-mass-index-indicator > * </igx-data-chart> * ``` */ get displayType(): IndicatorDisplayType; set displayType(v: IndicatorDisplayType); static ngAcceptInputType_displayType: IndicatorDisplayType | string; /** * Gets default display type for the current Financial Indicator */ get defaultDisplayType(): IndicatorDisplayType; static ngAcceptInputType_defaultDisplayType: IndicatorDisplayType | string; /** * Gets or sets the number of values to hide at the beginning of the indicator. * * Use the `IgnoreFirst` propert to hide the number of values at the beginning of the indicator. * * ```html * <igx-data-chart #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" * ignoreFirst="2" > * </igx-mass-index-indicator > * </igx-data-chart> * ``` * * ```ts * series.ignoreFirst = 2; * ``` */ get ignoreFirst(): number; set ignoreFirst(v: number); static ngAcceptInputType_ignoreFirst: number | string; /** * Gets or sets the trend type for the current indicator series. * * Use `TrendLineType` property to get the trend type for the current indicator series. * * ```html * <igx-data-chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * trendLineType="CubicFit"> * </igx-mass-index-indicator> * </igx-data-chart> * ``` * * ```ts * series.trendLineType= 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. * * Use the `TrendLineBrush` propert to draw the trend line. * * ```html * <igx-data-chart #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" * trendLineBrush="Red"> * </igx-mass-index-indicator > * </igx-data-chart> * ``` */ get trendLineBrush(): string; set trendLineBrush(v: string); /** * Gets the effective TrendLineBrush for this indicator. * * Use the `ActualTrendLineBrush` property to Gets the effective TrendLineBrush for the FinancialIndicator. */ get actualTrendLineBrush(): string; set actualTrendLineBrush(v: string); /** * Gets or sets the thickness of the current indicator object's trend line. * * Use `TrendLineThickness` property for the thickness of the current indicator object's trend line. * * ```html * <igx-data-chart #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" * trendLineThickness="2" > * </igx-mass-index-indicator > * </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 indicator 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. * * Use `TrendLinePeriod` property for the trend line period of the current series. * * ```html * <igx-data-chart #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * label="label" * #xAxis> * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-mass-index-indicator * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" * trendLinePeriod="30" > * </igx-mass-index-indicator > * </igx-data-chart> * ``` * * ```ts * series.trendLinePeriod =30; * ``` */ get trendLinePeriod(): number; set trendLinePeriod(v: number); static ngAcceptInputType_trendLinePeriod: number | string; /** * If possible, will return the best available value bounding box within the series that has the best value match for the world position provided. * @param world * The world coordinate for which to get a value bounding box for * * The `GetSeriesValueBoundingBox` method returns the best available value bounding box within the series that has the best value match for the world position provided. */ getSeriesValueBoundingBox(world: IgPoint): IgRect; getSeriesValue(world: IgPoint, useInterpolation: boolean, skipUnknowns: boolean): number; getPreviousOrExactIndex(world: IgPoint, skipUnknowns: boolean): number; getNextOrExactIndex(world: IgPoint, skipUnknowns: boolean): number; /** * 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 scrolls the series to display the item for the specified data item. */ scrollIntoView(item: any): boolean; static ɵfac: i0.ɵɵFactoryDeclaration<IgxFinancialIndicatorComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<IgxFinancialIndicatorComponent, "ng-component", never, { "displayType": "displayType"; "ignoreFirst": "ignoreFirst"; "trendLineType": "trendLineType"; "trendLineBrush": "trendLineBrush"; "actualTrendLineBrush": "actualTrendLineBrush"; "trendLineThickness": "trendLineThickness"; "trendLineDashArray": "trendLineDashArray"; "trendLinePeriod": "trendLinePeriod"; }, {}, never, never>; }