scichart 3.1.348 → 3.2.0-beta

package/Charting/ChartModifiers/ChartModifierBase.d.ts

@@ -1,3 +1,4 @@
+import { DeletableEntity } from "../../Core/DeletableEntity";
 import { IDeletable } from "../../Core/IDeletable";
 import { Point } from "../../Core/Point";
 import { EExecuteOn } from "../../types/ExecuteOn";
@@ -153,7 +154,7 @@ export interface IChartModifierBase extends IThemeable, IDeletable {
  * Defines a base class to a Chart Modifier - a class which provides Zoom, Pan, Tooltip or interaction behavior
  * to SciChart - High Performance Realtime {@link https://www.scichart.com/javascript-chart-features | JavaScript Charts}
  */
-export declare abstract class ChartModifierBase<TSurfaceType extends SciChartSurfaceBase> implements IChartModifierBase {
+export declare abstract class ChartModifierBase<TSurfaceType extends SciChartSurfaceBase> extends DeletableEntity implements IChartModifierBase {
     /** @inheritDoc */
     readonly id: string;
     /** @inheritDoc */
@@ -164,7 +165,12 @@ export declare abstract class ChartModifierBase<TSurfaceType extends SciChartSur
     protected isAttachedProperty: boolean;
     protected receiveHandledEventsProperty: boolean;
     protected mousePoint: Point;
+    protected previousPoint: Point;
     protected executeOnProperty: EExecuteOn;
+    /**
+     * Stores info about active pointerdown events
+     */
+    protected activePointerEvents: Map<number, ModifierMouseArgs>;
     private parentSurfaceProperty;
     protected constructor(options?: {
         id?: string;
@@ -235,4 +241,12 @@ export declare abstract class ChartModifierBase<TSurfaceType extends SciChartSur
      * @param propertyName the property name which has changed
      */
     protected notifyPropertyChanged(propertyName: string): void;
+    protected updatePointerInfo(args: ModifierMouseArgs): void;
+    /**
+     * Checks if event conditions should trigger the modifier action
+     * @param args current event info as {@link ModifierMouseArgs}
+     *
+     * @remarks Can be used in some of the modifiers to add/override constraints
+     */
+    protected getIsActionAllowed(args: ModifierMouseArgs): boolean;
 }

package/Charting/ChartModifiers/ChartModifierBase.js

@@ -1,6 +1,22 @@
 "use strict";
+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 (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 __());
+    };
+})();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ChartModifierBase = exports.EModifierType = void 0;
+var DeletableEntity_1 = require("../../Core/DeletableEntity");
 var ExecuteOn_1 = require("../../types/ExecuteOn");
 var guid_1 = require("../../utils/guid");
 var SciChartSurfaceBase_1 = require("../Visuals/SciChartSurfaceBase");
@@ -15,13 +31,21 @@ var EModifierType;
  * Defines a base class to a Chart Modifier - a class which provides Zoom, Pan, Tooltip or interaction behavior
  * to SciChart - High Performance Realtime {@link https://www.scichart.com/javascript-chart-features | JavaScript Charts}
  */
-var ChartModifierBase = /** @class */ (function () {
+var ChartModifierBase = /** @class */ (function (_super) {
+    __extends(ChartModifierBase, _super);
     function ChartModifierBase(options) {
+        var _this = this;
         var _a, _b;
-        this.isEnabledProperty = true;
-        this.executeOnProperty = ExecuteOn_1.EExecuteOn.MouseLeftButton;
-        this.id = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : (0, guid_1.generateGuid)();
-        this.executeOnProperty = (_b = options === null || options === void 0 ? void 0 : options.executeOn) !== null && _b !== void 0 ? _b : this.executeOn;
+        _this = _super.call(this) || this;
+        _this.isEnabledProperty = true;
+        _this.executeOnProperty = ExecuteOn_1.EExecuteOn.MouseLeftButton;
+        /**
+         * Stores info about active pointerdown events
+         */
+        _this.activePointerEvents = new Map();
+        _this.id = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : (0, guid_1.generateGuid)();
+        _this.executeOnProperty = (_b = options === null || options === void 0 ? void 0 : options.executeOn) !== null && _b !== void 0 ? _b : _this.executeOn;
+        return _this;
     }
     /** @inheritDoc */
     ChartModifierBase.prototype.applyTheme = function (themeProvider) {
@@ -125,14 +149,22 @@ var ChartModifierBase = /** @class */ (function () {
             // Don't scroll browser if middle button is being used for the modifier
             args.nativeEvent.preventDefault();
         }
+        var isTouchEvent = args.pointerType === "touch" || args.pointerType === "pen";
+        if (isTouchEvent) {
+            this.activePointerEvents.set(args.pointerId, args);
+        }
     };
     /** @inheritDoc */
     ChartModifierBase.prototype.modifierMouseMove = function (args) {
-        this.mousePoint = args.mousePoint;
+        this.updatePointerInfo(args);
         // Override in derived class to be notified of mouse move
     };
     /** @inheritDoc */
     ChartModifierBase.prototype.modifierMouseUp = function (args) {
+        var isTouchEvent = args.pointerType === "touch" || args.pointerType === "pen";
+        if (isTouchEvent) {
+            this.activePointerEvents.delete(args.pointerId);
+        }
         // Override in derived class to be notified of mouse up
     };
     /** @inheritDoc */
@@ -149,6 +181,7 @@ var ChartModifierBase = /** @class */ (function () {
     };
     /** @inheritDoc */
     ChartModifierBase.prototype.modifierMouseLeave = function (args) {
+        this.activePointerEvents.delete(args.pointerId);
         // Override in derived class to be notified of mouse leave
     };
     /** @inheritDoc */
@@ -157,6 +190,7 @@ var ChartModifierBase = /** @class */ (function () {
     };
     /** @inheritDoc */
     ChartModifierBase.prototype.modifierPointerCancel = function (args) {
+        this.activePointerEvents.delete(args.pointerId);
         // Override in derived class to be notified of mouse leave
     };
     /** @inheritDoc */
@@ -191,6 +225,30 @@ var ChartModifierBase = /** @class */ (function () {
             this.invalidateParentCallback();
         }
     };
+    ChartModifierBase.prototype.updatePointerInfo = function (args) {
+        var _a;
+        // store position of primary pointer
+        // (PointerEvent.isPrimary seems to not be set on secondary pointer after the primary pointer was released,
+        // so here we are checking order of entry insertion instead)
+        if (this.activePointerEvents.keys().next().value === args.pointerId) {
+            this.mousePoint = args.mousePoint;
+        }
+        // get previous coordinates of the current pointer
+        this.previousPoint = (_a = this.activePointerEvents.get(args.pointerId)) === null || _a === void 0 ? void 0 : _a.mousePoint;
+        // update saved pointer coordinates
+        if (this.activePointerEvents.has(args.pointerId)) {
+            this.activePointerEvents.set(args.pointerId, args);
+        }
+    };
+    /**
+     * Checks if event conditions should trigger the modifier action
+     * @param args current event info as {@link ModifierMouseArgs}
+     *
+     * @remarks Can be used in some of the modifiers to add/override constraints
+     */
+    ChartModifierBase.prototype.getIsActionAllowed = function (args) {
+        return true;
+    };
     return ChartModifierBase;
-}());
+}(DeletableEntity_1.DeletableEntity));
 exports.ChartModifierBase = ChartModifierBase;

package/Charting/ChartModifiers/CursorModifier.js

@@ -251,6 +251,7 @@ var CursorModifier = /** @class */ (function (_super) {
      * @inheritDoc
      */
     CursorModifier.prototype.modifierMouseMove = function (args) {
+        this.activePointerEvents.set(args.pointerId, args);
         _super.prototype.modifierMouseMove.call(this, args);
         var translatedMousePoint;
         if (!this.mousePoint) {
@@ -265,7 +266,10 @@ var CursorModifier = /** @class */ (function (_super) {
                 this.mousePosition = MousePosition_1.EMousePosition.SeriesArea;
             }
         }
-        this.update();
+        var isActionAllowed = this.getIsActionAllowed(args);
+        if (isActionAllowed) {
+            this.update();
+        }
     };
     /**
      * @inheritDoc
@@ -534,6 +538,7 @@ var CursorModifier = /** @class */ (function (_super) {
                 this.yLineAnnotation.isHidden = true;
             }
             this.tooltipAnnotation.isHidden = true;
+            this.tooltipAnnotation.seriesInfos = undefined;
             if (this.placementDivId) {
                 this.tooltipAnnotation.delete();
             }
@@ -654,6 +659,13 @@ var defaultTooltipDataTemplate = function (seriesInfos, tooltipTitle) {
                 valuesWithLabels.push("Y: ".concat(xyySeriesInfo.formattedYValue));
                 valuesWithLabels.push("Y1: ".concat(xyySeriesInfo.formattedY1Value));
             }
+            else if (si.dataSeriesType === IDataSeries_1.EDataSeriesType.Xyz) {
+                // Bubble Series
+                var xyzSeriesInfo = si;
+                valuesWithLabels.push("X: ".concat(xyzSeriesInfo.formattedXValue));
+                valuesWithLabels.push("Y: ".concat(xyzSeriesInfo.formattedYValue));
+                valuesWithLabels.push("Z: ".concat(xyzSeriesInfo.formattedZValue));
+            }
             else if (si.dataSeriesType === IDataSeries_1.EDataSeriesType.HeatmapUniform) {
                 // Heatmap Series
                 var heatmapSeriesInfo = si;

package/Charting/ChartModifiers/LegendModifier.d.ts

@@ -105,7 +105,7 @@ export declare class LegendModifier extends ChartModifierBase2D implements IIncl
     getIncludedRenderableSeries(): IRenderableSeries[];
     /** @inheritDoc */
     toJSON(): {
-        type: string; /** @inheritDoc */
+        type: string;
         options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
     /** @inheritDoc */

package/Charting/ChartModifiers/LegendModifier.js

@@ -16,6 +16,7 @@ var __extends = (this && this.__extends) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.LegendModifier = void 0;
+var Deleter_1 = require("../../Core/Deleter");
 var EventHandler_1 = require("../../Core/EventHandler");
 var ChartModifierType_1 = require("../../types/ChartModifierType");
 var SciChartLegend_1 = require("../Visuals/Legend/SciChartLegend");
@@ -98,12 +99,13 @@ var LegendModifier = /** @class */ (function (_super) {
     };
     /** @inheritDoc */
     LegendModifier.prototype.onDetach = function () {
+        var _a, _b, _c, _d;
         _super.prototype.onDetach.call(this);
-        this.sciChartLegend.delete();
-        this.sciChartLegend.setRootDiv(undefined);
-        this.sciChartLegend.setRenderableSeriesArray([]);
-        this.sciChartLegend.setInvalidateParentSurface(undefined);
-        this.sciChartLegend.setParentSurface(undefined);
+        (_a = this.sciChartLegend) === null || _a === void 0 ? void 0 : _a.setRootDiv(undefined);
+        (_b = this.sciChartLegend) === null || _b === void 0 ? void 0 : _b.setRenderableSeriesArray([]);
+        (_c = this.sciChartLegend) === null || _c === void 0 ? void 0 : _c.setInvalidateParentSurface(undefined);
+        (_d = this.sciChartLegend) === null || _d === void 0 ? void 0 : _d.setParentSurface(undefined);
+        this.sciChartLegend = (0, Deleter_1.deleteSafe)(this.sciChartLegend);
     };
     /** @inheritDoc */
     LegendModifier.prototype.includeSeries = function (series, isIncluded) {
@@ -152,7 +154,7 @@ var LegendModifier = /** @class */ (function (_super) {
     /** @inheritDoc */
     LegendModifier.prototype.delete = function () {
         _super.prototype.delete.call(this);
-        this.sciChartLegend.delete();
+        this.onDetach();
     };
     /**
      * Callback called from inner {@link SciChartLegend} when a checkbox is checked or unchecked

package/Charting/ChartModifiers/PinchZoomModifier.d.ts

@@ -1,5 +1,6 @@
 import { Point } from "../../Core/Point";
 import { EChart2DModifierType } from "../../types/ChartModifierType";
+import { AxisBase2D } from "../Visuals/Axis/AxisBase2D";
 import { ChartModifierBase2D, IChartModifierBaseOptions } from "./ChartModifierBase2D";
 import { ModifierMouseArgs } from "./ModifierMouseArgs";
 /**
@@ -14,6 +15,26 @@ export interface IPinchZoomModifierOptions extends IChartModifierBaseOptions {
      * Defines the sensitivity of zooming in vertical direction
      */
     verticalGrowFactor?: number;
+    /**
+     * A list of Ids for X axis to exclude from this modifier
+     * @remarks Also see {@link ZoomPanModifier.includeXAxis} function which allows you to include or exclude an axis by instance
+     */
+    excludedXAxisIds?: string[];
+    /**
+     * A list of Ids for Y axis to exclude from this modifier
+     * @remarks Also see {@link ZoomPanModifier.includeYAxis} function which allows you to include or exclude an axis by instance
+     */
+    excludedYAxisIds?: string[];
+    /**
+     * A list of Ids for X axis to include to this modifier
+     * @remarks Also see {@link ZoomPanModifier.includeXAxis} function which allows you to include or exclude an axis by instance
+     */
+    includedXAxisIds?: string[];
+    /**
+     * A list of Ids for Y axis to include this modifier
+     * @remarks Also see {@link ZoomPanModifier.includeYAxis} function which allows you to include or exclude an axis by instance
+     */
+    includedYAxisIds?: string[];
 }
 /**
  * The PinchZoomModifier provides ability to zoom by pinch gesture on a 2D {@link SciChartSurface}
@@ -31,7 +52,7 @@ export interface IPinchZoomModifierOptions extends IChartModifierBaseOptions {
  * It is also necessary to set “touch-action: none” on the chart div element.
  */
 export declare class PinchZoomModifier extends ChartModifierBase2D {
-    readonly type = EChart2DModifierType.PinchZoom;
+    readonly type: EChart2DModifierType;
     /**
      * Defines the sensitivity of zooming in horizontal direction
      */
@@ -40,10 +61,8 @@ export declare class PinchZoomModifier extends ChartModifierBase2D {
      * Defines the sensitivity of zooming in vertical direction
      */
     verticalGrowFactor: number;
-    /**
-     * Stores info about active pointerdown events
-     */
-    private activeTouchEvents;
+    protected includedXAxisMap: Map<string, boolean>;
+    protected includedYAxisMap: Map<string, boolean>;
     /**
      * touch points X coordinates difference
      */
@@ -77,19 +96,30 @@ export declare class PinchZoomModifier extends ChartModifierBase2D {
         type: string;
         options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
+    /** @inheritDoc */
+    includeXAxis(axis: AxisBase2D, isIncluded: boolean): void;
+    /** @inheritDoc */
+    includeYAxis(axis: AxisBase2D, isIncluded: boolean): void;
+    /** @inheritDoc */
+    includeAllAxes(): void;
+    /** @inheritDoc */
+    getIncludedXAxis(): AxisBase2D[];
+    /** @inheritDoc */
+    getIncludedYAxis(): AxisBase2D[];
     /**
      * Performs the zoom operation around the mouse point
      * @param mousePoint The X,Y location of the mouse at the time of the zoom
      * @param horizontalPinchDelta horizontal pinch delta
      * @param verticalPinchDelta vertical pinch delta
      */
-    protected performZoom(mousePoint: Point, horizontalPinchDelta: number, verticalPinchDelta: number): void;
-    protected notifyPropertyChanged(propertyName: string): void;
+    protected performZoom(mousePoint: Point, horizontalPinchDelta: number, verticalPinchDelta: number, horizontalGrowFactor: number, verticalGrowFactor: number): void;
     /**
      * Handles pointer event becoming inactive
      * @param args pointer event properties
      */
-    private removeFromActiveTouchEvents;
+    protected removeFromActiveTouchEvents(args: ModifierMouseArgs): void;
+    protected performModifierAction(args: ModifierMouseArgs): void;
+    protected getIsActionAllowed(args: ModifierMouseArgs): boolean;
     /**
      * returns a point equidistant to the provided ones
      * @param firstPoint the X,Y location of the first active pointer

package/Charting/ChartModifiers/PinchZoomModifier.js

@@ -20,6 +20,7 @@ var Point_1 = require("../../Core/Point");
 var ChartModifierType_1 = require("../../types/ChartModifierType");
 var XyDirection_1 = require("../../types/XyDirection");
 var ZoomState_1 = require("../../types/ZoomState");
+var includedAxis_1 = require("../../utils/includedAxis");
 var translate_1 = require("../../utils/translate");
 var ChartModifierBase2D_1 = require("./ChartModifierBase2D");
 /**
@@ -45,9 +46,8 @@ var PinchZoomModifier = /** @class */ (function (_super) {
      */
     function PinchZoomModifier(options) {
         var _this = this;
-        var _a, _b;
+        var _a, _b, _c, _d, _e, _f;
         _this = _super.call(this, options) || this;
-        _this.type = ChartModifierType_1.EChart2DModifierType.PinchZoom;
         /**
          * Defines the sensitivity of zooming in horizontal direction
          */
@@ -56,10 +56,8 @@ var PinchZoomModifier = /** @class */ (function (_super) {
          * Defines the sensitivity of zooming in vertical direction
          */
         _this.verticalGrowFactor = 0.005;
-        /**
-         * Stores info about active pointerdown events
-         */
-        _this.activeTouchEvents = new Map();
+        _this.includedXAxisMap = new Map();
+        _this.includedYAxisMap = new Map();
         /**
          * returns a point equidistant to the provided ones
          * @param firstPoint the X,Y location of the first active pointer
@@ -68,8 +66,27 @@ var PinchZoomModifier = /** @class */ (function (_super) {
         _this.getMiddlePoint = function (firstPoint, secondPoint) {
             return new Point_1.Point((firstPoint.x + secondPoint.x) / 2, (firstPoint.y + secondPoint.y) / 2);
         };
-        _this.horizontalGrowFactor = (_a = options === null || options === void 0 ? void 0 : options.horizontalGrowFactor) !== null && _a !== void 0 ? _a : _this.horizontalGrowFactor;
-        _this.verticalGrowFactor = (_b = options === null || options === void 0 ? void 0 : options.verticalGrowFactor) !== null && _b !== void 0 ? _b : _this.verticalGrowFactor;
+        _this.type = ChartModifierType_1.EChart2DModifierType.PinchZoom;
+        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");
+        }
+        (_a = options === null || options === void 0 ? void 0 : options.includedXAxisIds) === null || _a === void 0 ? void 0 : _a.forEach(function (id) {
+            _this.includedXAxisMap.set(id, true);
+        });
+        (_b = options === null || options === void 0 ? void 0 : options.includedYAxisIds) === null || _b === void 0 ? void 0 : _b.forEach(function (id) {
+            _this.includedYAxisMap.set(id, true);
+        });
+        (_c = options === null || options === void 0 ? void 0 : options.excludedXAxisIds) === null || _c === void 0 ? void 0 : _c.forEach(function (id) {
+            _this.includedXAxisMap.set(id, false);
+        });
+        (_d = options === null || options === void 0 ? void 0 : options.excludedYAxisIds) === null || _d === void 0 ? void 0 : _d.forEach(function (id) {
+            _this.includedYAxisMap.set(id, false);
+        });
+        _this.horizontalGrowFactor = (_e = options === null || options === void 0 ? void 0 : options.horizontalGrowFactor) !== null && _e !== void 0 ? _e : _this.horizontalGrowFactor;
+        _this.verticalGrowFactor = (_f = options === null || options === void 0 ? void 0 : options.verticalGrowFactor) !== null && _f !== void 0 ? _f : _this.verticalGrowFactor;
         return _this;
     }
     /**
@@ -80,34 +97,24 @@ var PinchZoomModifier = /** @class */ (function (_super) {
         if (!this.isAttached) {
             throw new Error("Should not call PinchZoomModifier.modifierMouseDown if not attached");
         }
-        this.activeTouchEvents.set(args.pointerId, args);
-        args.handled = true;
+        var translatedPoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(args.mousePoint, this.parentSurface.seriesViewRect);
+        if (!translatedPoint) {
+            return;
+        }
+        var isTouchEvent = args.pointerType === "touch" || args.pointerType === "pen";
+        if (isTouchEvent) {
+            this.activePointerEvents.set(args.pointerId, args);
+        }
     };
     /**
      * @inheritDoc
      */
     PinchZoomModifier.prototype.modifierMouseMove = function (args) {
         _super.prototype.modifierMouseMove.call(this, args);
-        this.activeTouchEvents.set(args.pointerId, args);
-        // check for pinch gestures if there are multiple active pointers
-        if (this.activeTouchEvents.size >= 2) {
-            var _a = Array.from(this.activeTouchEvents.values()), firstTouchPoint = _a[0].mousePoint, secondTouchPoint = _a[1].mousePoint;
-            // Calculate projections of distance between the touch points
-            var currentHorizontalTouchPointsDistance = Math.abs(firstTouchPoint.x - secondTouchPoint.x);
-            var currentVerticalTouchPointsDistance = Math.abs(firstTouchPoint.y - secondTouchPoint.y);
+        var isActionAllowed = this.getIsActionAllowed(args);
+        if (isActionAllowed) {
             this.parentSurface.setZoomState(ZoomState_1.EZoomState.UserZooming);
-            var zoomCenterMousePoint = this.getMiddlePoint(firstTouchPoint, secondTouchPoint);
-            var zoomPoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(zoomCenterMousePoint, this.parentSurface.seriesViewRect);
-            if (zoomPoint &&
-                this.previousHorizontalTouchPointsDistance !== undefined &&
-                this.previousVerticalTouchPointsDistance !== undefined) {
-                var horizontalDistanceDiff = this.previousHorizontalTouchPointsDistance - currentHorizontalTouchPointsDistance;
-                var verticalDistanceDiff = this.previousVerticalTouchPointsDistance - currentVerticalTouchPointsDistance;
-                this.performZoom(zoomPoint, horizontalDistanceDiff, verticalDistanceDiff);
-            }
-            // Cache the distance for the next move event
-            this.previousHorizontalTouchPointsDistance = currentHorizontalTouchPointsDistance;
-            this.previousVerticalTouchPointsDistance = currentVerticalTouchPointsDistance;
+            this.performModifierAction(args);
         }
     };
     /**
@@ -128,48 +135,104 @@ var PinchZoomModifier = /** @class */ (function (_super) {
         var json = _super.prototype.toJSON.call(this);
         var options = {
             horizontalGrowFactor: this.horizontalGrowFactor,
-            verticalGrowFactor: this.verticalGrowFactor
+            verticalGrowFactor: this.verticalGrowFactor,
+            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;
     };
+    /** @inheritDoc */
+    PinchZoomModifier.prototype.includeXAxis = function (axis, isIncluded) {
+        this.includedXAxisMap.set(axis.id, isIncluded);
+    };
+    /** @inheritDoc */
+    PinchZoomModifier.prototype.includeYAxis = function (axis, isIncluded) {
+        this.includedYAxisMap.set(axis.id, isIncluded);
+    };
+    /** @inheritDoc */
+    PinchZoomModifier.prototype.includeAllAxes = function () {
+        this.includedXAxisMap.clear();
+    };
+    /** @inheritDoc */
+    PinchZoomModifier.prototype.getIncludedXAxis = function () {
+        return (0, includedAxis_1.getIncludedAxis)(this.parentSurface.xAxes.asArray(), this.includedXAxisMap);
+    };
+    /** @inheritDoc */
+    PinchZoomModifier.prototype.getIncludedYAxis = function () {
+        return (0, includedAxis_1.getIncludedAxis)(this.parentSurface.yAxes.asArray(), this.includedYAxisMap);
+    };
     /**
      * Performs the zoom operation around the mouse point
      * @param mousePoint The X,Y location of the mouse at the time of the zoom
      * @param horizontalPinchDelta horizontal pinch delta
      * @param verticalPinchDelta vertical pinch delta
      */
-    PinchZoomModifier.prototype.performZoom = function (mousePoint, horizontalPinchDelta, verticalPinchDelta) {
+    PinchZoomModifier.prototype.performZoom = function (mousePoint, horizontalPinchDelta, verticalPinchDelta, horizontalGrowFactor, verticalGrowFactor) {
         var _this = this;
-        var horizontalFraction = this.horizontalGrowFactor * horizontalPinchDelta;
-        var verticalFraction = this.verticalGrowFactor * verticalPinchDelta;
+        var horizontalFraction = horizontalGrowFactor * horizontalPinchDelta;
+        var verticalFraction = verticalGrowFactor * verticalPinchDelta;
         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, horizontalFraction);
             });
         }
         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, verticalFraction);
             });
         }
     };
-    PinchZoomModifier.prototype.notifyPropertyChanged = function (propertyName) {
-        _super.prototype.notifyPropertyChanged.call(this, propertyName);
-    };
     /**
      * Handles pointer event becoming inactive
      * @param args pointer event properties
      */
     PinchZoomModifier.prototype.removeFromActiveTouchEvents = function (args) {
         // Remove this event from the target's cache
-        this.activeTouchEvents.delete(args.pointerId);
+        this.activePointerEvents.delete(args.pointerId);
         // reset distance values
-        if (this.activeTouchEvents.size < 2) {
+        if (this.activePointerEvents.size < 2) {
             this.previousHorizontalTouchPointsDistance = undefined;
             this.previousVerticalTouchPointsDistance = undefined;
         }
     };
+    PinchZoomModifier.prototype.performModifierAction = function (args) {
+        var _a = Array.from(this.activePointerEvents.values()), firstTouchPoint = _a[0].mousePoint, secondTouchPoint = _a[1].mousePoint;
+        // Calculate projections of distance between the touch points
+        var currentHorizontalTouchPointsDistance = Math.abs(firstTouchPoint.x - secondTouchPoint.x);
+        var currentVerticalTouchPointsDistance = Math.abs(firstTouchPoint.y - secondTouchPoint.y);
+        var zoomCenterMousePoint = this.getMiddlePoint(firstTouchPoint, secondTouchPoint);
+        var zoomPoint = (0, translate_1.translateFromCanvasToSeriesViewRect)(zoomCenterMousePoint, this.parentSurface.seriesViewRect);
+        if (zoomPoint &&
+            this.previousHorizontalTouchPointsDistance !== undefined &&
+            this.previousVerticalTouchPointsDistance !== undefined) {
+            var horizontalDistanceDiff = this.previousHorizontalTouchPointsDistance - currentHorizontalTouchPointsDistance;
+            var verticalDistanceDiff = this.previousVerticalTouchPointsDistance - currentVerticalTouchPointsDistance;
+            // TODO add limits in distance between pointers
+            // const minHorizontalDiff = 10;
+            // if (horizontalDistanceDiff > minHorizontalDiff && verticalDistanceDiff > minHorizontalDiff) {
+            // }
+            this.performZoom(zoomPoint, horizontalDistanceDiff, verticalDistanceDiff, this.horizontalGrowFactor, this.verticalGrowFactor);
+        }
+        // Cache the distance for the next move event
+        this.previousHorizontalTouchPointsDistance = currentHorizontalTouchPointsDistance;
+        this.previousVerticalTouchPointsDistance = currentVerticalTouchPointsDistance;
+    };
+    PinchZoomModifier.prototype.getIsActionAllowed = function (args) {
+        var isTouchEvent = args.pointerType === "touch" || args.pointerType === "pen";
+        // check for pinch gestures if there are multiple active touches
+        return isTouchEvent && this.activePointerEvents.size >= 2;
+    };
     return PinchZoomModifier;
 }(ChartModifierBase2D_1.ChartModifierBase2D));
 exports.PinchZoomModifier = PinchZoomModifier;

package/Charting/ChartModifiers/RolloverModifier.js

@@ -270,6 +270,7 @@ var RolloverModifier = /** @class */ (function (_super) {
      * @inheritDoc
      */
     RolloverModifier.prototype.modifierMouseMove = function (args) {
+        this.activePointerEvents.set(args.pointerId, args);
         _super.prototype.modifierMouseMove.call(this, args);
         var translatedMousePoint;
         if (!this.mousePoint) {
@@ -284,7 +285,10 @@ var RolloverModifier = /** @class */ (function (_super) {
                 this.mousePosition = MousePosition_1.EMousePosition.SeriesArea;
             }
         }
-        this.update();
+        var isActionAllowed = this.getIsActionAllowed(args);
+        if (isActionAllowed) {
+            this.update();
+        }
     };
     /**
      * @inheritDoc
@@ -559,11 +563,14 @@ var RolloverModifier = /** @class */ (function (_super) {
             return;
         }
         var tooltipArray = [];
+        var height = this.isVerticalChart()
+            ? this.parentSurface.seriesViewRect.width
+            : this.parentSurface.seriesViewRect.height;
         rsList.forEach(function (rs, index) {
             var hitTestInfo = _this.hitTestRenderableSeries(rs, _this.mousePoint);
             if (hitTestInfo) {
                 if (rs.type !== SeriesType_1.ESeriesType.StackedColumnSeries || hitTestInfo.isHit) {
-                    var isVisible = 0 <= hitTestInfo.yCoord && hitTestInfo.yCoord <= _this.parentSurface.seriesViewRect.height;
+                    var isVisible = 0 <= hitTestInfo.yCoord && hitTestInfo.yCoord <= height;
                     if (isVisible) {
                         var absoluteXCoord = _this.isVerticalChart() ? hitTestInfo.yCoord : hitTestInfo.xCoord;
                         var absoluteYCoord = _this.isVerticalChart() ? hitTestInfo.xCoord : hitTestInfo.yCoord;
@@ -573,7 +580,7 @@ var RolloverModifier = /** @class */ (function (_super) {
                     }
                 }
                 if (rs.type === SeriesType_1.ESeriesType.BandSeries) {
-                    var isVisibleY1 = 0 <= hitTestInfo.y1Coord && hitTestInfo.y1Coord <= _this.parentSurface.seriesViewRect.height;
+                    var isVisibleY1 = 0 <= hitTestInfo.y1Coord && hitTestInfo.y1Coord <= height;
                     if (isVisibleY1) {
                         var absoluteXCoord = _this.isVerticalChart() ? hitTestInfo.y1Coord : hitTestInfo.xCoord;
                         var absoluteYCoord = _this.isVerticalChart() ? hitTestInfo.xCoord : hitTestInfo.y1Coord;

package/Charting/ChartModifiers/RubberBandXyZoomModifier.d.ts

@@ -68,7 +68,7 @@ export declare class RubberBandXyZoomModifier extends ChartModifierBase2D {
      * Defines the easing function for animation. See {@link TEasingFn} for a range of functions
      */
     easingFunction: TEasingFn;
-    protected rubberBandRect: RubberBandSvgRect;
+    rubberBandRect: RubberBandSvgRect;
     protected pointFrom: Point;
     protected pointTo: Point;
     protected isClicked: boolean;