UNPKG

igniteui-react-charts

Version:

Ignite UI React charting components for building rich data visualizations using TypeScript APIs.

148 lines (147 loc) 4.13 kB
import { IgrStrategyBasedIndicator } from "./igr-strategy-based-indicator"; import { AbsoluteVolumeOscillatorIndicator } from "./AbsoluteVolumeOscillatorIndicator"; /** * Represents a IgxDataChartComponent Absolute Volume Oscillator indicator series. * Default required members: Volume * * You can use the `AbsoluteVolumeOscillatorIndicator` to identify whether volume trands are increasing or decreasing. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} * width="700px" * height="500px"> * * * <IgrCategoryXAxis name="xAxis" label="Date" /> * <IgrNumericYAxis name="yAxis" /> * * <IgrAbsoluteVolumeOscillatorIndicator * name="series3" * xAxisName="xAxis" * yAxisName="yAxis" * displayType="Line" * lowMemberPath="Low" * highMemberPath="High" * openMemberPath="Open" * closeMemberPath="Close" * volumeMemberPath="Volume" /> * </IgrDataChart> * ``` * * ```ts * let series = new IgxAbsoluteVolumeOscillatorIndicatorComponent(); * 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); * ``` * * ```ts * let series = new IgrAbsoluteVolumeOscillatorIndicator({name:"series3"}); * series.xAxisName = this.xAxis; * series.yAxisName = this.yAxis; * series.openMemberPath = "open"; * series.highMemberPath = "high"; * series.lowMemberPath = "low"; * series.closeMemberPath = "close"; * this.chart.series.add(series); * ``` */ export class IgrAbsoluteVolumeOscillatorIndicator extends IgrStrategyBasedIndicator { createImplementation() { return new AbsoluteVolumeOscillatorIndicator(); } /** * @hidden */ get i() { return this._implementation; } constructor(props) { super(props); } /** * Gets or sets the short moving average period for the current AbsoluteVolumeOscillatorIndicator object. * The typical, and initial, value for short AVO periods is 10. * * You can use the `ShortPeriod` to set the short moving average period. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} * width="700px" * height="500px"> * * * <IgrCategoryXAxis name="xAxis" label="Date" /> * <IgrNumericYAxis name="yAxis" /> * * <IgrAbsoluteVolumeOscillatorIndicator * name="series3" * xAxisName="xAxis" * yAxisName="yAxis" * displayType="Line" * lowMemberPath="Low" * highMemberPath="High" * openMemberPath="Open" * closeMemberPath="Close" * volumeMemberPath="Volume" * shortPeriod="10" /> * </IgrDataChart> * ``` * * ```ts * this.series.shortPeriod = 10; * ``` */ get shortPeriod() { return this.i.shortPeriod; } set shortPeriod(v) { this.i.shortPeriod = +v; } /** * Gets or sets the short moving average period for the current AbsoluteVolumeOscillatorIndicator object. * The typical, and initial, value for long AVO periods is 30. * * You can use the `LongPeriod` to set the long moving average period. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} * width="700px" * height="500px"> * * * <IgrCategoryXAxis name="xAxis" label="Date" /> * <IgrNumericYAxis name="yAxis" /> * * <IgrAbsoluteVolumeOscillatorIndicator * name="series3" * xAxisName="xAxis" * yAxisName="yAxis" * displayType="Line" * lowMemberPath="Low" * highMemberPath="High" * openMemberPath="Open" * closeMemberPath="Close" * volumeMemberPath="Volume" * longPeriod=30/> * </IgrDataChart> * ``` * * ```ts * this.series.longPeriod = 30; * ``` */ get longPeriod() { return this.i.longPeriod; } set longPeriod(v) { this.i.longPeriod = +v; } }