scichart 3.0.266 → 3.0.280

package/Charting/ChartModifiers/ChartModifierBase2D.js

@@ -119,11 +119,10 @@ var ChartModifierBase2D = /** @class */ (function (_super) {
      */
     ChartModifierBase2D.prototype.growBy = function (mousePoint, axis, fraction) {
         var isHorizontalAxis = axis.isHorizontalAxis, isAxisFlipped = axis.isAxisFlipped, viewRect = axis.viewRect, flippedCoordinates = axis.flippedCoordinates;
+        var seriesViewRect = this.parentSurface.seriesViewRect;
         var size = isHorizontalAxis ? viewRect.width : viewRect.height;
         if (axis.isStackedAxis && this.parentSurface) {
-            size = isHorizontalAxis
-                ? this.parentSurface.seriesViewRect.width
-                : this.parentSurface.seriesViewRect.height;
+            size = isHorizontalAxis ? seriesViewRect.width : seriesViewRect.height;
         }
         var coord = isHorizontalAxis ? mousePoint.x : mousePoint.y;
         // Compute relative fractions to expand or contract the axis VisibleRange by

package/Charting/ChartModifiers/CursorModifier.d.ts

@@ -120,10 +120,6 @@ export declare class CursorModifier extends ChartModifierBase2D implements IIncl
      * Gets or sets whether we should display the tooltip. Default is false
      */
     showTooltip: boolean;
-    /**
-     * Gets or sets whether we should display axis labels. Default is true
-     */
-    showAxisLabels: boolean;
     /**
      * Gets or sets both axis label text color as an HTML Color code
      */
@@ -160,14 +156,6 @@ export declare class CursorModifier extends ChartModifierBase2D implements IIncl
      * Gets or sets the legend Y offset
      */
     tooltipLegendOffsetY: number;
-    /**
-     * Gets or sets whether we should display the X Line. Default is true
-     */
-    showXLine: boolean;
-    /**
-     * Gets or sets whether we should display the Y Line. Default is true
-     */
-    showYLine: boolean;
     /**
      * If this is set greater than the default of zero, the toolip will only show values for points in this radius, rather than all points on the vertical line
      */
@@ -180,6 +168,9 @@ export declare class CursorModifier extends ChartModifierBase2D implements IIncl
     protected tooltipDataTemplateProperty?: TCursorTooltipDataTemplate;
     protected includedSeriesMap: Map<IRenderableSeries, boolean>;
     protected placementDivIdProperty: string;
+    protected showXLineProperty: boolean;
+    protected showYLineProperty: boolean;
+    protected showAxisLabelsProperty: boolean;
     /**
      * Creates an instance of the CursorModifier
      *
@@ -232,6 +223,30 @@ export declare class CursorModifier extends ChartModifierBase2D implements IIncl
      * Gets or sets the crosshair line Stroke color as an HTML Color code
      */
     set crosshairStroke(value: string);
+    /**
+     *  Gets or sets whether we should display the X Line. Default is true
+     */
+    get showXLine(): boolean;
+    /**
+     *  Gets or sets whether we should display the X Line. Default is true
+     */
+    set showXLine(value: boolean);
+    /**
+     *  Gets or sets whether we should display the Y Line. Default is true
+     */
+    get showYLine(): boolean;
+    /**
+     *  Gets or sets whether we should display the Y Line. Default is true
+     */
+    set showYLine(value: boolean);
+    /**
+     *  Gets or sets whether we should display the Axis Labels. Default is true
+     */
+    get showAxisLabels(): boolean;
+    /**
+     *  Gets or sets whether we should display the Axis Labels. Default is true
+     */
+    set showAxisLabels(value: boolean);
     /**
      * Gets or sets the parent div element reference or id for the Tooltip
      */

package/Charting/ChartModifiers/CursorModifier.js

@@ -17,6 +17,7 @@ var __extends = (this && this.__extends) || (function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.adjustTooltipPosition = exports.calcTooltipSize = exports.CursorModifier = void 0;
 var classFactory_1 = require("../../Builder/classFactory");
+var Deleter_1 = require("../../Core/Deleter");
 var BaseType_1 = require("../../types/BaseType");
 var ChartModifierType_1 = require("../../types/ChartModifierType");
 var MousePosition_1 = require("../../types/MousePosition");
@@ -86,10 +87,6 @@ var CursorModifier = /** @class */ (function (_super) {
          * Gets or sets whether we should display the tooltip. Default is false
          */
         _this.showTooltip = false;
-        /**
-         * Gets or sets whether we should display axis labels. Default is true
-         */
-        _this.showAxisLabels = true;
         /**
          * Gets or sets both axis label text color as an HTML Color code
          */
@@ -122,14 +119,6 @@ var CursorModifier = /** @class */ (function (_super) {
          * Gets or sets the legend Y offset
          */
         _this.tooltipLegendOffsetY = 0;
-        /**
-         * Gets or sets whether we should display the X Line. Default is true
-         */
-        _this.showXLine = true;
-        /**
-         * Gets or sets whether we should display the Y Line. Default is true
-         */
-        _this.showYLine = true;
         /**
          * If this is set greater than the default of zero, the toolip will only show values for points in this radius, rather than all points on the vertical line
          */
@@ -137,6 +126,9 @@ var CursorModifier = /** @class */ (function (_super) {
         _this.mousePosition = MousePosition_1.EMousePosition.OutOfCanvas;
         _this.crosshairStrokeProperty = SciChartSurfaceBase_1.SciChartSurfaceBase.DEFAULT_THEME.cursorLineBrush;
         _this.includedSeriesMap = new Map();
+        _this.showXLineProperty = true;
+        _this.showYLineProperty = true;
+        _this.showAxisLabelsProperty = true;
         if (options === null || options === void 0 ? void 0 : options.tooltipSvgTemplate) {
             if (typeof options.tooltipSvgTemplate === "string") {
                 _this.typeMap.set("tooltipSvgTemplate", options.tooltipSvgTemplate);
@@ -312,6 +304,89 @@ var CursorModifier = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(CursorModifier.prototype, "showXLine", {
+        /**
+         *  Gets or sets whether we should display the X Line. Default is true
+         */
+        get: function () {
+            return this.showXLineProperty;
+        },
+        /**
+         *  Gets or sets whether we should display the X Line. Default is true
+         */
+        set: function (value) {
+            if (this.showXLineProperty !== value) {
+                this.showXLineProperty = value;
+                if (this.showXLineProperty && !this.xLineAnnotation) {
+                    var xAxisLabelFill = this.xAxisLabelFill ? this.xAxisLabelFill : this.axisLabelFill;
+                    var xAxisLabelStroke = this.xAxisLabelStroke ? this.xAxisLabelStroke : this.axisLabelStroke;
+                    this.xLineAnnotation = this.newLineAnnotation(xAxisLabelFill, xAxisLabelStroke);
+                    this.parentSurface.modifierAnnotations.add(this.xLineAnnotation);
+                }
+                else if (!this.showXLineProperty && this.xLineAnnotation) {
+                    this.parentSurface.modifierAnnotations.remove(this.xLineAnnotation);
+                    this.xLineAnnotation = (0, Deleter_1.deleteSafe)(this.xLineAnnotation);
+                }
+                this.notifyPropertyChanged(constants_1.PROPERTY.X_LINE);
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(CursorModifier.prototype, "showYLine", {
+        /**
+         *  Gets or sets whether we should display the Y Line. Default is true
+         */
+        get: function () {
+            return this.showYLineProperty;
+        },
+        /**
+         *  Gets or sets whether we should display the Y Line. Default is true
+         */
+        set: function (value) {
+            if (this.showYLineProperty !== value) {
+                this.showYLineProperty = value;
+                if (this.showYLineProperty && !this.yLineAnnotation) {
+                    var yAxisLabelFill = this.yAxisLabelFill ? this.yAxisLabelFill : this.axisLabelFill;
+                    var yAxisLabelStroke = this.yAxisLabelStroke ? this.yAxisLabelStroke : this.axisLabelStroke;
+                    this.yLineAnnotation = this.newLineAnnotation(yAxisLabelFill, yAxisLabelStroke);
+                    this.parentSurface.modifierAnnotations.add(this.yLineAnnotation);
+                }
+                else if (!this.showYLineProperty && this.yLineAnnotation) {
+                    this.parentSurface.modifierAnnotations.remove(this.yLineAnnotation);
+                    this.yLineAnnotation = (0, Deleter_1.deleteSafe)(this.yLineAnnotation);
+                }
+                this.notifyPropertyChanged(constants_1.PROPERTY.Y_LINE);
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(CursorModifier.prototype, "showAxisLabels", {
+        /**
+         *  Gets or sets whether we should display the Axis Labels. Default is true
+         */
+        get: function () {
+            return this.showAxisLabelsProperty;
+        },
+        /**
+         *  Gets or sets whether we should display the Axis Labels. Default is true
+         */
+        set: function (value) {
+            if (this.showAxisLabelsProperty !== value) {
+                this.showAxisLabelsProperty = value;
+                if (this.xLineAnnotation) {
+                    this.xLineAnnotation.showLabel = this.showAxisLabelsProperty;
+                }
+                if (this.yLineAnnotation) {
+                    this.yLineAnnotation.showLabel = this.showAxisLabelsProperty;
+                }
+                this.notifyPropertyChanged(constants_1.PROPERTY.AXIS_LABELS);
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(CursorModifier.prototype, "placementDivId", {
         /**
          * Gets or sets the parent div element reference or id for the Tooltip

package/Charting/ChartModifiers/XAxisDragModifier.d.ts

@@ -1,3 +1,6 @@
+import { NumberRange } from "../../Core/NumberRange";
+import { Point } from "../../Core/Point";
+import { ECursorStyle } from "../../types/CursorStyle";
 import { EDragMode } from "../../types/DragMode";
 import { AxisBase2D } from "../Visuals/Axis/AxisBase2D";
 import { ChartModifierBase2D, IChartModifierBaseOptions } from "./ChartModifierBase2D";
@@ -31,12 +34,12 @@ export declare class XAxisDragModifier extends ChartModifierBase2D {
     readonly type = EChart2DModifierType.XAxisDrag;
     dragMode: EDragMode;
     protected isClickedOverXAxis: boolean;
-    private pointFrom;
-    private activeAxes;
-    private initialVisibleRanges;
-    private isVerticalChart;
-    private cursorStyle;
-    private includedSeriesMapProperty;
+    protected pointFrom: Point;
+    protected activeAxes: AxisBase2D[];
+    protected initialVisibleRanges: NumberRange[];
+    protected isVerticalChart: boolean;
+    protected cursorStyle: ECursorStyle;
+    protected includedSeriesMapProperty: Map<string, boolean>;
     /**
      * Creates an instance of a XAxisDragModifier
      * @param options optional parameters to pass to the XAxisDragModifier to configure it upon construction
@@ -71,10 +74,10 @@ export declare class XAxisDragModifier extends ChartModifierBase2D {
         type: string;
         options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
-    private updateCursor;
-    private doPanning;
-    private doScaling;
-    private getHorizontalXAxes;
-    private getVerticalXAxes;
-    private startDragging;
+    protected updateCursor(mousePoint: Point): void;
+    protected doPanning(mousePoint: Point): void;
+    protected doScaling(pointTo: Point): void;
+    protected getHorizontalXAxes(): AxisBase2D[];
+    protected getVerticalXAxes(): AxisBase2D[];
+    protected startDragging(axes: AxisBase2D[], args: ModifierMouseArgs): void;
 }

package/Charting/ChartModifiers/YAxisDragModifier.d.ts

@@ -1,5 +1,8 @@
 import { IIncludeAxis } from "../../Core/IIncludeAxis";
+import { NumberRange } from "../../Core/NumberRange";
+import { Point } from "../../Core/Point";
 import { EChart2DModifierType } from "../../types/ChartModifierType";
+import { ECursorStyle } from "../../types/CursorStyle";
 import { EDragMode } from "../../types/DragMode";
 import { AxisBase2D } from "../Visuals/Axis/AxisBase2D";
 import { ChartModifierBase2D, IChartModifierBaseOptions } from "./ChartModifierBase2D";
@@ -32,12 +35,12 @@ export declare class YAxisDragModifier extends ChartModifierBase2D implements II
     readonly type = EChart2DModifierType.YAxisDrag;
     dragMode: EDragMode;
     protected isClickedOverYAxis: boolean;
-    private pointFrom;
-    private activeAxes;
-    private initialVisibleRanges;
-    private isVerticalChart;
-    private cursorStyle;
-    private includedSeriesMapProperty;
+    protected pointFrom: Point;
+    protected activeAxes: AxisBase2D[];
+    protected initialVisibleRanges: NumberRange[];
+    protected isVerticalChart: boolean;
+    protected cursorStyle: ECursorStyle;
+    protected includedSeriesMapProperty: Map<string, boolean>;
     /**
      * Creates an instance of a XAxisDragModifier
      * @param options optional parameters to pass to the XAxisDragModifier to configure it upon construction
@@ -72,10 +75,10 @@ export declare class YAxisDragModifier extends ChartModifierBase2D implements II
         type: string;
         options: Required<Omit<IChartModifierBaseOptions, never>>;
     };
-    private updateCursor;
-    private doPanning;
-    private doScaling;
-    private getVerticalYAxes;
-    private getHorizontalYAxes;
-    private startDragging;
+    protected updateCursor(mousePoint: Point): void;
+    protected doPanning(mousePoint: Point): void;
+    protected doScaling(pointTo: Point): void;
+    protected getVerticalYAxes(): AxisBase2D[];
+    protected getHorizontalYAxes(): AxisBase2D[];
+    protected startDragging(axes: AxisBase2D[], args: ModifierMouseArgs): void;
 }

package/Charting/ChartModifiers/constants.d.ts

@@ -21,5 +21,8 @@ export declare enum PROPERTY {
     TOOLTIP_DATA_TEMPLATE = "TOOLTIP_DATA_TEMPLATE",
     X_AXIS_ID = "X_AXIS_ID",
     Y_AXIS_ID = "Y_AXIS_ID",
-    PLACEMENT_DIV_ID = "PLACEMENT_DIV_ID"
+    PLACEMENT_DIV_ID = "PLACEMENT_DIV_ID",
+    X_LINE = "X_LINE",
+    Y_LINE = "Y_LINE",
+    AXIS_LABELS = "AXIS_LABELS"
 }

package/Charting/ChartModifiers/constants.js

@@ -26,4 +26,7 @@ var PROPERTY;
     PROPERTY["X_AXIS_ID"] = "X_AXIS_ID";
     PROPERTY["Y_AXIS_ID"] = "Y_AXIS_ID";
     PROPERTY["PLACEMENT_DIV_ID"] = "PLACEMENT_DIV_ID";
+    PROPERTY["X_LINE"] = "X_LINE";
+    PROPERTY["Y_LINE"] = "Y_LINE";
+    PROPERTY["AXIS_LABELS"] = "AXIS_LABELS";
 })(PROPERTY = exports.PROPERTY || (exports.PROPERTY = {}));

package/Charting/Drawing/WebGlRenderContext2D.d.ts

@@ -124,8 +124,12 @@ export declare class WebGlRenderContext2D implements IRenderContext2D {
      */
     drawRect(rect: Rect, viewRect: Rect, strokePen?: IPen2D, fillBrush?: IBrush2D): void;
     printBlendMode(): void;
-    /** Get a native font.  Pass advanced: true if you are planning to rotate the text */
-    getFont(labelStyle: TTextStyle, advanced?: boolean, transformed?: boolean): SCRTFont;
+    /**
+     * Get a native font.  Fonts are cached and shared within webassembly so there is no need to cache them in JS.
+     * Set advanced: true if you are planning to rotate or scale the text.
+     * Set drawEarly: true if you are planning to call font.End() early.  Otherwise all native text will be drawn at the end of the render cycle.
+     */
+    getFont(labelStyle: TTextStyle, advanced?: boolean, drawEarly?: boolean): SCRTFont;
     /** End all fonts, causing text to be drawn */
     endFonts(force?: boolean): void;
 }

package/Charting/Drawing/WebGlRenderContext2D.js

@@ -291,12 +291,16 @@ var WebGlRenderContext2D = /** @class */ (function () {
                 throw new Error("Unhandled blendmode ");
         }
     };
-    /** Get a native font.  Pass advanced: true if you are planning to rotate the text */
-    WebGlRenderContext2D.prototype.getFont = function (labelStyle, advanced, transformed) {
-        var _a;
+    /**
+     * Get a native font.  Fonts are cached and shared within webassembly so there is no need to cache them in JS.
+     * Set advanced: true if you are planning to rotate or scale the text.
+     * Set drawEarly: true if you are planning to call font.End() early.  Otherwise all native text will be drawn at the end of the render cycle.
+     */
+    WebGlRenderContext2D.prototype.getFont = function (labelStyle, advanced, drawEarly) {
+        var _this = this;
         if (advanced === void 0) { advanced = false; }
-        if (transformed === void 0) { transformed = false; }
-        var fontKey = (0, NativeObject_1.getFontKey)(this.webAssemblyContext, labelStyle, advanced, transformed);
+        if (drawEarly === void 0) { drawEarly = false; }
+        var fontKey = (0, NativeObject_1.getFontKey)(this.webAssemblyContext, labelStyle, advanced, drawEarly);
         var nativeContext = this.getNativeContext();
         var nativeFont = nativeContext.AquireFont(fontKey);
         if (!nativeFont) {
@@ -309,10 +313,15 @@ var WebGlRenderContext2D = /** @class */ (function () {
         }
         var currentFontName = nativeFont.GetFaceName();
         if (currentFontName === "SCRT_Loading") {
-            this.webAssemblyContext.TSRRequestCanvasDraw((_a = this.canvasId) !== null && _a !== void 0 ? _a : "undefinedCanvasId");
+            setTimeout(function () { var _a; return _this.webAssemblyContext.TSRRequestCanvasDraw((_a = _this.canvasId) !== null && _a !== void 0 ? _a : "undefinedCanvasId"); }, 100);
         }
         else if (currentFontName !== fontKey.m_strName) {
-            console.warn("Font ".concat(fontKey.m_strName, " could not be found on the server. Falling back to Arial"));
+            // @ts-ignore
+            if (!fontKey.warned) {
+                console.warn("Font ".concat(fontKey.m_strName, " could not be found on the server and has not been registered. Falling back to Arial.\n                Use await scichartSurface.registerFont if you need to load the font from a remote url"));
+                // @ts-ignore
+                fontKey.warned = true;
+            }
         }
         return nativeFont;
     };

package/Charting/LayoutManager/BaseAxisLayoutStrategy.d.ts

@@ -8,6 +8,7 @@ import { ChartLayoutState } from "./ChartLayoutState";
  */
 export declare abstract class BaseAxisLayoutStrategy {
     abstract readonly type: ELayoutStrategyType;
+    readonly isStacked: boolean;
     /**
      * The  {@link LayoutAxisPartsStrategy} for current Axis Layout Strategy
      */

package/Charting/LayoutManager/BaseAxisLayoutStrategy.js

@@ -8,6 +8,7 @@ var AxisLayoutHelpers_1 = require("./AxisLayoutHelpers");
  */
 var BaseAxisLayoutStrategy = /** @class */ (function () {
     function BaseAxisLayoutStrategy() {
+        this.isStacked = false;
     }
     BaseAxisLayoutStrategy.prototype.toJSON = function () {
         return { type: this.type };

package/Charting/LayoutManager/BottomAlignedInnerAxisLayoutStrategy.js

@@ -41,6 +41,11 @@ var BottomAlignedInnerAxisLayoutStrategy = /** @class */ (function (_super) {
         chartLayoutState.bottomInnerAreaSize = Math.max(chartLayoutState.bottomInnerAreaSize, requiredSize);
     };
     BottomAlignedInnerAxisLayoutStrategy.prototype.layoutAxes = function (left, top, right, bottom, axes) {
+        // Set axisLength to default value which is seriesViewRect.width
+        axes.forEach(function (axis) {
+            axis.axisLength = undefined;
+            axis.offset = 0;
+        });
         if (axes.length === 0) {
             return;
         }

package/Charting/LayoutManager/BottomAlignedOuterAxisLayoutStrategy.js

@@ -43,6 +43,11 @@ var BottomAlignedOuterAxisLayoutStrategy = /** @class */ (function (_super) {
         chartLayoutState.bottomOuterAreaSize = Math.max(chartLayoutState.bottomOuterAreaSize, requiredSize);
     };
     BottomAlignedOuterAxisLayoutStrategy.prototype.layoutAxes = function (left, top, right, bottom, axes) {
+        // Set axisLength to default value which is seriesViewRect.width
+        axes.forEach(function (axis) {
+            axis.axisLength = undefined;
+            axis.offset = 0;
+        });
         this.layoutAxesFromTopToBottom(left, top, right, bottom, axes);
     };
     return BottomAlignedOuterAxisLayoutStrategy;

package/Charting/LayoutManager/BottomAlignedOuterHorizontallyStackedAxisLayoutStrategy.d.ts

@@ -8,6 +8,7 @@ import { ChartLayoutState } from "./ChartLayoutState";
  */
 export declare class BottomAlignedOuterHorizontallyStackedAxisLayoutStrategy extends BaseAxisLayoutStrategy {
     readonly type = ELayoutStrategyType.BottomStacked;
+    readonly isStacked: boolean;
     constructor();
     measureAxes(sciChartSurface: SciChartSurface, chartLayoutState: ChartLayoutState, axes: AxisBase2D[]): void;
     layoutAxes(left: number, top: number, right: number, bottom: number, axes: AxisBase2D[]): void;

package/Charting/LayoutManager/BottomAlignedOuterHorizontallyStackedAxisLayoutStrategy.js

@@ -28,6 +28,7 @@ var BottomAlignedOuterHorizontallyStackedAxisLayoutStrategy = /** @class */ (fun
     function BottomAlignedOuterHorizontallyStackedAxisLayoutStrategy() {
         var _this = _super.call(this) || this;
         _this.type = LayoutStrategyType_1.ELayoutStrategyType.BottomStacked;
+        _this.isStacked = true;
         _this.layoutAxisPartsStrategy = AxisLayoutHelpers_1.layoutAxisPartsBottomStrategy;
         return _this;
     }
@@ -77,7 +78,6 @@ var BottomAlignedOuterHorizontallyStackedAxisLayoutStrategy = /** @class */ (fun
             leftOffset += additionalLeftSize;
             axis.offset = leftOffset - left;
             axis.axisLength = rightOffset - leftOffset;
-            axis.isStackedAxis = true;
             axis.isPrimaryAxis = true;
             axis.viewRect = Rect_1.Rect.createWithCoords(leftOffset, topOffset, rightOffset, bottomOffset);
             leftOffset = rightOffset + additionalRightSize;

package/Charting/LayoutManager/LayoutManager.d.ts

@@ -1,6 +1,7 @@
 import { TLayoutManagerDefinition } from "../../Builder/buildSurface";
 import { Rect } from "../../Core/Rect";
 import { Thickness } from "../../Core/Thickness";
+import { EAxisAlignment } from "../../types/AxisAlignment";
 import { ELayoutManagerType } from "../../types/LayoutMangerType";
 import { ELayoutStrategyType } from "../../types/LayoutStrategyType";
 import { Size } from "../../types/Size";
@@ -41,19 +42,19 @@ export declare class LayoutManager {
     /**
      * Layout strategy for layout of left aligned axis outside
      */
-    leftOuterAxesLayoutStrategy: BaseAxisLayoutStrategy;
+    protected leftOuterAxesLayoutStrategyProperty: BaseAxisLayoutStrategy;
     /**
      * Layout strategy for layout of right aligned axis outside
      */
-    rightOuterAxesLayoutStrategy: BaseAxisLayoutStrategy;
+    protected rightOuterAxesLayoutStrategyProperty: BaseAxisLayoutStrategy;
     /**
      * Layout strategy for layout of top aligned axis outside
      */
-    topOuterAxesLayoutStrategy: BaseAxisLayoutStrategy;
+    protected topOuterAxesLayoutStrategyProperty: BaseAxisLayoutStrategy;
     /**
      * Layout strategy for layout of bottom aligned axis outside
      */
-    bottomOuterAxesLayoutStrategy: BaseAxisLayoutStrategy;
+    protected bottomOuterAxesLayoutStrategyProperty: BaseAxisLayoutStrategy;
     /**
      * Layout strategy for layout of left aligned inner axis
      */
@@ -74,6 +75,15 @@ export declare class LayoutManager {
     protected chartLayoutState: ChartLayoutState;
     protected axesGroupedByLayoutStrategy: LayoutStrategyAxes;
     constructor(options?: ILayoutManagerOptions);
+    get leftOuterAxesLayoutStrategy(): BaseAxisLayoutStrategy;
+    set leftOuterAxesLayoutStrategy(value: BaseAxisLayoutStrategy);
+    get rightOuterAxesLayoutStrategy(): BaseAxisLayoutStrategy;
+    set rightOuterAxesLayoutStrategy(value: BaseAxisLayoutStrategy);
+    get topOuterAxesLayoutStrategy(): BaseAxisLayoutStrategy;
+    set topOuterAxesLayoutStrategy(value: BaseAxisLayoutStrategy);
+    get bottomOuterAxesLayoutStrategy(): BaseAxisLayoutStrategy;
+    set bottomOuterAxesLayoutStrategy(value: BaseAxisLayoutStrategy);
+    getAxisLayoutStrategy(axisAlignment: EAxisAlignment, isInnerAxis: boolean): BaseAxisLayoutStrategy;
     layoutChart(viewportSize: Size, padding?: Thickness): Rect;
     toJSON(): TLayoutManagerDefinition;
     protected measureLeftOuterAxes(): void;

package/Charting/LayoutManager/LayoutManager.js

@@ -29,19 +29,19 @@ var LayoutManager = /** @class */ (function () {
         /**
          * Layout strategy for layout of left aligned axis outside
          */
-        this.leftOuterAxesLayoutStrategy = new LeftAlignedOuterAxisLayoutStrategy_1.LeftAlignedOuterAxisLayoutStrategy();
+        this.leftOuterAxesLayoutStrategyProperty = new LeftAlignedOuterAxisLayoutStrategy_1.LeftAlignedOuterAxisLayoutStrategy();
         /**
          * Layout strategy for layout of right aligned axis outside
          */
-        this.rightOuterAxesLayoutStrategy = new RightAlignedOuterAxisLayoutStrategy_1.RightAlignedOuterAxisLayoutStrategy();
+        this.rightOuterAxesLayoutStrategyProperty = new RightAlignedOuterAxisLayoutStrategy_1.RightAlignedOuterAxisLayoutStrategy();
         /**
          * Layout strategy for layout of top aligned axis outside
          */
-        this.topOuterAxesLayoutStrategy = new TopAlignedOuterAxisLayoutStrategy_1.TopAlignedOuterAxisLayoutStrategy();
+        this.topOuterAxesLayoutStrategyProperty = new TopAlignedOuterAxisLayoutStrategy_1.TopAlignedOuterAxisLayoutStrategy();
         /**
          * Layout strategy for layout of bottom aligned axis outside
          */
-        this.bottomOuterAxesLayoutStrategy = new BottomAlignedOuterAxisLayoutStrategy_1.BottomAlignedOuterAxisLayoutStrategy();
+        this.bottomOuterAxesLayoutStrategyProperty = new BottomAlignedOuterAxisLayoutStrategy_1.BottomAlignedOuterAxisLayoutStrategy();
         /**
          * Layout strategy for layout of left aligned inner axis
          */
@@ -69,6 +69,101 @@ var LayoutManager = /** @class */ (function () {
         this.topInnerAxesLayoutStrategy = this.createStrategy(options === null || options === void 0 ? void 0 : options.TopInner, this.topInnerAxesLayoutStrategy);
         this.bottomInnerAxesLayoutStrategy = this.createStrategy(options === null || options === void 0 ? void 0 : options.BottomInner, this.bottomInnerAxesLayoutStrategy);
     }
+    Object.defineProperty(LayoutManager.prototype, "leftOuterAxesLayoutStrategy", {
+        get: function () {
+            return this.leftOuterAxesLayoutStrategyProperty;
+        },
+        set: function (value) {
+            var _a;
+            var currentValue = this.leftOuterAxesLayoutStrategyProperty;
+            if (currentValue !== value) {
+                this.leftOuterAxesLayoutStrategyProperty = value;
+                if (currentValue.isStacked && !value.isStacked) {
+                    this.groupAxesByLayoutStrategy();
+                    resetAxes(this.axesGroupedByLayoutStrategy.leftOuterAxes);
+                }
+                (_a = this.sciChartSurface) === null || _a === void 0 ? void 0 : _a.invalidateElement();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(LayoutManager.prototype, "rightOuterAxesLayoutStrategy", {
+        get: function () {
+            return this.rightOuterAxesLayoutStrategyProperty;
+        },
+        set: function (value) {
+            var _a;
+            var currentValue = this.rightOuterAxesLayoutStrategyProperty;
+            if (currentValue !== value) {
+                this.rightOuterAxesLayoutStrategyProperty = value;
+                if (currentValue.isStacked && !value.isStacked) {
+                    this.groupAxesByLayoutStrategy();
+                    resetAxes(this.axesGroupedByLayoutStrategy.rightOuterAxes);
+                }
+                (_a = this.sciChartSurface) === null || _a === void 0 ? void 0 : _a.invalidateElement();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(LayoutManager.prototype, "topOuterAxesLayoutStrategy", {
+        get: function () {
+            return this.topOuterAxesLayoutStrategyProperty;
+        },
+        set: function (value) {
+            var _a;
+            var currentValue = this.topOuterAxesLayoutStrategyProperty;
+            if (currentValue !== value) {
+                this.topOuterAxesLayoutStrategyProperty = value;
+                if (currentValue.isStacked && !value.isStacked) {
+                    this.groupAxesByLayoutStrategy();
+                    resetAxes(this.axesGroupedByLayoutStrategy.topOuterAxes);
+                }
+                (_a = this.sciChartSurface) === null || _a === void 0 ? void 0 : _a.invalidateElement();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(LayoutManager.prototype, "bottomOuterAxesLayoutStrategy", {
+        get: function () {
+            return this.bottomOuterAxesLayoutStrategyProperty;
+        },
+        set: function (value) {
+            var _a;
+            var currentValue = this.bottomOuterAxesLayoutStrategyProperty;
+            if (currentValue !== value) {
+                this.bottomOuterAxesLayoutStrategyProperty = value;
+                if (currentValue.isStacked && !value.isStacked) {
+                    this.groupAxesByLayoutStrategy();
+                    resetAxes(this.axesGroupedByLayoutStrategy.bottomOuterAxes);
+                }
+                (_a = this.sciChartSurface) === null || _a === void 0 ? void 0 : _a.invalidateElement();
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    LayoutManager.prototype.getAxisLayoutStrategy = function (axisAlignment, isInnerAxis) {
+        switch (axisAlignment) {
+            case AxisAlignment_1.EAxisAlignment.Left: {
+                return isInnerAxis ? this.leftInnerAxesLayoutStrategy : this.leftOuterAxesLayoutStrategy;
+            }
+            case AxisAlignment_1.EAxisAlignment.Right: {
+                return isInnerAxis ? this.rightInnerAxesLayoutStrategy : this.rightOuterAxesLayoutStrategy;
+            }
+            case AxisAlignment_1.EAxisAlignment.Top: {
+                return isInnerAxis ? this.topInnerAxesLayoutStrategy : this.topOuterAxesLayoutStrategy;
+            }
+            case AxisAlignment_1.EAxisAlignment.Bottom: {
+                return isInnerAxis ? this.bottomInnerAxesLayoutStrategy : this.bottomOuterAxesLayoutStrategy;
+            }
+            default: {
+                return (0, AxisAlignment_1.handleInvalidAxisAlignment)(axisAlignment);
+            }
+        }
+    };
     LayoutManager.prototype.layoutChart = function (viewportSize, padding) {
         var _a, _b, _c, _d;
         this.groupAxesByLayoutStrategy();
@@ -170,7 +265,7 @@ var LayoutManager = /** @class */ (function () {
         var _a = this.axesGroupedByLayoutStrategy, topInnerAxes = _a.topInnerAxes, bottomInnerAxes = _a.bottomInnerAxes, leftInnerAxes = _a.leftInnerAxes, rightInnerAxes = _a.rightInnerAxes, topOuterAxes = _a.topOuterAxes, bottomOuterAxes = _a.bottomOuterAxes, leftOuterAxes = _a.leftOuterAxes, rightOuterAxes = _a.rightOuterAxes;
         var groupAxes = function (axes) {
             axes.forEach(function (axis) {
-                var axisAlignment = axis.axisAlignment, isInnerAxis = axis.isInnerAxis;
+                var axisAlignment = axis.axisAlignment, isInnerAxis = axis.isInnerAxis, isVisible = axis.isVisible;
                 if (isInnerAxis) {
                     switch (axisAlignment) {
                         case AxisAlignment_1.EAxisAlignment.Top:
@@ -240,3 +335,8 @@ var LayoutManager = /** @class */ (function () {
     return LayoutManager;
 }());
 exports.LayoutManager = LayoutManager;
+var resetAxes = function (axes) {
+    if (axes.length > 0) {
+        axes[0].isPrimaryAxis = true;
+    }
+};