scichart 2.0.2132 → 2.0.2179

package/Charting/ChartModifiers/MouseWheelZoomModifier.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__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]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -16,6 +18,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.MouseWheelZoomModifier = exports.EActionType = void 0;
 var ChartModifierType_1 = require("../../types/ChartModifierType");
 var XyDirection_1 = require("../../types/XyDirection");
+var includedAxis_1 = require("../../utils/includedAxis");
 var translate_1 = require("../../utils/translate");
 var AxisBase2D_1 = require("../Visuals/Axis/AxisBase2D");
 var ChartModifierBase2D_1 = require("./ChartModifierBase2D");
@@ -55,31 +58,89 @@ var MouseWheelZoomModifier = /** @class */ (function (_super) {
      * @param options Optional parameters to configure the modifier via {@link IMouseWheelZoomModifierOptions}
      */
     function MouseWheelZoomModifier(options) {
-        var _a;
+        var _a, _b, _c, _d, _e, _f, _g;
         var _this = _super.call(this, options) || this;
         _this.type = ChartModifierType_1.EChart2DModifierType.MouseWheelZoom;
+        /**
+         * Whether the modifier applies when the mouse is over the area where series are drawn (ie not over the axes).  Default true.
+         */
+        _this.applyToSeriesViewRect = true;
+        /**
+         * Whether the modifier applies when the mouse is over the axes. Default true.
+         */
+        _this.applyToAxes = true;
+        _this.includedXAxisMap = new Map();
+        _this.includedYAxisMap = new Map();
         _this.growFactor = (options === null || options === void 0 ? void 0 : options.growFactor) || 0.001;
         _this.actionType = (_a = options === null || options === void 0 ? void 0 : options.actionType) !== null && _a !== void 0 ? _a : EActionType.Zoom;
+        _this.applyToSeriesViewRect = (_b = options === null || options === void 0 ? void 0 : options.applyToSeriesViewRect) !== null && _b !== void 0 ? _b : _this.applyToSeriesViewRect;
+        _this.applyToAxes = (_c = options === null || options === void 0 ? void 0 : options.applyToAxes) !== null && _c !== void 0 ? _c : _this.applyToAxes;
         if (_this.actionType === EActionType.Pan && _this.xyDirection === XyDirection_1.EXyDirection.XyDirection) {
             console.warn("SciChart MouseWheelZoomModifier: actionType=Pan and xyDirection=Xy conflict. Auto setting XyDirection to X");
             _this.xyDirection = XyDirection_1.EXyDirection.XDirection;
         }
+        if ((options === null || options === void 0 ? void 0 : options.includedXAxisIds) && (options === null || options === void 0 ? void 0 : options.excludedXAxisIds)) {
+            throw new Error("You either should use includedXAxisIds or excludedXAxisIds");
+        }
+        if ((options === null || options === void 0 ? void 0 : options.includedYAxisIds) && (options === null || options === void 0 ? void 0 : options.excludedYAxisIds)) {
+            throw new Error("You either should use includedYAxisIds or excludedYAxisIds");
+        }
+        (_d = options === null || options === void 0 ? void 0 : options.includedXAxisIds) === null || _d === void 0 ? void 0 : _d.forEach(function (id) {
+            _this.includedXAxisMap.set(id, true);
+        });
+        (_e = options === null || options === void 0 ? void 0 : options.includedYAxisIds) === null || _e === void 0 ? void 0 : _e.forEach(function (id) {
+            _this.includedYAxisMap.set(id, true);
+        });
+        (_f = options === null || options === void 0 ? void 0 : options.excludedXAxisIds) === null || _f === void 0 ? void 0 : _f.forEach(function (id) {
+            _this.includedXAxisMap.set(id, false);
+        });
+        (_g = options === null || options === void 0 ? void 0 : options.excludedYAxisIds) === null || _g === void 0 ? void 0 : _g.forEach(function (id) {
+            _this.includedYAxisMap.set(id, false);
+        });
         return _this;
     }
     /**
      * @inheritDoc
      */
     MouseWheelZoomModifier.prototype.modifierMouseWheel = function (args) {
+        var _this = this;
         _super.prototype.modifierMouseWheel.call(this, args);
-        args.handled = true;
-        var zoomPoint = translate_1.translateFromCanvasToSeriesViewRect(args.mousePoint, this.parentSurface.seriesViewRect);
-        if (zoomPoint) {
+        var zoomPoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(args.mousePoint, this.parentSurface.seriesViewRect);
+        if (zoomPoint && this.applyToSeriesViewRect) {
             if (this.actionType === EActionType.Zoom) {
                 this.performZoom(zoomPoint, args.mouseWheelDelta);
             }
             else if (this.actionType === EActionType.Pan) {
                 this.performPan(args.mouseWheelDelta);
             }
+            args.handled = true;
+        }
+        else if (this.applyToAxes) {
+            var targetAxes = [];
+            if ([XyDirection_1.EXyDirection.XDirection, XyDirection_1.EXyDirection.XyDirection].includes(this.xyDirection)) {
+                targetAxes.push.apply(targetAxes, this.getIncludedXAxis());
+            }
+            if ([XyDirection_1.EXyDirection.YDirection, XyDirection_1.EXyDirection.XyDirection].includes(this.xyDirection)) {
+                targetAxes.push.apply(targetAxes, this.getIncludedYAxis());
+            }
+            var activeAxes = (0, ChartModifierBase2D_1.getActiveAxes)(targetAxes, args.mousePoint);
+            if (activeAxes.length > 0) {
+                args.handled = true;
+                if (this.actionType === EActionType.Zoom) {
+                    var fraction_1 = this.growFactor * args.mouseWheelDelta;
+                    var mousePoint_1 = (0, translate_1.translateFromCanvasToSeriesViewRect)(args.mousePoint, this.parentSurface.seriesViewRect, true);
+                    activeAxes.forEach(function (axis) {
+                        _this.growBy(mousePoint_1, axis, fraction_1);
+                    });
+                }
+                else if (this.actionType === EActionType.Pan) {
+                    activeAxes.forEach(function (axis) {
+                        var size = _this.getAxisSize(axis);
+                        var pixels = args.mouseWheelDelta * _this.growFactor * size;
+                        axis.scroll(pixels, AxisBase2D_1.EClipMode.None);
+                    });
+                }
+            }
         }
     };
     /**
@@ -91,12 +152,12 @@ var MouseWheelZoomModifier = /** @class */ (function (_super) {
         var _this = this;
         var fraction = this.growFactor * wheelDelta;
         if ([XyDirection_1.EXyDirection.XDirection, XyDirection_1.EXyDirection.XyDirection].includes(this.xyDirection)) {
-            this.parentSurface.xAxes.asArray().forEach(function (axis) {
+            this.getIncludedXAxis().forEach(function (axis) {
                 _this.growBy(mousePoint, axis, fraction);
             });
         }
         if ([XyDirection_1.EXyDirection.YDirection, XyDirection_1.EXyDirection.XyDirection].includes(this.xyDirection)) {
-            this.parentSurface.yAxes.asArray().forEach(function (axis) {
+            this.getIncludedYAxis().forEach(function (axis) {
                 _this.growBy(mousePoint, axis, fraction);
             });
         }
@@ -108,25 +169,59 @@ var MouseWheelZoomModifier = /** @class */ (function (_super) {
     MouseWheelZoomModifier.prototype.performPan = function (wheelDelta) {
         var _this = this;
         if ([XyDirection_1.EXyDirection.XDirection, XyDirection_1.EXyDirection.XyDirection].includes(this.xyDirection)) {
-            this.parentSurface.xAxes.asArray().forEach(function (axis) {
+            this.getIncludedXAxis().forEach(function (axis) {
                 var size = _this.getAxisSize(axis);
                 var pixels = wheelDelta * _this.growFactor * size;
                 axis.scroll(pixels, AxisBase2D_1.EClipMode.None);
             });
         }
         if ([XyDirection_1.EXyDirection.YDirection, XyDirection_1.EXyDirection.XyDirection].includes(this.xyDirection)) {
-            this.parentSurface.yAxes.asArray().forEach(function (axis) {
+            this.getIncludedYAxis().forEach(function (axis) {
                 var size = _this.getAxisSize(axis);
                 var pixels = wheelDelta * _this.growFactor * size;
                 axis.scroll(pixels, AxisBase2D_1.EClipMode.None);
             });
         }
     };
+    /** @inheritDoc */
+    MouseWheelZoomModifier.prototype.includeXAxis = function (axis, isIncluded) {
+        this.includedXAxisMap.set(axis.id, isIncluded);
+    };
+    /** @inheritDoc */
+    MouseWheelZoomModifier.prototype.includeYAxis = function (axis, isIncluded) {
+        this.includedYAxisMap.set(axis.id, isIncluded);
+    };
+    /** @inheritDoc */
+    MouseWheelZoomModifier.prototype.includeAllAxes = function () {
+        this.includedXAxisMap.clear();
+    };
+    /** @inheritDoc */
+    MouseWheelZoomModifier.prototype.getIncludedXAxis = function () {
+        return (0, includedAxis_1.getIncludedAxis)(this.parentSurface.xAxes.asArray(), this.includedXAxisMap);
+    };
+    /** @inheritDoc */
+    MouseWheelZoomModifier.prototype.getIncludedYAxis = function () {
+        return (0, includedAxis_1.getIncludedAxis)(this.parentSurface.yAxes.asArray(), this.includedYAxisMap);
+    };
     MouseWheelZoomModifier.prototype.toJSON = function () {
         var json = _super.prototype.toJSON.call(this);
         var options = {
             actionType: this.actionType,
-            growFactor: this.growFactor
+            growFactor: this.growFactor,
+            applyToSeriesViewRect: this.applyToSeriesViewRect,
+            applyToAxes: this.applyToAxes,
+            includedXAxisIds: Array.from(this.includedXAxisMap.entries())
+                .filter(function (a) { return a[1]; })
+                .map(function (a) { return a[0]; }),
+            includedYAxisIds: Array.from(this.includedYAxisMap.entries())
+                .filter(function (a) { return a[1]; })
+                .map(function (a) { return a[0]; }),
+            excludedXAxisIds: Array.from(this.includedXAxisMap.entries())
+                .filter(function (a) { return !a[1]; })
+                .map(function (a) { return a[0]; }),
+            excludedYAxisIds: Array.from(this.includedYAxisMap.entries())
+                .filter(function (a) { return !a[1]; })
+                .map(function (a) { return a[0]; })
         };
         Object.assign(json.options, options);
         return json;

package/Charting/ChartModifiers/OverviewRangeSelectionModifier.d.ts

@@ -1,4 +1,4 @@
-import { AnimationToken } from "../../Core/AnimationToken";
+import { IGenericAnimation } from "../../Core/Animations/GenericAnimation";
 import { NumberRange } from "../../Core/NumberRange";
 import { Point } from "../../Core/Point";
 import { EChart2DModifierType } from "../../types/ChartModifierType";
@@ -29,7 +29,7 @@ export interface IRangeSelectionModifierOptions extends IChartModifierBaseOption
 export declare class OverviewRangeSelectionModifier extends ChartModifierBase2D {
     readonly type = EChart2DModifierType.OverviewRangeSelection;
     onSelectedAreaChanged: (area?: NumberRange) => void;
-    overviewPositionAnimation: AnimationToken;
+    overviewPositionAnimation: IGenericAnimation;
     animationDuration: number;
     animate: boolean;
     protected pointTo: Point;
@@ -47,6 +47,10 @@ export declare class OverviewRangeSelectionModifier extends ChartModifierBase2D
      * @inheritDoc
      */
     onAttach(): void;
+    /**
+     * @inheritDoc
+     */
+    onDetach(): void;
     /**
      * @inheritDoc
      */
@@ -76,4 +80,5 @@ export declare class OverviewRangeSelectionModifier extends ChartModifierBase2D
      */
     set selectedArea(value: NumberRange);
     protected updateSelectionAnnotation(): void;
+    private xVisibleRangeChangeHandler;
 }

package/Charting/ChartModifiers/OverviewRangeSelectionModifier.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__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]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -64,6 +66,7 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         _this.onSelectedAreaChanged = options === null || options === void 0 ? void 0 : options.onSelectedAreaChanged;
         _this.xAxisId = (_a = options === null || options === void 0 ? void 0 : options.xAxisId) !== null && _a !== void 0 ? _a : _this.xAxisId;
         _this.yAxisId = (_b = options === null || options === void 0 ? void 0 : options.yAxisId) !== null && _b !== void 0 ? _b : _this.yAxisId;
+        _this.xVisibleRangeChangeHandler = _this.xVisibleRangeChangeHandler.bind(_this);
         return _this;
     }
     /**
@@ -73,6 +76,13 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         _super.prototype.onAttach.call(this);
         this.updateSelectionAnnotation();
     };
+    /**
+     * @inheritDoc
+     */
+    OverviewRangeSelectionModifier.prototype.onDetach = function () {
+        var xAxis = this.parentSurface.getXAxisById(this.xAxisId);
+        xAxis.visibleRangeChanged.unsubscribe(this.xVisibleRangeChangeHandler);
+    };
     /**
      * @inheritDoc
      */
@@ -84,7 +94,7 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         if (!this.isAttached) {
             throw new Error("Should not call OverviewRangeSelectionModifier.modifierMouseDown if not attached");
         }
-        var pointFromTrans = translate_1.translateFromCanvasToSeriesViewRect(args.mousePoint, this.parentSurface.seriesViewRect);
+        var pointFromTrans = (0, translate_1.translateFromCanvasToSeriesViewRect)(args.mousePoint, this.parentSurface.seriesViewRect);
         if (pointFromTrans) {
             this.isClicked = true;
         }
@@ -104,9 +114,9 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         }
         if (this.isClicked) {
             args.handled = true;
-            (_a = this.overviewPositionAnimation) === null || _a === void 0 ? void 0 : _a.cancelAnimation();
+            (_a = this.overviewPositionAnimation) === null || _a === void 0 ? void 0 : _a.cancel();
             var seriesViewRect = this.parentSurface.seriesViewRect;
-            this.pointTo = translate_1.translateFromCanvasToSeriesViewRect(Rect_1.Rect.clipPointToRect(args.mousePoint, seriesViewRect), seriesViewRect);
+            this.pointTo = (0, translate_1.translateFromCanvasToSeriesViewRect)(Rect_1.Rect.clipPointToRect(args.mousePoint, seriesViewRect), seriesViewRect);
             this.isClicked = false;
             var xAxis = this.parentSurface.getXAxisById(this.xAxisId);
             var xCalc = xAxis.getCurrentCoordinateCalculator();
@@ -123,6 +133,7 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
             };
             if (this.animate) {
                 this.overviewPositionAnimation = NumberRangeAnimator_1.NumberRangeAnimator.animate(initialCoordinatesRange, finalCoordinatesRange, this.animationDuration, updateAnnotationCoordinates, null);
+                this.parentSurface.addAnimation(this.overviewPositionAnimation);
             }
             else {
                 updateAnnotationCoordinates(finalCoordinatesRange);
@@ -193,7 +204,7 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         if (this.parentSurface) {
             var onDrag = function () {
                 var _a;
-                (_a = _this.overviewPositionAnimation) === null || _a === void 0 ? void 0 : _a.cancelAnimation();
+                (_a = _this.overviewPositionAnimation) === null || _a === void 0 ? void 0 : _a.cancel();
                 var selectedArea = new NumberRange_1.NumberRange(_this.rangeSelectionAnnotation.x1, _this.rangeSelectionAnnotation.x2);
                 _this.selectedAreaProperty = selectedArea;
                 _this.annotationBeforeSelectedAreaProperty.x2 = _this.rangeSelectionAnnotation.x1;
@@ -202,6 +213,8 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
             };
             var xAxis = (_a = this.parentSurface) === null || _a === void 0 ? void 0 : _a.getXAxisById(this.xAxisId);
             var commonAnnotationProperties = {
+                xAxisId: this.xAxisId,
+                yAxisId: this.yAxisId,
                 opacity: 0.5,
                 y1: 0,
                 y2: 1,
@@ -222,9 +235,9 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
                 annotationBeforeSelectedArea.minHeight = 0;
                 annotationAfterSelectedArea.minHeight = 0;
             }
-            this.rangeSelectionAnnotationProperty = Deleter_1.deleteSafe(this.rangeSelectionAnnotation);
-            this.annotationBeforeSelectedAreaProperty = Deleter_1.deleteSafe(this.annotationBeforeSelectedAreaProperty);
-            this.annotationAfterSelectedAreaProperty = Deleter_1.deleteSafe(this.annotationAfterSelectedAreaProperty);
+            this.rangeSelectionAnnotationProperty = (0, Deleter_1.deleteSafe)(this.rangeSelectionAnnotation);
+            this.annotationBeforeSelectedAreaProperty = (0, Deleter_1.deleteSafe)(this.annotationBeforeSelectedAreaProperty);
+            this.annotationAfterSelectedAreaProperty = (0, Deleter_1.deleteSafe)(this.annotationAfterSelectedAreaProperty);
             this.parentSurface.modifierAnnotations.remove(this.rangeSelectionAnnotation);
             this.parentSurface.modifierAnnotations.remove(this.annotationBeforeSelectedAreaProperty);
             this.parentSurface.modifierAnnotations.remove(this.annotationAfterSelectedAreaProperty);
@@ -234,20 +247,25 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
             this.rangeSelectionAnnotationProperty = dragBox;
             this.annotationBeforeSelectedAreaProperty = annotationBeforeSelectedArea;
             this.annotationAfterSelectedAreaProperty = annotationAfterSelectedArea;
+            xAxis.visibleRangeChanged.subscribe(this.xVisibleRangeChangeHandler);
         }
     };
+    OverviewRangeSelectionModifier.prototype.xVisibleRangeChangeHandler = function (args) {
+        this.annotationBeforeSelectedAreaProperty.x1 = args.visibleRange.min;
+        this.annotationAfterSelectedAreaProperty.x2 = args.visibleRange.max;
+    };
     return OverviewRangeSelectionModifier;
 }(ChartModifierBase2D_1.ChartModifierBase2D));
 exports.OverviewRangeSelectionModifier = OverviewRangeSelectionModifier;
 /** @ignore */
 var horizontalAdornerSvgTemplate = function (x1, y1, x2, y2) {
     var colorLine = "black";
-    return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"" + x1 + "\" y1=\"" + y1 + "\" x2=\"" + x2 + "\" y2=\"" + y1 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <line x1=\"" + x2 + "\" y1=\"" + y1 + "\" x2=\"" + x2 + "\" y2=\"" + y2 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <line x1=\"" + x1 + "\" y1=\"" + y2 + "\" x2=\"" + x2 + "\" y2=\"" + y2 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <line x1=\"" + x1 + "\" y1=\"" + y1 + "\" x2=\"" + x1 + "\" y2=\"" + y2 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <rect x=\"" + (x1 - 3) + "\" y=\"30%\" width=\"7\" height=\"40%\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"" + colorLine + "\" />\n        <rect x=\"" + (x2 - 3) + "\" y=\"30%\" width=\"7\" height=\"40%\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"" + colorLine + "\" />\n        </svg>";
+    return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"".concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y1, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x2, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y2, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x1, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <rect x=\"").concat(x1 - 3, "\" y=\"30%\" width=\"7\" height=\"40%\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        <rect x=\"").concat(x2 - 3, "\" y=\"30%\" width=\"7\" height=\"40%\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        </svg>");
 };
 /** @ignore */
 var verticalAdornerSvgTemplate = function (x1, y1, x2, y2) {
     var colorLine = "black";
-    return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"" + x1 + "\" y1=\"" + y1 + "\" x2=\"" + x2 + "\" y2=\"" + y1 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <line x1=\"" + x2 + "\" y1=\"" + y1 + "\" x2=\"" + x2 + "\" y2=\"" + y2 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <line x1=\"" + x1 + "\" y1=\"" + y2 + "\" x2=\"" + x2 + "\" y2=\"" + y2 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <line x1=\"" + x1 + "\" y1=\"" + y1 + "\" x2=\"" + x1 + "\" y2=\"" + y2 + "\" stroke=\"" + colorLine + "\" stroke-width=\"1\" />\n        <rect x=\"30%\" y=\"" + (y1 - 3) + "\" width=\"40%\" height=\"7\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"" + colorLine + "\" />\n        <rect x=\"30%\" y=\"" + (y2 - 3) + "\" width=\"40%\" height=\"7\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"" + colorLine + "\" />\n        </svg>";
+    return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"".concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y1, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x2, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y2, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x1, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <rect x=\"30%\" y=\"").concat(y1 - 3, "\" width=\"40%\" height=\"7\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        <rect x=\"30%\" y=\"").concat(y2 - 3, "\" width=\"40%\" height=\"7\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        </svg>");
 };
 var defaultSelectionAnnotationSvgString = "<svg width=\"50\" height=\"50\" preserveAspectRatio=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect width=\"100%\" height=\"100%\" style=\"fill:transparent\">\n    </rect>\n</svg>";
 var defaultUnSelectedAnnotationSvgString = "<svg width=\"50\" height=\"50\" preserveAspectRatio=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <rect width=\"100%\" height=\"100%\" style=\"fill:black\">\n        </rect>\n    </svg>";

package/Charting/ChartModifiers/PinchZoomModifier.d.ts

@@ -75,7 +75,7 @@ export declare class PinchZoomModifier extends ChartModifierBase2D {
     modifierPointerCancel(args: ModifierMouseArgs): void;
     toJSON(): {
         type: string;
-        options: Required<Pick<IChartModifierBaseOptions, "id" | "xAxisId" | "yAxisId" | "executeOn" | "xyDirection" | "modifierGroup">>;
+        options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
     /**
      * Performs the zoom operation around the mouse point

package/Charting/ChartModifiers/PinchZoomModifier.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__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]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -95,7 +97,7 @@ var PinchZoomModifier = /** @class */ (function (_super) {
             var currentVerticalTouchPointsDistance = Math.abs(firstTouchPoint.y - secondTouchPoint.y);
             this.parentSurface.setZoomState(ZoomState_1.EZoomState.UserZooming);
             var zoomCenterMousePoint = this.getMiddlePoint(firstTouchPoint, secondTouchPoint);
-            var zoomPoint = translate_1.translateFromCanvasToSeriesViewRect(zoomCenterMousePoint, this.parentSurface.seriesViewRect);
+            var zoomPoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(zoomCenterMousePoint, this.parentSurface.seriesViewRect);
             if (zoomPoint &&
                 this.previousHorizontalTouchPointsDistance !== undefined &&
                 this.previousVerticalTouchPointsDistance !== undefined) {

package/Charting/ChartModifiers/RolloverModifier.d.ts

@@ -175,7 +175,7 @@ export declare class RolloverModifier extends ChartModifierBase2D implements IIn
     hitTestRenderableSeries(rs: IRenderableSeries, mousePoint: Point): HitTestInfo;
     toJSON(): {
         type: string;
-        options: Required<Pick<IChartModifierBaseOptions, "id" | "xAxisId" | "yAxisId" | "executeOn" | "xyDirection" | "modifierGroup">>;
+        options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
     protected notifyPropertyChanged(propertyName: string): void;
     private isVerticalChart;

package/Charting/ChartModifiers/RolloverModifier.js

@@ -3,10 +3,12 @@ var __extends = (this && this.__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]; };
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
         return extendStatics(d, b);
     };
     return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
         extendStatics(d, b);
         function __() { this.constructor = d; }
         d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
@@ -104,20 +106,22 @@ var RolloverModifier = /** @class */ (function (_super) {
             if (typeof options.tooltipLegendTemplate === "string") {
                 _this.typeMap.set("tooltipLegendTemplate", options.tooltipLegendTemplate);
                 // @ts-ignore
-                options.tooltipLegendTemplate = classFactory_1.getFunction(BaseType_1.EBaseType.OptionFunction, options.tooltipLegendTemplate);
+                options.tooltipLegendTemplate = (0, classFactory_1.getFunction)(BaseType_1.EBaseType.OptionFunction, options.tooltipLegendTemplate);
             }
         }
-        _this.tooltipLegendTemplate = (_c = options === null || options === void 0 ? void 0 : options.tooltipLegendTemplate) !== null && _c !== void 0 ? _c : _this.tooltipLegendTemplate;
+        _this.tooltipLegendTemplate =
+            (_c = options === null || options === void 0 ? void 0 : options.tooltipLegendTemplate) !== null && _c !== void 0 ? _c : _this.tooltipLegendTemplate;
         _this.tooltipLegendOffsetX = (_d = options === null || options === void 0 ? void 0 : options.tooltipLegendOffsetX) !== null && _d !== void 0 ? _d : _this.tooltipLegendOffsetX;
         _this.tooltipLegendOffsetY = (_e = options === null || options === void 0 ? void 0 : options.tooltipLegendOffsetY) !== null && _e !== void 0 ? _e : _this.tooltipLegendOffsetY;
         if (options === null || options === void 0 ? void 0 : options.tooltipDataTemplate) {
             if (typeof options.tooltipDataTemplate === "string") {
                 _this.typeMap.set("tooltipDataTemplate", options.tooltipDataTemplate);
                 // @ts-ignore
-                options.tooltipDataTemplate = classFactory_1.getFunction(BaseType_1.EBaseType.OptionFunction, options.tooltipDataTemplate.type);
+                options.tooltipDataTemplate = (0, classFactory_1.getFunction)(BaseType_1.EBaseType.OptionFunction, options.tooltipDataTemplate.type);
             }
         }
-        _this.tooltipDataTemplateProperty = (_f = options === null || options === void 0 ? void 0 : options.tooltipDataTemplate) !== null && _f !== void 0 ? _f : _this.tooltipDataTemplateProperty;
+        _this.tooltipDataTemplateProperty =
+            (_f = options === null || options === void 0 ? void 0 : options.tooltipDataTemplate) !== null && _f !== void 0 ? _f : _this.tooltipDataTemplateProperty;
         _this.showRolloverLineProperty = (_g = options === null || options === void 0 ? void 0 : options.showRolloverLine) !== null && _g !== void 0 ? _g : _this.showRolloverLineProperty;
         _this.showTooltipProperty = (_h = options === null || options === void 0 ? void 0 : options.showTooltip) !== null && _h !== void 0 ? _h : _this.showTooltipProperty;
         _this.legendAnnotation = new RolloverLegendSvgAnnotation_1.RolloverLegendSvgAnnotation({
@@ -255,7 +259,7 @@ var RolloverModifier = /** @class */ (function (_super) {
             this.mousePosition = EMousePosition.OutOfCanvas;
         }
         else {
-            translatedMousePoint = translate_1.translateFromCanvasToSeriesViewRect(this.mousePoint, this.parentSurface.seriesViewRect);
+            translatedMousePoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(this.mousePoint, this.parentSurface.seriesViewRect);
             if (!translatedMousePoint) {
                 this.mousePosition = EMousePosition.AxisArea;
             }
@@ -437,13 +441,13 @@ var RolloverModifier = /** @class */ (function (_super) {
                 var hitTestInfo = this.hitTestRenderableSeries(firstSeries, this.mousePoint);
                 if (hitTestInfo && hitTestInfo.isWithinDataBounds) {
                     this.rolloverLineAnnotation.isHidden = false;
-                    var x = translate_1.translateToNotScaled(hitTestInfo.xCoord);
+                    var x = (0, translate_1.translateToNotScaled)(hitTestInfo.xCoord);
                     this.rolloverLineAnnotation.x1 = x;
                     this.rolloverLineAnnotation.x2 = x;
                     this.rolloverLineAnnotation.y1 = 0;
                     this.rolloverLineAnnotation.y2 = this.isVerticalChart()
-                        ? translate_1.translateToNotScaled(this.parentSurface.seriesViewRect.right)
-                        : translate_1.translateToNotScaled(this.parentSurface.seriesViewRect.bottom);
+                        ? (0, translate_1.translateToNotScaled)(this.parentSurface.seriesViewRect.right)
+                        : (0, translate_1.translateToNotScaled)(this.parentSurface.seriesViewRect.bottom);
                 }
                 else {
                     this.rolloverLineAnnotation.isHidden = true;
@@ -455,21 +459,21 @@ var RolloverModifier = /** @class */ (function (_super) {
         }
         else {
             this.rolloverLineAnnotation.isHidden = false;
-            var translatedMousePoint = translate_1.translateFromCanvasToSeriesViewRect(this.mousePoint, this.parentSurface.seriesViewRect);
+            var translatedMousePoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(this.mousePoint, this.parentSurface.seriesViewRect);
             if (translatedMousePoint) {
-                var x = translate_1.translateToNotScaled(translatedMousePoint.x);
-                var y = translate_1.translateToNotScaled(translatedMousePoint.y);
+                var x = (0, translate_1.translateToNotScaled)(translatedMousePoint.x);
+                var y = (0, translate_1.translateToNotScaled)(translatedMousePoint.y);
                 if (this.isVerticalChart()) {
                     this.rolloverLineAnnotation.x1 = y;
                     this.rolloverLineAnnotation.x2 = y;
                     this.rolloverLineAnnotation.y1 = 0;
-                    this.rolloverLineAnnotation.y2 = translate_1.translateToNotScaled(this.parentSurface.seriesViewRect.right);
+                    this.rolloverLineAnnotation.y2 = (0, translate_1.translateToNotScaled)(this.parentSurface.seriesViewRect.right);
                 }
                 else {
                     this.rolloverLineAnnotation.x1 = x;
                     this.rolloverLineAnnotation.x2 = x;
                     this.rolloverLineAnnotation.y1 = 0;
-                    this.rolloverLineAnnotation.y2 = translate_1.translateToNotScaled(this.parentSurface.seriesViewRect.bottom);
+                    this.rolloverLineAnnotation.y2 = (0, translate_1.translateToNotScaled)(this.parentSurface.seriesViewRect.bottom);
                 }
             }
         }
@@ -506,7 +510,7 @@ var RolloverModifier = /** @class */ (function (_super) {
                     if (isVisible) {
                         var absoluteXCoord = _this.isVerticalChart() ? hitTestInfo.yCoord : hitTestInfo.xCoord;
                         var absoluteYCoord = _this.isVerticalChart() ? hitTestInfo.xCoord : hitTestInfo.yCoord;
-                        var tooltipProps = exports.calcTooltipProps(index, rs, rs.rolloverModifierProps, _this.parentSurface.seriesViewRect, hitTestInfo.xValue, hitTestInfo.yValue, absoluteXCoord, absoluteYCoord, hitTestInfo, DpiHelper_1.DpiHelper.PIXEL_RATIO);
+                        var tooltipProps = (0, exports.calcTooltipProps)(index, rs, rs.rolloverModifierProps, _this.parentSurface.seriesViewRect, hitTestInfo.xValue, hitTestInfo.yValue, absoluteXCoord, absoluteYCoord, hitTestInfo, DpiHelper_1.DpiHelper.PIXEL_RATIO);
                         if (tooltipProps)
                             tooltipArray.push(tooltipProps);
                     }
@@ -516,7 +520,7 @@ var RolloverModifier = /** @class */ (function (_super) {
                     if (isVisibleY1) {
                         var absoluteXCoord = _this.isVerticalChart() ? hitTestInfo.y1Coord : hitTestInfo.xCoord;
                         var absoluteYCoord = _this.isVerticalChart() ? hitTestInfo.xCoord : hitTestInfo.y1Coord;
-                        var tooltipY1Props = exports.calcTooltipProps(index, rs, rs.rolloverModifierProps1, _this.parentSurface.seriesViewRect, hitTestInfo.xValue, hitTestInfo.y1Value, absoluteXCoord, absoluteYCoord, hitTestInfo, DpiHelper_1.DpiHelper.PIXEL_RATIO, true);
+                        var tooltipY1Props = (0, exports.calcTooltipProps)(index, rs, rs.rolloverModifierProps1, _this.parentSurface.seriesViewRect, hitTestInfo.xValue, hitTestInfo.y1Value, absoluteXCoord, absoluteYCoord, hitTestInfo, DpiHelper_1.DpiHelper.PIXEL_RATIO, true);
                         if (tooltipY1Props)
                             tooltipArray.push(tooltipY1Props);
                     }
@@ -526,7 +530,7 @@ var RolloverModifier = /** @class */ (function (_super) {
         var orderedTooltipArray = tooltipArray.sort(function (a, b) {
             return a.yCoord > b.yCoord ? 1 : b.yCoord > a.yCoord ? -1 : 0;
         });
-        var tooltipPositions = exports.calcTooltipPositions(orderedTooltipArray, this.allowTooltipOverlapping, TOOLTIP_PADDING_TOP * DpiHelper_1.DpiHelper.PIXEL_RATIO, this.parentSurface.seriesViewRect, DpiHelper_1.DpiHelper.PIXEL_RATIO);
+        var tooltipPositions = (0, exports.calcTooltipPositions)(orderedTooltipArray, this.allowTooltipOverlapping, TOOLTIP_PADDING_TOP * DpiHelper_1.DpiHelper.PIXEL_RATIO, this.parentSurface.seriesViewRect, DpiHelper_1.DpiHelper.PIXEL_RATIO);
         tooltipPositions.forEach(function (el) {
             var rs = rsList[el.index];
             var showTooltip = _this.showTooltip && el.seriesInfo.isHit;
@@ -577,7 +581,7 @@ exports.RolloverModifier = RolloverModifier;
  * @param pixelRatio
  * @param isY1
  */
-exports.calcTooltipProps = function (index, rs, rolloverProps, seriesViewRect, xValue, yValue, absoluteXCoord, absoluteYCoord, hitTestInfo, pixelRatio, isY1) {
+var calcTooltipProps = function (index, rs, rolloverProps, seriesViewRect, xValue, yValue, absoluteXCoord, absoluteYCoord, hitTestInfo, pixelRatio, isY1) {
     if (isY1 === void 0) { isY1 = false; }
     var visibleRange = rs.yAxis.visibleRange;
     var isVisible = visibleRange.min <= yValue && yValue <= visibleRange.max;
@@ -615,6 +619,7 @@ exports.calcTooltipProps = function (index, rs, rolloverProps, seriesViewRect, x
     }
     return undefined;
 };
+exports.calcTooltipProps = calcTooltipProps;
 /** @ignore */
 var spreadTooltips = function (tooltipArray, totalTooltipsHeight, startY, endY, pixelRatio) {
     var currentTotalPadding = endY - startY - totalTooltipsHeight;
@@ -633,7 +638,7 @@ var spreadTooltips = function (tooltipArray, totalTooltipsHeight, startY, endY,
  * @param seriesViewRect
  * @param pixelRatio
  */
-exports.calcTooltipPositions = function (tooltipArray, allowTooltipOverlapping, tooltipPaddingTop, seriesViewRect, pixelRatio) {
+var calcTooltipPositions = function (tooltipArray, allowTooltipOverlapping, tooltipPaddingTop, seriesViewRect, pixelRatio) {
     var length = tooltipArray.length;
     if (!allowTooltipOverlapping && length >= 2) {
         var checkHasOverlap = function () {
@@ -697,6 +702,7 @@ exports.calcTooltipPositions = function (tooltipArray, allowTooltipOverlapping,
     }
     return tooltipArray;
 };
+exports.calcTooltipPositions = calcTooltipPositions;
 /**
  * @ignore
  * @description Creates MarkerAnnotation and TooltipAnnotation and assigns to rolloverSeries properties
@@ -732,7 +738,8 @@ var createAnnotations = function (rs) {
             bandRs.rolloverModifierProps1.marker.yAxisId = bandRs.yAxisId;
         }
         if (!bandRs.rolloverModifierProps1.tooltip) {
-            bandRs.rolloverModifierProps1.tooltipTitle = (_e = (_d = bandRs.rolloverModifierProps1.tooltipTitle) !== null && _d !== void 0 ? _d : bandRs.getDataSeriesName()) !== null && _e !== void 0 ? _e : "";
+            bandRs.rolloverModifierProps1.tooltipTitle =
+                (_e = (_d = bandRs.rolloverModifierProps1.tooltipTitle) !== null && _d !== void 0 ? _d : bandRs.getDataSeriesName()) !== null && _e !== void 0 ? _e : "";
             bandRs.rolloverModifierProps1.tooltipColor = (_f = bandRs.rolloverModifierProps1.tooltipColor) !== null && _f !== void 0 ? _f : bandRs.strokeY1;
             bandRs.rolloverModifierProps1.tooltip = new RolloverTooltipSvgAnnotation_1.RolloverTooltipSvgAnnotation(bandRs.rolloverModifierProps1);
             bandRs.rolloverModifierProps1.tooltip.xAxisId = bandRs.xAxisId;

package/Charting/ChartModifiers/RubberBandXyZoomModifier.d.ts

@@ -128,7 +128,7 @@ export declare class RubberBandXyZoomModifier extends ChartModifierBase2D {
     set fill(value: string);
     toJSON(): {
         type: string;
-        options: Required<Pick<IChartModifierBaseOptions, "id" | "xAxisId" | "yAxisId" | "executeOn" | "xyDirection" | "modifierGroup">>;
+        options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
     /**
      * Performs the zoom operation on the parent Surface, using the mouse points from & to, which