UNPKG

igniteui-angular-charts

Version:

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

133 lines (131 loc) 4.72 kB
import { Component, Input } from '@angular/core'; import { IgxFinancialSeriesComponent } from "./igx-financial-series-component"; import * as i0 from "@angular/core"; /** * Represents the base functionality for a IgxDataChartComponent financial overlay series. * The difference between a FinancialIndicator and a FinancialOverlay is small. * Overlays are usually drawn against the same axes as the price, but they don't * have to be. Overlays mostly display multiple values, but not all of them, and so * so some indicators. * * The `FinancialOverlay` class represents the base functionality for a IgxDataChartComponent financial overlay series. * * ```html * <igx-data-chart * #chart * [dataSource]="data" > * <igx-ordinal-time-x-axis * dateTimeMemberPath="TimeStamp" * #xAxis * > * </igx-ordinal-time-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-bollinger-bands-overlay * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume"> * </igx-bollinger-bands-overlay> * </igx-data-chart> * ``` * * ```ts * let series = new IgxBollingerBandsOverlayComponent(); * series.xAxis = this.xAxis; * series.yAxis = this.yAxis; * series.openMemberPath = "open"; * series.highMemberPath = "high"; * series.lowMemberPath = "low"; * series.closeMemberPath = "close"; * series.volumeMemberPath="volume"; * this.chart.series.add(series); * ``` */ export let IgxFinancialOverlayComponent = /*@__PURE__*/ (() => { class IgxFinancialOverlayComponent extends IgxFinancialSeriesComponent { constructor() { super(); } /** * @hidden */ get i() { return this._implementation; } /** * Gets whether the series is financial overlay */ get isFinancialOverlay() { return this.i.fc; } /** * Gets or sets the number of values to hide at the beginning of the indicator. * * Use the `IgnoreFirst` property to sets the number of values to hide at the beginning of the indicator. * * ```ts * series.ignoreFirst=2; * ``` * * ```html * <igx-data-chart * #chart * [dataSource]="data" > * <igx-category-x-axis * label="label" * #xAxis> * </igx-category-x-axis> * <igx-numeric-y-axis * minimumValue="0" * #yAxis> * </igx-numeric-y-axis> * <igx-bollinger-bands-overlay * [xAxis]="xAxis" * [yAxis]="yAxis" * openMemberPath="open" * highMemberPath="high" * lowMemberPath="low" * closeMemberPath="close" * volumeMemberPath="volume" * ignoreFirst="2"> * </igx-bollinger-bands-overlay> * </igx-data-chart> * ``` */ get ignoreFirst() { return this.i.abm; } set ignoreFirst(v) { this.i.abm = +v; } /** * 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. * * Use the `ScrollIntoView` method to scrolls the series to display the item for the specified data item. */ scrollIntoView(item) { let iv = this.i.gj(item); return (iv); } } IgxFinancialOverlayComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxFinancialOverlayComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); IgxFinancialOverlayComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: IgxFinancialOverlayComponent, selector: "ng-component", inputs: { ignoreFirst: "ignoreFirst" }, usesInheritance: true, ngImport: i0, template: ``, isInline: true }); return IgxFinancialOverlayComponent; })(); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: IgxFinancialOverlayComponent, decorators: [{ type: Component, args: [{ template: ``, }] }], ctorParameters: function () { return []; }, propDecorators: { ignoreFirst: [{ type: Input }] } });