@syncfusion/ej2-charts
Version:
Feature-rich chart control with built-in support for over 25 chart types, technical indictors, trendline, zooming, tooltip, selection, crosshair and trackball.
1,377 lines (1,371 loc) • 4.19 MB
JavaScript
import { Property, ChildProperty, Complex, Browser, Collection, isNullOrUndefined, extend, getValue, remove, createElement, Animation as Animation$1, merge, compile, resetBlazorTemplate, animationMode, print, setValue, updateBlazorTemplate, EventHandler, Touch, Internationalization, L10n, SanitizeHtmlHelper, Event, NotifyPropertyChanges, Component } from '@syncfusion/ej2-base';
import { Rect as Rect$1, Size as Size$1, measureText as measureText$2, SvgRenderer, TextOption as TextOption$2, CanvasRenderer, PathOption as PathOption$2, Tooltip as Tooltip$1, getElement as getElement$2, removeElement as removeElement$3, textElement as textElement$1 } from '@syncfusion/ej2-svg-base';
import { DataUtil, DataManager, Query, Deferred } from '@syncfusion/ej2-data';
import { PdfPageOrientation, PdfDocument, PdfStandardFont, PdfPageTemplateElement, PdfSolidBrush, PdfColor, SizeF, PdfBitmap } from '@syncfusion/ej2-pdf-export';
import { Workbook } from '@syncfusion/ej2-excel-export';
import { Toolbar } from '@syncfusion/ej2-navigations';
import { DateRangePicker } from '@syncfusion/ej2-calendars';
import { DropDownButton } from '@syncfusion/ej2-splitbuttons';
var __extends = (undefined && undefined.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/**
* The `Connector` class configures the appearance and properties of connectors in chart controls.
*/
var Connector = /** @__PURE__ @class */ (function (_super) {
__extends(Connector, _super);
function Connector() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Line')
], Connector.prototype, "type", void 0);
__decorate([
Property(null)
], Connector.prototype, "color", void 0);
__decorate([
Property(1)
], Connector.prototype, "width", void 0);
__decorate([
Property(null)
], Connector.prototype, "length", void 0);
__decorate([
Property('')
], Connector.prototype, "dashArray", void 0);
return Connector;
}(ChildProperty));
/**
* Configures the location for the legend and tooltip in the chart.
*/
var Location = /** @__PURE__ @class */ (function (_super) {
__extends(Location, _super);
function Location() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(0)
], Location.prototype, "x", void 0);
__decorate([
Property(0)
], Location.prototype, "y", void 0);
return Location;
}(ChildProperty));
/**
* The `Accessibility` class configures accessibility options for chart controls.
*/
var Accessibility = /** @__PURE__ @class */ (function (_super) {
__extends(Accessibility, _super);
function Accessibility() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(null)
], Accessibility.prototype, "accessibilityDescription", void 0);
__decorate([
Property(null)
], Accessibility.prototype, "accessibilityRole", void 0);
__decorate([
Property(true)
], Accessibility.prototype, "focusable", void 0);
__decorate([
Property(0)
], Accessibility.prototype, "tabIndex", void 0);
return Accessibility;
}(ChildProperty));
/**
* The `SeriesAccessibility` class configures accessibility options specifically for chart series elements.
*/
var SeriesAccessibility = /** @__PURE__ @class */ (function (_super) {
__extends(SeriesAccessibility, _super);
function SeriesAccessibility() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(null)
], SeriesAccessibility.prototype, "accessibilityDescriptionFormat", void 0);
return SeriesAccessibility;
}(Accessibility));
/**
* The `Font` class provides configuration options for customizing the fonts used in the charts.
*/
var Font = /** @__PURE__ @class */ (function (_super) {
__extends(Font, _super);
function Font() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Normal')
], Font.prototype, "fontStyle", void 0);
__decorate([
Property('16px')
], Font.prototype, "size", void 0);
__decorate([
Property('Normal')
], Font.prototype, "fontWeight", void 0);
__decorate([
Property('')
], Font.prototype, "color", void 0);
__decorate([
Property('Center')
], Font.prototype, "textAlignment", void 0);
__decorate([
Property('Segoe UI')
], Font.prototype, "fontFamily", void 0);
__decorate([
Property(1)
], Font.prototype, "opacity", void 0);
__decorate([
Property('Wrap')
], Font.prototype, "textOverflow", void 0);
return Font;
}(ChildProperty));
/**
* The `StackLabelsFont` class provides configuration options for customizing the font properties of stack labels in charts.
*/
var StackLabelsFont = /** @__PURE__ @class */ (function (_super) {
__extends(StackLabelsFont, _super);
function StackLabelsFont() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Normal')
], StackLabelsFont.prototype, "fontStyle", void 0);
__decorate([
Property('16px')
], StackLabelsFont.prototype, "size", void 0);
__decorate([
Property('Normal')
], StackLabelsFont.prototype, "fontWeight", void 0);
__decorate([
Property('')
], StackLabelsFont.prototype, "color", void 0);
__decorate([
Property('Center')
], StackLabelsFont.prototype, "textAlignment", void 0);
__decorate([
Property('Segoe UI')
], StackLabelsFont.prototype, "fontFamily", void 0);
__decorate([
Property(1)
], StackLabelsFont.prototype, "opacity", void 0);
return StackLabelsFont;
}(ChildProperty));
/**
* Options to customize the center label of the Pie and Donut charts.
*
* @default {}
*/
var CenterLabel = /** @__PURE__ @class */ (function (_super) {
__extends(CenterLabel, _super);
function CenterLabel() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(null)
], CenterLabel.prototype, "text", void 0);
__decorate([
Complex({ fontFamily: null, size: '16px', fontStyle: 'Normal', fontWeight: '600', color: null }, Font)
], CenterLabel.prototype, "textStyle", void 0);
__decorate([
Property(null)
], CenterLabel.prototype, "hoverTextFormat", void 0);
return CenterLabel;
}(ChildProperty));
/**
* The `Border` class provides configuration options for setting the borders in a chart.
*/
var Border = /** @__PURE__ @class */ (function (_super) {
__extends(Border, _super);
function Border() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('')
], Border.prototype, "color", void 0);
__decorate([
Property(1)
], Border.prototype, "width", void 0);
__decorate([
Property('')
], Border.prototype, "dashArray", void 0);
return Border;
}(ChildProperty));
/**
* The `Offset` class provides options to adjust the position of the marker relative to its default location.
*/
var Offset = /** @__PURE__ @class */ (function (_super) {
__extends(Offset, _super);
function Offset() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(0)
], Offset.prototype, "x", void 0);
__decorate([
Property(0)
], Offset.prototype, "y", void 0);
return Offset;
}(ChildProperty));
/**
* The `Margin` class enables configuration of the space around the chart's content.
*/
var Margin = /** @__PURE__ @class */ (function (_super) {
__extends(Margin, _super);
function Margin() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(Browser.isDevice ? 5 : 10)
], Margin.prototype, "left", void 0);
__decorate([
Property(Browser.isDevice ? 5 : 10)
], Margin.prototype, "right", void 0);
__decorate([
Property(Browser.isDevice ? 5 : 10)
], Margin.prototype, "top", void 0);
__decorate([
Property(Browser.isDevice ? 5 : 10)
], Margin.prototype, "bottom", void 0);
return Margin;
}(ChildProperty));
/**
* Configures the animation behavior for the chart series.
*/
var Animation = /** @__PURE__ @class */ (function (_super) {
__extends(Animation, _super);
function Animation() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(true)
], Animation.prototype, "enable", void 0);
__decorate([
Property(1000)
], Animation.prototype, "duration", void 0);
__decorate([
Property(0)
], Animation.prototype, "delay", void 0);
return Animation;
}(ChildProperty));
var TooltipSettings = /** @__PURE__ @class */ (function (_super) {
__extends(TooltipSettings, _super);
function TooltipSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(false)
], TooltipSettings.prototype, "enable", void 0);
__decorate([
Property(true)
], TooltipSettings.prototype, "enableMarker", void 0);
__decorate([
Property(false)
], TooltipSettings.prototype, "shared", void 0);
__decorate([
Property(null)
], TooltipSettings.prototype, "fill", void 0);
__decorate([
Property(null)
], TooltipSettings.prototype, "header", void 0);
__decorate([
Property(null)
], TooltipSettings.prototype, "opacity", void 0);
__decorate([
Complex({ fontFamily: null, size: null, fontStyle: 'Normal', fontWeight: null, color: null }, Font)
], TooltipSettings.prototype, "textStyle", void 0);
__decorate([
Property(null)
], TooltipSettings.prototype, "format", void 0);
__decorate([
Property(null)
], TooltipSettings.prototype, "template", void 0);
__decorate([
Property(true)
], TooltipSettings.prototype, "enableAnimation", void 0);
__decorate([
Property(300)
], TooltipSettings.prototype, "duration", void 0);
__decorate([
Property(1000)
], TooltipSettings.prototype, "fadeOutDuration", void 0);
__decorate([
Property('Move')
], TooltipSettings.prototype, "fadeOutMode", void 0);
__decorate([
Property(false)
], TooltipSettings.prototype, "enableTextWrap", void 0);
__decorate([
Property(true)
], TooltipSettings.prototype, "showNearestPoint", void 0);
__decorate([
Complex({ color: null, width: null }, Border)
], TooltipSettings.prototype, "border", void 0);
__decorate([
Complex({ x: null, y: null }, Location)
], TooltipSettings.prototype, "location", void 0);
__decorate([
Property(false)
], TooltipSettings.prototype, "enableHighlight", void 0);
__decorate([
Property(false)
], TooltipSettings.prototype, "showNearestTooltip", void 0);
__decorate([
Property(true)
], TooltipSettings.prototype, "showHeaderLine", void 0);
return TooltipSettings;
}(ChildProperty));
/**
* This class configures the appearance and behavior of points with empty data in the series.
*/
var EmptyPointSettings = /** @__PURE__ @class */ (function (_super) {
__extends(EmptyPointSettings, _super);
function EmptyPointSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(null)
], EmptyPointSettings.prototype, "fill", void 0);
__decorate([
Complex({ color: '', width: 0 }, Border)
], EmptyPointSettings.prototype, "border", void 0);
__decorate([
Property('Gap')
], EmptyPointSettings.prototype, "mode", void 0);
return EmptyPointSettings;
}(ChildProperty));
/**
* Specifies the indexes for the series and data points.
*
* @public
*/
var Indexes = /** @__PURE__ @class */ (function (_super) {
__extends(Indexes, _super);
function Indexes() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(0)
], Indexes.prototype, "series", void 0);
__decorate([
Property(0)
], Indexes.prototype, "point", void 0);
return Indexes;
}(ChildProperty));
/**
* The `CornerRadius` class provides options to customize the rounding of the corners for columns in the column series.
*/
var CornerRadius = /** @__PURE__ @class */ (function (_super) {
__extends(CornerRadius, _super);
function CornerRadius() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(0)
], CornerRadius.prototype, "topLeft", void 0);
__decorate([
Property(0)
], CornerRadius.prototype, "topRight", void 0);
__decorate([
Property(0)
], CornerRadius.prototype, "bottomLeft", void 0);
__decorate([
Property(0)
], CornerRadius.prototype, "bottomRight", void 0);
return CornerRadius;
}(ChildProperty));
/**
* Configures the padding around the chart legend container.
*/
var ContainerPadding = /** @__PURE__ @class */ (function (_super) {
__extends(ContainerPadding, _super);
function ContainerPadding() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(0)
], ContainerPadding.prototype, "left", void 0);
__decorate([
Property(0)
], ContainerPadding.prototype, "right", void 0);
__decorate([
Property(0)
], ContainerPadding.prototype, "top", void 0);
__decorate([
Property(0)
], ContainerPadding.prototype, "bottom", void 0);
return ContainerPadding;
}(ChildProperty));
/**
* Configures the borders of the chart title and subtitle.
*/
var titleBorder = /** @__PURE__ @class */ (function (_super) {
__extends(titleBorder, _super);
function titleBorder() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('transparent')
], titleBorder.prototype, "color", void 0);
__decorate([
Property(0)
], titleBorder.prototype, "width", void 0);
__decorate([
Property(0.8)
], titleBorder.prototype, "cornerRadius", void 0);
return titleBorder;
}(ChildProperty));
/**
* The `titleSettings` class provides options to customize the title and subtitle displayed in the chart.
*/
var titleSettings = /** @__PURE__ @class */ (function (_super) {
__extends(titleSettings, _super);
function titleSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Normal')
], titleSettings.prototype, "fontStyle", void 0);
__decorate([
Property('15px')
], titleSettings.prototype, "size", void 0);
__decorate([
Property('500')
], titleSettings.prototype, "fontWeight", void 0);
__decorate([
Property('')
], titleSettings.prototype, "color", void 0);
__decorate([
Property('Center')
], titleSettings.prototype, "textAlignment", void 0);
__decorate([
Property('Segoe UI')
], titleSettings.prototype, "fontFamily", void 0);
__decorate([
Property(1)
], titleSettings.prototype, "opacity", void 0);
__decorate([
Property('Wrap')
], titleSettings.prototype, "textOverflow", void 0);
__decorate([
Property('Top')
], titleSettings.prototype, "position", void 0);
__decorate([
Property(0)
], titleSettings.prototype, "x", void 0);
__decorate([
Property(0)
], titleSettings.prototype, "y", void 0);
__decorate([
Property('transparent')
], titleSettings.prototype, "background", void 0);
__decorate([
Complex({}, titleBorder)
], titleSettings.prototype, "border", void 0);
__decorate([
Complex({}, Accessibility)
], titleSettings.prototype, "accessibility", void 0);
return titleSettings;
}(ChildProperty));
/**
* The `TitleStyleSettings` class provides options to customize the title and subtitle displayed in the accumulation chart.
*/
var TitleStyleSettings = /** @__PURE__ @class */ (function (_super) {
__extends(TitleStyleSettings, _super);
function TitleStyleSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Top')
], TitleStyleSettings.prototype, "position", void 0);
__decorate([
Property(0)
], TitleStyleSettings.prototype, "x", void 0);
__decorate([
Property(0)
], TitleStyleSettings.prototype, "y", void 0);
return TitleStyleSettings;
}(Font));
/**
* The `ChartArea` class provides properties to customize the appearance and layout of the chart's display area.
*/
var ChartArea = /** @__PURE__ @class */ (function (_super) {
__extends(ChartArea, _super);
function ChartArea() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Complex({}, Border)
], ChartArea.prototype, "border", void 0);
__decorate([
Property('transparent')
], ChartArea.prototype, "background", void 0);
__decorate([
Property(1)
], ChartArea.prototype, "opacity", void 0);
__decorate([
Property(null)
], ChartArea.prototype, "backgroundImage", void 0);
__decorate([
Property(null)
], ChartArea.prototype, "width", void 0);
__decorate([
Complex({ left: 0, right: 0, top: 0, bottom: 0 }, Margin)
], ChartArea.prototype, "margin", void 0);
return ChartArea;
}(ChildProperty));
/**
* Configures the drag settings for series in the chart.
*/
var DragSettings = /** @__PURE__ @class */ (function (_super) {
__extends(DragSettings, _super);
function DragSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(false)
], DragSettings.prototype, "enable", void 0);
__decorate([
Property(null)
], DragSettings.prototype, "minY", void 0);
__decorate([
Property(null)
], DragSettings.prototype, "maxY", void 0);
__decorate([
Property(null)
], DragSettings.prototype, "fill", void 0);
return DragSettings;
}(ChildProperty));
/**
* Configures the button settings in period selector.
*/
var Periods = /** @__PURE__ @class */ (function (_super) {
__extends(Periods, _super);
function Periods() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Years')
], Periods.prototype, "intervalType", void 0);
__decorate([
Property(1)
], Periods.prototype, "interval", void 0);
__decorate([
Property(null)
], Periods.prototype, "text", void 0);
__decorate([
Property(false)
], Periods.prototype, "selected", void 0);
return Periods;
}(ChildProperty));
/**
* Configures the period selector settings.
*/
var PeriodSelectorSettings = /** @__PURE__ @class */ (function (_super) {
__extends(PeriodSelectorSettings, _super);
function PeriodSelectorSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(43)
], PeriodSelectorSettings.prototype, "height", void 0);
__decorate([
Property('Bottom')
], PeriodSelectorSettings.prototype, "position", void 0);
__decorate([
Collection([], Periods)
], PeriodSelectorSettings.prototype, "periods", void 0);
return PeriodSelectorSettings;
}(ChildProperty));
var StockTooltipSettings = /** @__PURE__ @class */ (function (_super) {
__extends(StockTooltipSettings, _super);
function StockTooltipSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(false)
], StockTooltipSettings.prototype, "enable", void 0);
__decorate([
Property(true)
], StockTooltipSettings.prototype, "enableMarker", void 0);
__decorate([
Property(false)
], StockTooltipSettings.prototype, "shared", void 0);
__decorate([
Property(null)
], StockTooltipSettings.prototype, "fill", void 0);
__decorate([
Property(null)
], StockTooltipSettings.prototype, "header", void 0);
__decorate([
Property(0.75)
], StockTooltipSettings.prototype, "opacity", void 0);
__decorate([
Complex({ fontFamily: null, size: '12px', fontStyle: 'Normal', fontWeight: null, color: null }, Font)
], StockTooltipSettings.prototype, "textStyle", void 0);
__decorate([
Property(null)
], StockTooltipSettings.prototype, "format", void 0);
__decorate([
Property(null)
], StockTooltipSettings.prototype, "template", void 0);
__decorate([
Property(true)
], StockTooltipSettings.prototype, "enableAnimation", void 0);
__decorate([
Property(300)
], StockTooltipSettings.prototype, "duration", void 0);
__decorate([
Property(1000)
], StockTooltipSettings.prototype, "fadeOutDuration", void 0);
__decorate([
Property('Move')
], StockTooltipSettings.prototype, "fadeOutMode", void 0);
__decorate([
Property(false)
], StockTooltipSettings.prototype, "enableTextWrap", void 0);
__decorate([
Property(true)
], StockTooltipSettings.prototype, "showNearestPoint", void 0);
__decorate([
Complex({ color: null, width: null }, Border)
], StockTooltipSettings.prototype, "border", void 0);
__decorate([
Property('Fixed')
], StockTooltipSettings.prototype, "position", void 0);
__decorate([
Property(false)
], StockTooltipSettings.prototype, "showNearestTooltip", void 0);
__decorate([
Property(true)
], StockTooltipSettings.prototype, "showHeaderLine", void 0);
return StockTooltipSettings;
}(ChildProperty));
/**
* @private
*/
var Index = /** @__PURE__ @class */ (function () {
function Index(seriesIndex, pointIndex) {
this.series = seriesIndex;
this.point = pointIndex;
}
return Index;
}());
/**
* The `DoubleRange` class represents a numeric range with minimum and maximum values.
*
* @private
*/
var DoubleRange = /** @__PURE__ @class */ (function () {
function DoubleRange(start, end) {
/*
if (!isNaN(start) && !isNaN(end)) {
this.mIsEmpty = true;
} else {
this.mIsEmpty = false;
}*/
if (start < end) {
this.mStart = start;
this.mEnd = end;
}
else {
this.mStart = end;
this.mEnd = start;
}
}
Object.defineProperty(DoubleRange.prototype, "start", {
//private mIsEmpty: boolean;
/**
* Gets the start value.
*
* @returns {number} - The start value.
* @private
*/
get: function () {
return this.mStart;
},
enumerable: true,
configurable: true
});
Object.defineProperty(DoubleRange.prototype, "end", {
/**
* Gets the end value.
*
* @returns {number} - The end value.
* @private
*/
get: function () {
return this.mEnd;
},
enumerable: true,
configurable: true
});
Object.defineProperty(DoubleRange.prototype, "delta", {
/*
get isEmpty(): boolean {
return this.mIsEmpty;
}*/
/**
* Gets the delta value.
*
* @returns {number} - The delta value.
* @private
*/
get: function () {
return (this.mEnd - this.mStart);
},
enumerable: true,
configurable: true
});
Object.defineProperty(DoubleRange.prototype, "median", {
/**
* Gets the median value.
*
* @returns {number} - The median value.
* @private
*/
get: function () {
return this.mStart + (this.mEnd - this.mStart) / 2;
},
enumerable: true,
configurable: true
});
return DoubleRange;
}());
/**
* The `Double` module is used to render the numeric axis in charts.
*/
var Double = /** @__PURE__ @class */ (function () {
/**
* Constructor for the dateTime module.
*
* @private
* @param {Chart} chart - Specifies the chart.
*/
function Double(chart) {
this.isColumn = 0;
this.isStacking = false;
this.chart = chart;
}
/**
* Numeric Nice Interval for the axis.
*
* @private
* @param {Axis} axis - The axis.
* @param {number} delta - The delta value.
* @param {Size} size - The size.
* @returns {number} - The calculated nice interval.
*/
Double.prototype.calculateNumericNiceInterval = function (axis, delta, size) {
var actualDesiredIntervalsCount = getActualDesiredIntervalsCount(size, axis);
var niceInterval = delta / actualDesiredIntervalsCount;
if (!isNullOrUndefined(axis.desiredIntervals)) {
if (this.isAutoIntervalOnBothAxis(axis)) {
return niceInterval;
}
}
var minInterval = Math.pow(10, Math.floor(logBase(niceInterval, 10)));
for (var _i = 0, _a = axis.intervalDivs; _i < _a.length; _i++) {
var interval = _a[_i];
var currentInterval = minInterval * interval;
if (actualDesiredIntervalsCount < (delta / currentInterval)) {
break;
}
niceInterval = currentInterval;
}
return niceInterval;
};
/**
* Determines whether auto interval is enabled on both axes.
*
* @private
* @param {Axis} axis - The axis.
* @returns {boolean} - The boolean value indicating if auto interval is enabled on both axes.
*/
Double.prototype.isAutoIntervalOnBothAxis = function (axis) {
if (((axis.zoomFactor < 1 || axis.zoomPosition > 0) && axis.enableAutoIntervalOnZooming)) {
return false;
}
else {
return true;
}
};
Double.prototype.getActualRange = function (axis, size) {
this.initializeDoubleRange(axis);
if ((!axis.startFromZero) && (this.isColumn > 0)) {
axis.actualRange.interval = axis.interval || this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);
axis.actualRange.max = axis.doubleRange.end + axis.actualRange.interval;
if ((axis.doubleRange.start - axis.actualRange.interval < 0 && axis.doubleRange.start > 0)) {
axis.actualRange.min = 0;
}
else {
axis.actualRange.min = axis.doubleRange.start - (this.isStacking ? 0 : axis.actualRange.interval);
}
}
else {
axis.actualRange.interval = axis.interval || this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);
axis.actualRange.min = axis.doubleRange.start;
axis.actualRange.max = axis.doubleRange.end;
}
};
/**
* Range for the axis.
*
* @private
* @param {Axis} axis - The axis.
* @returns {void}
*/
Double.prototype.initializeDoubleRange = function (axis) {
//Axis Min
if (axis.minimum !== null) {
this.min = axis.minimum;
}
else if (this.min === null || this.min === Number.POSITIVE_INFINITY) {
this.min = 0;
}
// Axis Max
if (axis.maximum !== null) {
this.max = axis.maximum;
}
else if (this.max === null || this.max === Number.NEGATIVE_INFINITY) {
this.max = 5;
}
if (this.min === this.max) {
this.max = axis.valueType.indexOf('Category') > -1 ? this.max : this.min + 1;
}
axis.doubleRange = new DoubleRange(this.min, this.max);
axis.actualRange = {};
};
/**
* The function to calculate the range and labels for the axis.
*
* @returns {void}
* @private
*/
Double.prototype.calculateRangeAndInterval = function (size, axis) {
this.calculateRange(axis);
this.getActualRange(axis, size);
this.applyRangePadding(axis, size);
this.calculateVisibleLabels(axis, this.chart);
};
/**
* Calculate Range for the axis.
*
* @private
*/
Double.prototype.calculateRange = function (axis) {
/** Generate axis range */
this.min = null;
this.max = null;
if (!setRange(axis)) {
for (var _i = 0, _a = axis.series; _i < _a.length; _i++) {
var series = _a[_i];
if (!series.visible) {
continue;
}
this.paddingInterval = 0;
if (!isNullOrUndefined(series.points)) {
axis.maxPointLength = series.points.length;
}
axis.maxPointLength = series.points.length;
if (((series.type.indexOf('Column') > -1 || series.type.indexOf('Histogram') > -1) && axis.orientation === 'Horizontal')
|| (series.type.indexOf('Bar') > -1 && axis.orientation === 'Vertical')) {
if ((series.xAxis.valueType === 'Double' || series.xAxis.valueType === 'DateTime')
&& series.xAxis.rangePadding === 'Auto') {
this.paddingInterval = getMinPointsDelta(series.xAxis, axis.series) * 0.5;
}
}
//For xRange
if (axis.orientation === 'Horizontal') {
if (this.chart.requireInvertedAxis) {
this.yAxisRange(axis, series);
}
else {
this.findMinMax(series.xMin - this.paddingInterval, series.xMax + this.paddingInterval);
}
}
// For yRange
if (axis.orientation === 'Vertical') {
this.isColumn += (series.type.indexOf('Column') !== -1 || series.type.indexOf('Bar') !== -1 || series.drawType === 'Column') ? 1 : 0;
this.isStacking = series.type.indexOf('Stacking') !== -1;
if (this.chart.requireInvertedAxis) {
this.findMinMax(series.xMin - this.paddingInterval, series.xMax + this.paddingInterval);
}
else {
this.yAxisRange(axis, series);
}
}
}
}
};
Double.prototype.yAxisRange = function (axis, series) {
if (series.dragSettings.enable && this.chart.dragY) {
if (this.chart.dragY >= axis.visibleRange.max) {
series.yMax = this.chart.dragY + axis.visibleRange.interval;
}
if (this.chart.dragY <= axis.visibleRange.min) {
series.yMin = this.chart.dragY - axis.visibleRange.interval;
}
}
if (series.type === 'Waterfall') {
var cumulativeMax = 0;
var cumulativeValue = 0;
for (var i = 0; i < series.yData.length; i++) {
if (!(series.intermediateSumIndexes && series.intermediateSumIndexes.indexOf(i) !== -1) &&
!(series.sumIndexes && series.sumIndexes.indexOf(i) !== -1)) {
cumulativeValue += series.yData[i];
}
if (cumulativeValue > cumulativeMax) {
cumulativeMax = cumulativeValue;
}
}
this.findMinMax(series.yMin, cumulativeMax);
}
else {
this.findMinMax(series.yMin, series.yMax);
}
};
Double.prototype.findMinMax = function (min, max) {
if (this.min === null || this.min > min) {
this.min = min;
}
if (this.max === null || this.max < max) {
this.max = max;
}
if ((this.max === this.min) && this.max < 0 && this.min < 0) { // max == min
this.max = 0;
}
};
/**
* Apply padding for the range.
*
* @private
* @param {Axis} axis - The axis for which padding is applied.
* @param {Size} size - The size used for padding calculation.
* @returns {void}
*/
Double.prototype.applyRangePadding = function (axis, size) {
var start = axis.actualRange.min;
var end = axis.actualRange.max;
if (!setRange(axis)) {
var interval = axis.actualRange.interval;
var padding = axis.getRangePadding(this.chart);
if (padding === 'Additional' || padding === 'Round') {
this.findAdditional(axis, start, end, interval, size);
}
else if (padding === 'Normal') {
this.findNormal(axis, start, end, interval, size);
}
else {
this.updateActualRange(axis, start, end, interval);
}
}
axis.actualRange.delta = axis.actualRange.max - axis.actualRange.min;
this.calculateVisibleRange(size, axis);
};
Double.prototype.updateActualRange = function (axis, minimum, maximum, interval) {
axis.actualRange = {
min: axis.minimum != null ? axis.minimum : minimum,
max: axis.maximum != null ? axis.maximum : maximum,
interval: axis.interval != null ? axis.interval : interval,
delta: axis.actualRange.delta
};
};
Double.prototype.findAdditional = function (axis, start, end, interval, size) {
var minimum;
var maximum;
minimum = Math.floor(start / interval) * interval;
maximum = Math.ceil(end / interval) * interval;
if (axis.rangePadding === 'Additional') {
minimum -= interval;
maximum += interval;
}
if (!isNullOrUndefined(axis.desiredIntervals)) {
var delta = maximum - minimum;
interval = this.calculateNumericNiceInterval(axis, delta, size);
}
this.updateActualRange(axis, minimum, maximum, interval);
};
Double.prototype.findNormal = function (axis, start, end, interval, size) {
var remaining;
var minimum;
var maximum;
var startValue = start;
if (start < 0) {
startValue = 0;
minimum = start + (start * 0.05);
remaining = interval + (minimum % interval);
if ((0.365 * interval) >= remaining) {
minimum -= interval;
}
if (minimum % interval < 0) {
minimum = (minimum - interval) - (minimum % interval);
}
}
else {
minimum = start < ((5.0 / 6.0) * end) ? 0 : (start - (end - start) * 0.5);
if (minimum % interval > 0) {
minimum -= (minimum % interval);
}
}
maximum = (end > 0) ? (end + (end - startValue) * 0.05) : (end - (end - startValue) * 0.05);
remaining = interval - (maximum % interval);
if ((0.365 * interval) >= remaining) {
maximum += interval;
}
if (maximum % interval > 0) {
maximum = (maximum + interval) - (maximum % interval);
}
axis.doubleRange = new DoubleRange(minimum, maximum);
if (minimum === 0 || (minimum < 0 && maximum < 0)) {
interval = this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size);
maximum = Math.ceil(maximum / interval) * interval;
}
this.updateActualRange(axis, minimum, maximum, interval);
};
/**
* Calculate visible range for axis.
*
* @private
* @param {Size} size - The size used for calculation.
* @param {Axis} axis - The axis for which the visible range is calculated.
* @returns {void}
*/
Double.prototype.calculateVisibleRange = function (size, axis) {
axis.visibleRange = {
max: axis.actualRange.max, min: axis.actualRange.min,
delta: axis.actualRange.delta, interval: axis.actualRange.interval
};
if (this.chart.chartAreaType === 'Cartesian') {
var isLazyLoad = isNullOrUndefined(axis.zoomingScrollBar) ? false : axis.zoomingScrollBar.isLazyLoad;
if ((axis.zoomFactor < 1 || axis.zoomPosition > 0) && !isLazyLoad) {
axis.calculateVisibleRangeOnZooming();
axis.visibleRange.interval = (axis.enableAutoIntervalOnZooming) ?
this.calculateNumericNiceInterval(axis, axis.doubleRange.delta, size)
: axis.visibleRange.interval;
}
}
var rangeDifference = (axis.visibleRange.max - axis.visibleRange.min) % axis.visibleRange.interval;
if (rangeDifference !== 0 && !isNaN(rangeDifference) && axis.valueType === 'Double' &&
axis.orientation === 'Vertical' && axis.rangePadding === 'Auto') {
var duplicateTempInterval = void 0;
var tempInterval = axis.visibleRange.min;
for (; (tempInterval <= axis.visibleRange.max) && (duplicateTempInterval !== tempInterval); tempInterval += axis.visibleRange.interval) {
duplicateTempInterval = tempInterval;
}
if (duplicateTempInterval < axis.visibleRange.max) {
axis.visibleRange.max = duplicateTempInterval + axis.visibleRange.interval;
}
}
axis.triggerRangeRender(this.chart, axis.visibleRange.min, axis.visibleRange.max, axis.visibleRange.interval);
};
/**
* Calculate label for the axis.
*
* @private
*/
Double.prototype.calculateVisibleLabels = function (axis, chart) {
/** Generate axis labels */
axis.visibleLabels = [];
var tempInterval = axis.visibleRange.min;
var labelStyle;
var controlName = chart.getModuleName();
var isPolarRadar = controlName === 'chart' && chart.chartAreaType === 'PolarRadar';
if (!isPolarRadar && (axis.zoomFactor < 1 || axis.zoomPosition > 0 || this.paddingInterval)) {
tempInterval = axis.visibleRange.min - (axis.visibleRange.min % axis.visibleRange.interval);
}
var format = this.getFormat(axis);
var isCustom = format.match('{value}') !== null;
var intervalDigits = 0;
var formatDigits = 0;
if (axis.labelFormat && axis.labelFormat.indexOf('n') > -1) {
formatDigits = parseInt(axis.labelFormat.substring(1, axis.labelFormat.length), 10);
}
axis.format = chart.intl.getNumberFormat({
format: isCustom ? '' : format,
useGrouping: chart.useGroupingSeparator
});
axis.startLabel = axis.format(axis.visibleRange.min);
axis.endLabel = axis.format(axis.visibleRange.max);
if (axis.visibleRange.interval && (axis.visibleRange.interval + '').indexOf('.') >= 0) {
intervalDigits = (axis.visibleRange.interval + '').split('.')[1].length;
}
var duplicateTempInterval;
for (; (tempInterval <= axis.visibleRange.max) && (duplicateTempInterval !== tempInterval); tempInterval += axis.visibleRange.interval) {
duplicateTempInterval = tempInterval;
labelStyle = (extend({}, getValue('properties', axis.labelStyle), null, true));
if (withIn(tempInterval, axis.visibleRange)) {
triggerLabelRender(chart, tempInterval, this.formatValue(axis, isCustom, format, tempInterval), labelStyle, axis);
}
}
if (tempInterval && (tempInterval + '').indexOf('.') >= 0 && (tempInterval + '').split('.')[1].length > 10) {
tempInterval = (tempInterval + '').split('.')[1].length > (formatDigits || intervalDigits) ?
+tempInterval.toFixed(formatDigits || intervalDigits) : tempInterval;
if (tempInterval <= axis.visibleRange.max) {
triggerLabelRender(chart, tempInterval, this.formatValue(axis, isCustom, format, tempInterval), labelStyle, axis);
}
}
if (axis.getMaxLabelWidth) {
axis.getMaxLabelWidth(this.chart);
}
};
/**
* Format of the axis label.
*
* @private
*/
Double.prototype.getFormat = function (axis) {
if (axis.labelFormat) {
if (axis.labelFormat.indexOf('p') === 0 && axis.labelFormat.indexOf('{value}') === -1 && axis.isStack100) {
return '{value}%';
}
return axis.labelFormat;
}
return axis.isStack100 ? '{value}%' : '';
};
/**
* Formatted the axis label.
*
* @private
*/
Double.prototype.formatValue = function (axis, isCustom, format, tempInterval) {
/*The toLocaleString method is used to adjust the decimal points for this ticket, specifically for ticket numbers I481747 and I541484.*/
var labelValue = !(tempInterval % 1) ? tempInterval : Number(tempInterval.toLocaleString('en-US').split(',').join(''));
return isCustom ? format.replace('{value}', axis.format(labelValue))
: format ? axis.format(tempInterval) : axis.format(labelValue);
};
/**
* Get module name.
*
* @returns {string} - Returns the module name.
*/
Double.prototype.getModuleName = function () {
/**
* Returns the module name
*/
return 'Double';
};
/**
* To destroy the double axis.
*
* @returns {void}
* @private
*/
Double.prototype.destroy = function () {
/**
* Destroy method performed here.
*/
};
return Double;
}());
/**
* Specifies the chart constant value
*/
/** @private */
var loaded = 'loaded';
/** @private */
var legendClick = 'legendClick';
/** @private */
var load = 'load';
/** @private */
var animationComplete = 'animationComplete';
/** @private */
var legendRender = 'legendRender';
/** @private */
var textRender = 'textRender';
/** @private */
var pointRender = 'pointRender';
/** @private */
var sharedTooltipRender = 'sharedTooltipRender';
/** @private */
var seriesRender = 'seriesRender';
/** @private */
var axisLabelRender = 'axisLabelRender';
/** @private */
var axisLabelClick = 'axisLabelClick';
/** @private */
var axisRangeCalculated = 'axisRangeCalculated';
/** @private */
var axisMultiLabelRender = 'axisMultiLabelRender';
/** @private */
var tooltipRender = 'tooltipRender';
/** @private */
var chartMouseMove = 'chartMouseMove';
/** @private */
var chartMouseClick = 'chartMouseClick';
/** @private */
var chartDoubleClick = 'chartDoubleClick';
/** @private */
var pointClick = 'pointClick';
/** @private */
var pointDoubleClick = 'pointDoubleClick';
/** @private */
var pointMove = 'pointMove';
/** @private */
var chartMouseLeave = 'chartMouseLeave';
/** @private */
var chartMouseDown = 'chartMouseDown';
/** @private */
var chartMouseUp = 'chartMouseUp';
/** @private */
var zoomComplete = 'zoomComplete';
/** @private */
var dragComplete = 'dragComplete';
/** @private */
var selectionComplete = 'selectionComplete';
/** @private */
var resized = 'resized';
/** @private */
var beforeResize = 'beforeResize';
/** @private */
var beforePrint = 'beforePrint';
/** @private */
var annotationRender = 'annotationRender';
/** @private */
var scrollStart = 'scrollStart';
/** @private */
var scrollEnd = 'scrollEnd';
/** @private */
var scrollChanged = 'scrollChanged';
/** @private */
var stockEventRender = 'stockEventRender';
/** @private */
var multiLevelLabelClick = 'multiLevelLabelClick';
/** @private */
var dragStart = 'dragStart';
/** @private */
var drag = 'drag';
/** @private */
var dragEnd = 'dragEnd';
/*** @private*/
var regSub = /~\d+~/g;
/*** @private*/
var regSup = /\^\d+\^/g;
/** @private */
var beforeExport = 'beforeExport';
/** @private */
var afterExport = 'afterExport';
/** @private */
var bulletChartMouseClick = 'bulletChartMouseClick';
/** @private */
var onZooming = 'onZooming';
var __extends$1 = (undefined && undefined.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
/**
* Configures the annotation settings for a chart to highlight or provide additional information about specific points or regions.
*/
var ChartAnnotationSettings = /** @__PURE__ @class */ (function (_super) {
__extends$1(ChartAnnotationSettings, _super);
function ChartAnnotationSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate$1([
Property('0')
], ChartAnnotationSettings.prototype, "x", void 0);
__decorate$1([
Property('0')
], ChartAnnotationSettings.prototype, "y", void 0);
__decorate$1([
Property(null)
], ChartAnnotationSettings.prototype, "content", void 0);
__decorate$1([
Property('Center')
], ChartAnnotationSettings.prototype, "horizontalAlignment", void 0);
__decorate$1([
Property('Pixel')
], ChartAnnotationSettings.prototype, "coordinateUnits", void 0);
__decorate$1([
Property('Chart')
], ChartAnnotationSettings.prototype, "region", void 0);
__decorate$1([
Property('Middle')
], ChartAnnotationSettings.prototype, "verticalAlignment", void 0);
__decorate$1([
Property(null)
], ChartAnnotationSettings.prototype, "xAxisName", void 0);
__decorate$1([
Property(null)
], ChartAnnotationSettings.prototype, "yAxisName", void 0);
__decorate$1([
Property(null)
], ChartAnnotationSettings.prototype, "description", void 0);
__decorate$1([
Complex({}, Accessibility)
], ChartAnnotationSettings.prototype, "accessibility", void 0);
return ChartAnnotationSettings;
}(ChildProperty));
/**
* The `LabelBorder` class provides options to customize the border settings for chart labels.
*/
var LabelBorder = /** @__PURE__ @class */ (function (_super) {
__extends$1(LabelBorder, _super);
function LabelBorder() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate$1([
Property('')
], LabelBorder.prototype, "color", void 0);
__decorate$1([
Property(1)
], LabelBorder.prototype, "width", void 0);
__decorate$1([
Property('Rectangle')
], LabelBorder.prototype, "type", void 0);
return LabelBorder;
}(ChildProperty));
/**
* The `MultiLevelCategories` class allows defining and customizing the categories used in multi-level labels.
* This is particularly useful when there is a need to display hierarchical or grouped data labels on the chart axis.
*/
var MultiLevelCategories = /** @__PURE__ @class */ (function (_super) {
__extends$1(MultiLevelCategories, _super);
function MultiLevelCategories() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate$1([
Property(null)
], MultiLevelCategories.prototype, "start", void 0);
__decorate$1([
Property(null)
], MultiLevelCategories.prototype, "end", void 0);
__decorate$1([
Property('')
], MultiLevelCategories.prototype, "text", void 0);
__decorate$1([
Property(null)
], MultiLevelCategories.prototype, "maximumTextWidth", void 0);
__decorate$1([
Property(null)
], MultiLevelCategories.prototype, "customAttributes", void 0);