UNPKG

igniteui-react-charts

Version:

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

313 lines (309 loc) 11.5 kB
import { __extends } from "tslib"; import { delegateCombine, delegateRemove } from "igniteui-react-core"; import { IgrCategoryAxisBase } from "./igr-category-axis-base"; import { CategoryXAxis } from "./CategoryXAxis"; /** * Represents a IgxDataChartComponent category X axis. * * `CategoryXAxis` class represents a IgxDataChartComponent category X axis. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryXAxis name="xAxis" /> * <IgrNumericYAxis name="yAxis" /> * * <IgrLineSeries * name="series1" * xAxisName="xAxis" * yAxisName="yAxis" * valueMemberPath="Value"/> * </IgrDataChart> * ``` * * ```ts * this.columnSeries1 = new IgrLineSeries({ name: "Series1" }); * this.columnSeries1.dataSource = this.categoryData; * this.columnSeries1.xAxis = this.categoryXAxis; * this.columnSeries1.yAxis = this.numericYAxis; * this.columnSeries1.xAxisName = "categoryXAxis"; * this.columnSeries1.yAxisName = "numericYAxis"; * this.columnSeries1.valueMemberPath = "USA"; * ``` */ var IgrCategoryXAxis = /** @class */ /*@__PURE__*/ (function (_super) { __extends(IgrCategoryXAxis, _super); function IgrCategoryXAxis(props) { var _this = _super.call(this, props) || this; _this._actualIntervalChange = null; _this._actualIntervalChange_wrapped = null; _this._actualMinorIntervalChange = null; _this._actualMinorIntervalChange_wrapped = null; return _this; } IgrCategoryXAxis.prototype.createImplementation = function () { return new CategoryXAxis(); }; Object.defineProperty(IgrCategoryXAxis.prototype, "i", { /** * @hidden */ get: function () { return this._implementation; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "zoomMaximumCategoryRange", { /** * Gets or sets number of visible categories at maximum zooming level * This property is overridden by chart's WindowRectMinWidth property */ get: function () { return this.i.zoomMaximumCategoryRange; }, set: function (v) { this.i.zoomMaximumCategoryRange = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "zoomMaximumItemSpan", { /** * 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: function () { return this.i.zoomMaximumItemSpan; }, set: function (v) { this.i.zoomMaximumItemSpan = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "zoomToCategoryRange", { /** * 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: function () { return this.i.zoomToCategoryRange; }, set: function (v) { this.i.zoomToCategoryRange = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "zoomToCategoryStart", { /** * 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: function () { return this.i.zoomToCategoryStart; }, set: function (v) { this.i.zoomToCategoryStart = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "zoomToItemSpan", { /** * 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: function () { return this.i.zoomToItemSpan; }, set: function (v) { this.i.zoomToItemSpan = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "interval", { /** * 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. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryXAxis name="xAxis" interval="3" /> * <IgrNumericYAxis name="yAxis" /> * * <IgrLineSeries * name="series1" * xAxisName="xAxis" * yAxisName="yAxis" * valueMemberPath="Value"/> * </IgrDataChart> * ``` */ get: function () { return this.i.mw; }, set: function (v) { this.i.mw = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "actualInterval", { /** * Gets the effective value for the current Interval. * * ```ts * let effectiveInterval: number = xAxis.actualInterval; * ``` */ get: function () { return this.i.mr; }, set: function (v) { this.i.mr = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "minorInterval", { /** * 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. * * ```ts * <IgrDataChart * dataSource={this.state.dataSource} > * * <IgrCategoryXAxis name="xAxis" * minorInterval={0.1} * minorStroke="green" * minorStrokeThickness={1} /> * <IgrNumericYAxis name="yAxis" /> * * <IgrLineSeries * name="series1" * xAxisName="xAxis" * yAxisName="yAxis" * valueMemberPath="value"/> * </IgrDataChart> * ``` */ get: function () { return this.i.mx; }, set: function (v) { this.i.mx = +v; }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "actualMinorInterval", { /** * Gets the effective value for the current MinorInterval. * * ```ts * let effectiveMinorInterval: number = xAxis.actualMinorInterval; * ``` */ get: function () { return this.i.ms; }, set: function (v) { this.i.ms = +v; }, enumerable: false, configurable: true }); /** * Scrolls the specified item into view. * @param item * Data item to scroll into view */ IgrCategoryXAxis.prototype.scrollIntoView = function (item) { this.i.nc(item); }; IgrCategoryXAxis.prototype.scrollRangeIntoView = function (minimum, maximum) { this.i.nd(minimum, maximum); }; /** * Gets window zoom scale required to zoom to specified number of categories */ IgrCategoryXAxis.prototype.getWindowZoomFromCategories = function (categoriesCount) { var iv = this.i.getWindowZoomFromCategories(categoriesCount); return (iv); }; /** * Gets window zoom scale required to zoom to specified span of series item */ IgrCategoryXAxis.prototype.getWindowZoomFromItemSpan = function (pixels) { var iv = this.i.getWindowZoomFromItemSpan(pixels); return (iv); }; Object.defineProperty(IgrCategoryXAxis.prototype, "actualIntervalChange", { get: function () { return this._actualIntervalChange; }, set: function (ev) { var _this = this; if (this._actualIntervalChange_wrapped !== null) { this.i.propertyChanged = delegateRemove(this.i.propertyChanged, this._actualIntervalChange_wrapped); this._actualIntervalChange_wrapped = null; this._actualIntervalChange = null; } this._actualIntervalChange = ev; this._actualIntervalChange_wrapped = function (o, e) { var ext = _this.actualInterval; if (_this.beforeActualIntervalChange) { _this.beforeActualIntervalChange(_this, ext); } if (_this._actualIntervalChange) { _this._actualIntervalChange(_this, ext); } }; this.i.propertyChanged = delegateCombine(this.i.propertyChanged, this._actualIntervalChange_wrapped); }, enumerable: false, configurable: true }); Object.defineProperty(IgrCategoryXAxis.prototype, "actualMinorIntervalChange", { get: function () { return this._actualMinorIntervalChange; }, set: function (ev) { var _this = this; if (this._actualMinorIntervalChange_wrapped !== null) { this.i.propertyChanged = delegateRemove(this.i.propertyChanged, this._actualMinorIntervalChange_wrapped); this._actualMinorIntervalChange_wrapped = null; this._actualMinorIntervalChange = null; } this._actualMinorIntervalChange = ev; this._actualMinorIntervalChange_wrapped = function (o, e) { var ext = _this.actualMinorInterval; if (_this.beforeActualMinorIntervalChange) { _this.beforeActualMinorIntervalChange(_this, ext); } if (_this._actualMinorIntervalChange) { _this._actualMinorIntervalChange(_this, ext); } }; this.i.propertyChanged = delegateCombine(this.i.propertyChanged, this._actualMinorIntervalChange_wrapped); }, enumerable: false, configurable: true }); return IgrCategoryXAxis; }(IgrCategoryAxisBase)); export { IgrCategoryXAxis };