scichart 2.0.0-alpha.1930 → 2.0.0-alpha.1991

package/Charting/Visuals/RenderableSeries/SplineMountainRenderableSeries.d.ts

@@ -1,4 +1,5 @@
 import { AnimationFiniteStateMachine } from "../../../Core/Animations/AnimationFiniteStateMachine";
+import { NumberRange } from "../../../Core/NumberRange";
 import { ESeriesType } from "../../../types/SeriesType";
 import { DoubleVector, TSciChart } from "../../../types/TSciChart";
 import { BaseAnimation } from "./Animations/BaseAnimation";
@@ -63,6 +64,8 @@ export declare class SplineMountainRenderableSeries extends BaseMountainRenderab
      */
     updateSplineValues(): void;
     /** @inheritDoc */
+    getYRange(xVisibleRange: NumberRange, isXCategoryAxis?: boolean): NumberRange;
+    /** @inheritDoc */
     toJSON(excludeData?: boolean): import("../../../Builder/buildSeries").TSeriesDefinition;
     /** @inheritDoc */
     protected setAnimationVectors(animation: BaseAnimation): void;

package/Charting/Visuals/RenderableSeries/SplineMountainRenderableSeries.js

@@ -16,6 +16,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.SplineMountainRenderableSeries = void 0;
 var Deleter_1 = require("../../../Core/Deleter");
 var SeriesType_1 = require("../../../types/SeriesType");
+var animationHelpers_1 = require("./Animations/animationHelpers");
 var BaseMountainRenderableSeries_1 = require("./BaseMountainRenderableSeries");
 var constants_1 = require("./constants");
 /**
@@ -96,6 +97,11 @@ var SplineMountainRenderableSeries = /** @class */ (function (_super) {
         this.recalculateSpline = false;
     };
     /** @inheritDoc */
+    SplineMountainRenderableSeries.prototype.getYRange = function (xVisibleRange, isXCategoryAxis) {
+        if (isXCategoryAxis === void 0) { isXCategoryAxis = false; }
+        return this.dataSeries.getWindowedYRange(xVisibleRange, true, isXCategoryAxis);
+    };
+    /** @inheritDoc */
     SplineMountainRenderableSeries.prototype.toJSON = function (excludeData) {
         if (excludeData === void 0) { excludeData = false; }
         var json = _super.prototype.toJSON.call(this, excludeData);
@@ -108,32 +114,15 @@ var SplineMountainRenderableSeries = /** @class */ (function (_super) {
     /** @inheritDoc */
     SplineMountainRenderableSeries.prototype.setAnimationVectors = function (animation) {
         this.updateSplineValues();
-        if (animation.isOnStartAnimation) {
-            this.setXFinalAnimationValues(this.xSplineValues);
-            this.setYFinalAnimationValues(this.ySplineValues);
-        }
-        else if (animation.isDataSeriesAnimation) {
-            this.setXInitialAnimationValues(this.xSplineValues);
-            this.setYInitialAnimationValues(this.ySplineValues);
-            // set final animation values for the spline
-            var dataSeries = animation.dataSeries;
-            var xValues = this.xAxis.isCategoryAxis ? dataSeries.getNativeIndexes() : dataSeries.getNativeXValues();
-            this.webAssemblyContext.SCRTSplineHelperCubicSpline(xValues, dataSeries.getNativeYValues(), this.xFinalAnimationValues, this.yFinalAnimationValues, xValues.size(), this.interpolationPoints, dataSeries.containsNaN);
-        }
+        animationHelpers_1.animationHelpers.setSplineAnimationVectors(this.webAssemblyContext, animation, this.dataSeries, animation.dataSeries, this.xSplineValues, this.ySplineValues, this.xAxis.isCategoryAxis, this.interpolationPoints);
     };
     /** @inheritDoc */
     SplineMountainRenderableSeries.prototype.updateAnimationProperties = function (progress, animationFSM) {
         var animation = animationFSM.animation;
         animation.updateSeriesProperties(this, animationFSM.initialStyles, animationFSM.animationProgress);
-        if (animation.isOnStartAnimation) {
-            var dataSeries = this.dataSeries;
-            if (dataSeries) {
-                animation.calculateAnimationValues(this.webAssemblyContext, this.yFinalAnimationValues, this.ySplineValues, progress);
-            }
-        }
-        else if (animation.isDataSeriesAnimation) {
-            animation.calculateDataSeriesAnimationValues(this.webAssemblyContext, this.xInitialAnimationValues, this.xFinalAnimationValues, this.xSplineValues, progress);
-            animation.calculateDataSeriesAnimationValues(this.webAssemblyContext, this.yInitialAnimationValues, this.yFinalAnimationValues, this.ySplineValues, progress);
+        var dataSeries = this.dataSeries;
+        if (dataSeries) {
+            animationHelpers_1.animationHelpers.updateSplineAnimationProperties(this.webAssemblyContext, animation, progress, dataSeries, this.xSplineValues, this.ySplineValues);
         }
         if (this.invalidateParentCallback) {
             this.invalidateParentCallback();

package/Charting/Visuals/RenderableSeries/StackedColumnCollection.d.ts

@@ -1,3 +1,4 @@
+import { TSeriesDefinition } from "../../../Builder/buildSeries";
 import { NumberRange } from "../../../Core/NumberRange";
 import { ESeriesType } from "../../../types/SeriesType";
 import { TSciChart } from "../../../types/TSciChart";
@@ -5,8 +6,21 @@ import { WebGlRenderContext2D } from "../../Drawing/WebGlRenderContext2D";
 import { CoordinateCalculatorBase } from "../../Numerics/CoordinateCalculators/CoordinateCalculatorBase";
 import { RenderPassData } from "../../Services/RenderPassData";
 import { SciChartSurface } from "../SciChartSurface";
-import { BaseStackedCollection } from "./BaseStackedCollection";
+import { BaseStackedCollection, IBaseStackedCollectionOptions } from "./BaseStackedCollection";
 import { StackedColumnRenderableSeries } from "./StackedColumnRenderableSeries";
+/**
+ * Options to pass to the {@link StackedColumnCollection} constructor
+ */
+export interface IStackedColumnCollectionOptions extends IBaseStackedCollectionOptions {
+    /**
+     * the Datapoint width, as a fraction of available space from 0.0 - 1.0
+     */
+    dataPointWidth?: number;
+    /**
+     * the Zero-line Y, the Y-value where the mountain crosses zero and inverts. Default is 0
+     */
+    zeroLineY?: number;
+}
 /**
  * @summary A {@link StackedColumnCollection} allows grouping multiple {@link StackedColumnRenderableSeries}
  * to create a JavaScript Stacked Column, 100 Stacked Column or Stacked Bar chart
@@ -56,7 +70,7 @@ export declare class StackedColumnCollection extends BaseStackedCollection<Stack
      * @param webAssemblyContext The {@link TSciChart | SciChart WebAssembly Context} containing
      * native methods and access to our WebGL2 WebAssembly Drawing Engine
      */
-    constructor(webAssemblyContext: TSciChart);
+    constructor(webAssemblyContext: TSciChart, options?: IStackedColumnCollectionOptions);
     /** @inheritDoc */
     delete(): void;
     /** @inheritDoc */
@@ -66,8 +80,6 @@ export declare class StackedColumnCollection extends BaseStackedCollection<Stack
     /** @inheritDoc */
     getXRange(): NumberRange;
     /** @inheritDoc */
-    getYRange(xVisibleRange: NumberRange, isXCategoryAxis: boolean): NumberRange;
-    /** @inheritDoc */
     onAttach(scs: SciChartSurface): void;
     /** @inheritDoc */
     notifyPropertyChanged(propertyName: string): void;
@@ -78,6 +90,8 @@ export declare class StackedColumnCollection extends BaseStackedCollection<Stack
      * @param xCoordinateCalculator The current XAxis {@link CoordinateCalculatorBase}
      */
     getColumnWidth(xCoordinateCalculator: CoordinateCalculatorBase): number;
+    /** @inheritDoc */
+    toJSON(excludeData?: boolean): TSeriesDefinition;
     /**
      * Gets or sets the Datapoint width, as a fraction of available space from 0.0 - 1.0
      */
@@ -96,7 +110,6 @@ export declare class StackedColumnCollection extends BaseStackedCollection<Stack
     set zeroLineY(zeroLineY: number);
     private detachChildSeries;
     private attachChildSeries;
-    private isEnoughDataToDraw;
     private checkXValuesCorrect;
     /**
      * @param numberOfElements - number of element expected is used for performance to reserve memory

package/Charting/Visuals/RenderableSeries/StackedColumnCollection.js

@@ -17,7 +17,6 @@ exports.StackedColumnCollection = void 0;
 var Deleter_1 = require("../../../Core/Deleter");
 var NumberRange_1 = require("../../../Core/NumberRange");
 var SeriesType_1 = require("../../../types/SeriesType");
-var BaseDataSeries_1 = require("../../Model/BaseDataSeries");
 var BaseRenderableSeries_1 = require("./BaseRenderableSeries");
 var BaseStackedCollection_1 = require("./BaseStackedCollection");
 var constants_1 = require("./constants");
@@ -67,12 +66,15 @@ var StackedColumnCollection = /** @class */ (function (_super) {
      * @param webAssemblyContext The {@link TSciChart | SciChart WebAssembly Context} containing
      * native methods and access to our WebGL2 WebAssembly Drawing Engine
      */
-    function StackedColumnCollection(webAssemblyContext) {
-        var _this = _super.call(this, webAssemblyContext) || this;
+    function StackedColumnCollection(webAssemblyContext, options) {
+        var _a, _b;
+        var _this = _super.call(this, webAssemblyContext, options) || this;
         _this.type = SeriesType_1.ESeriesType.StackedColumnCollection;
         _this.seriesGroups = {};
         _this.dataPointWidthProperty = 0.5;
         _this.zeroLineYProperty = 0;
+        _this.dataPointWidthProperty = (_a = options === null || options === void 0 ? void 0 : options.dataPointWidth) !== null && _a !== void 0 ? _a : _this.dataPointWidthProperty;
+        _this.zeroLineYProperty = (_b = options === null || options === void 0 ? void 0 : options.zeroLineY) !== null && _b !== void 0 ? _b : _this.zeroLineYProperty;
         _this.getColumnWidth = _this.getColumnWidth.bind(_this);
         _this.detachChildSeries = _this.detachChildSeries.bind(_this);
         _this.attachChildSeries = _this.attachChildSeries.bind(_this);
@@ -175,19 +177,6 @@ var StackedColumnCollection = /** @class */ (function (_super) {
         return FastColumnRenderableSeries_1.getXRange(range, count, this.dataPointWidth);
     };
     /** @inheritDoc */
-    StackedColumnCollection.prototype.getYRange = function (xVisibleRange, isXCategoryAxis) {
-        if (!this.isEnoughDataToDraw()) {
-            return new NumberRange_1.NumberRange();
-        }
-        var lastSeriesAccumVector = this.getLastVisibleSeries().accumulatedValues;
-        if (lastSeriesAccumVector.size() !== this.getNativeXValues().size()) {
-            return new NumberRange_1.NumberRange();
-        }
-        // TODO: calc isSorted flag
-        var range = BaseDataSeries_1.getWindowedYRange(this.webAssemblyContext, this.getNativeXValues(), lastSeriesAccumVector, xVisibleRange, true, isXCategoryAxis, true);
-        return new NumberRange_1.NumberRange(0, range.max);
-    };
-    /** @inheritDoc */
     StackedColumnCollection.prototype.onAttach = function (scs) {
         _super.prototype.onAttach.call(this, scs);
         this.nativeDrawingProvider = new this.webAssemblyContext.SCRTStackedColumnSeriesDrawingProvider();
@@ -220,6 +209,17 @@ var StackedColumnCollection = /** @class */ (function (_super) {
         return (BaseRenderableSeries_1.getDataPointWidth(xValues, xCoordinateCalculator, viewRect.width, widthFraction, isCategoryAxis) /
             stackedColumnsCount);
     };
+    /** @inheritDoc */
+    StackedColumnCollection.prototype.toJSON = function (excludeData) {
+        if (excludeData === void 0) { excludeData = false; }
+        var json = _super.prototype.toJSON.call(this, excludeData);
+        var options = {
+            dataPointWidth: this.dataPointWidth,
+            zeroLineY: this.zeroLineY
+        };
+        Object.assign(json.options, options);
+        return json;
+    };
     Object.defineProperty(StackedColumnCollection.prototype, "dataPointWidth", {
         // PROPERTIES
         /**
@@ -265,25 +265,6 @@ var StackedColumnCollection = /** @class */ (function (_super) {
         series.onAttachToParentCollection(this, this.getParentSurface, this.notifyPropertyChanged, this.getColumnWidth);
         this.invalidateParent();
     };
-    StackedColumnCollection.prototype.isEnoughDataToDraw = function () {
-        var stackedSeriesCount = this.getVisibleSeries().length;
-        if (stackedSeriesCount < 1) {
-            return false;
-        }
-        // All renderableSeries should have dataSeries property
-        for (var i = 0; i < stackedSeriesCount; i++) {
-            if (!this.get(i).dataSeries) {
-                return false;
-            }
-        }
-        // All dataSeries should have some values
-        for (var i = 0; i < stackedSeriesCount; i++) {
-            if (this.get(i).dataSeries.count() === 0) {
-                return false;
-            }
-        }
-        return true;
-    };
     StackedColumnCollection.prototype.checkXValuesCorrect = function () {
         var length = this.getDataSeriesValuesCount();
         this.getVisibleSeries().forEach(function (el) {

package/Charting/Visuals/RenderableSeries/StackedColumnRenderableSeries.js

@@ -19,7 +19,6 @@ var SeriesType_1 = require("../../../types/SeriesType");
 var BrushCache_1 = require("../../Drawing/BrushCache");
 var Pen2DCache_1 = require("../../Drawing/Pen2DCache");
 var SciChartSurfaceBase_1 = require("../SciChartSurfaceBase");
-var DpiHelper_1 = require("../TextureManager/DpiHelper");
 var BaseStackedRenderableSeries_1 = require("./BaseStackedRenderableSeries");
 var constants_1 = require("./constants");
 var StackedColumnSeriesHitTestProvider_1 = require("./HitTest/StackedColumnSeriesHitTestProvider");
@@ -112,7 +111,7 @@ var StackedColumnRenderableSeries = /** @class */ (function (_super) {
         this.notifyParentPropertyChangedFn = notifyPropertyChangedFn;
         this.getColumnWidthFn = getColumnWidthFn;
         var _a = this, stroke = _a.stroke, strokeThickness = _a.strokeThickness, fill = _a.fill, opacity = _a.opacity;
-        Pen2DCache_1.createPenInCache(this.strokePenCache, stroke, strokeThickness * DpiHelper_1.DpiHelper.PIXEL_RATIO, opacity);
+        Pen2DCache_1.createPenInCache(this.strokePenCache, stroke, strokeThickness, opacity);
         BrushCache_1.createBrushInCache(this.fillBrushCache, fill, opacity);
     };
     /**
@@ -125,8 +124,8 @@ var StackedColumnRenderableSeries = /** @class */ (function (_super) {
      * Gets the stroke of the column as an HTML color code
      */
     StackedColumnRenderableSeries.prototype.getStrokePen = function () {
-        var _a = this, stroke = _a.stroke, strokeThickness = _a.strokeThickness, fill = _a.fill, opacity = _a.opacity;
-        return Pen2DCache_1.createPenInCache(this.strokePenCache, stroke, strokeThickness * DpiHelper_1.DpiHelper.PIXEL_RATIO, opacity);
+        var _a = this, stroke = _a.stroke, strokeThickness = _a.strokeThickness, opacity = _a.opacity;
+        return Pen2DCache_1.createPenInCache(this.strokePenCache, stroke, strokeThickness, opacity);
     };
     StackedColumnRenderableSeries.prototype.getGroupIndex = function () {
         return this.groupIndex;
@@ -162,7 +161,7 @@ var StackedColumnRenderableSeries = /** @class */ (function (_super) {
         if (propertyName === constants_1.PROPERTY.STROKE ||
             propertyName === constants_1.PROPERTY.STROKE_THICKNESS ||
             propertyName === constants_1.PROPERTY.OPACITY) {
-            Pen2DCache_1.createPenInCache(this.strokePenCache, this.stroke, this.strokeThickness * DpiHelper_1.DpiHelper.PIXEL_RATIO, this.opacity);
+            Pen2DCache_1.createPenInCache(this.strokePenCache, this.stroke, this.strokeThickness, this.opacity);
         }
         if (propertyName === constants_1.PROPERTY.FILL || propertyName === constants_1.PROPERTY.OPACITY) {
             BrushCache_1.createBrushInCache(this.fillBrushCache, this.fill, this.opacity);

package/Charting/Visuals/RenderableSeries/StackedMountainCollection.d.ts

@@ -4,7 +4,7 @@ import { TSciChart } from "../../../types/TSciChart";
 import { WebGlRenderContext2D } from "../../Drawing/WebGlRenderContext2D";
 import { RenderPassData } from "../../Services/RenderPassData";
 import { SciChartSurface } from "../SciChartSurface";
-import { BaseStackedCollection } from "./BaseStackedCollection";
+import { BaseStackedCollection, IBaseStackedCollectionOptions } from "./BaseStackedCollection";
 import { StackedMountainRenderableSeries } from "./StackedMountainRenderableSeries";
 /**
  * @summary A {@link StackedMountainCollection} allows grouping multiple {@link StackedMountainRenderableSeries}
@@ -39,7 +39,7 @@ export declare class StackedMountainCollection extends BaseStackedCollection<Sta
      * @param webAssemblyContext The {@link TSciChart | SciChart WebAssembly Context} containing
      * native methods and access to our WebGL2 WebAssembly Drawing Engine
      */
-    constructor(webAssemblyContext: TSciChart);
+    constructor(webAssemblyContext: TSciChart, options?: IBaseStackedCollectionOptions);
     /** @inheritDoc */
     delete(): void;
     /** @inheritDoc */
@@ -49,8 +49,6 @@ export declare class StackedMountainCollection extends BaseStackedCollection<Sta
     /** @inheritDoc */
     getXRange(): NumberRange;
     /** @inheritDoc */
-    getYRange(xVisibleRange: NumberRange, isXCategoryAxis: boolean): NumberRange;
-    /** @inheritDoc */
     onAttach(scs: SciChartSurface): void;
     /** @inheritDoc */
     notifyPropertyChanged(propertyName: string): void;
@@ -58,7 +56,6 @@ export declare class StackedMountainCollection extends BaseStackedCollection<Sta
     hasDataSeriesValues(): boolean;
     private detachChildSeries;
     private attachChildSeries;
-    private isEnoughDataToDraw;
     private checkXValuesCorrect;
     /**
      * @param numberOfElements - number of element expected is used for performance to reserve memory

package/Charting/Visuals/RenderableSeries/StackedMountainCollection.js

@@ -18,7 +18,6 @@ var Deleter_1 = require("../../../Core/Deleter");
 var NumberRange_1 = require("../../../Core/NumberRange");
 var SeriesType_1 = require("../../../types/SeriesType");
 var Pen2DCache_1 = require("../../Drawing/Pen2DCache");
-var BaseDataSeries_1 = require("../../Model/BaseDataSeries");
 var BaseStackedCollection_1 = require("./BaseStackedCollection");
 var constants_1 = require("./constants");
 /**
@@ -52,8 +51,8 @@ var StackedMountainCollection = /** @class */ (function (_super) {
      * @param webAssemblyContext The {@link TSciChart | SciChart WebAssembly Context} containing
      * native methods and access to our WebGL2 WebAssembly Drawing Engine
      */
-    function StackedMountainCollection(webAssemblyContext) {
-        var _this = _super.call(this, webAssemblyContext) || this;
+    function StackedMountainCollection(webAssemblyContext, options) {
+        var _this = _super.call(this, webAssemblyContext, options) || this;
         _this.type = SeriesType_1.ESeriesType.StackedMountainCollection;
         _this.detachChildSeries = _this.detachChildSeries.bind(_this);
         _this.attachChildSeries = _this.attachChildSeries.bind(_this);
@@ -139,19 +138,6 @@ var StackedMountainCollection = /** @class */ (function (_super) {
         return this.getFirstSeries().dataSeries.xRange;
     };
     /** @inheritDoc */
-    StackedMountainCollection.prototype.getYRange = function (xVisibleRange, isXCategoryAxis) {
-        if (!this.isEnoughDataToDraw()) {
-            return new NumberRange_1.NumberRange();
-        }
-        var lastSeriesAccumVector = this.getLastVisibleSeries().accumulatedValues;
-        if (lastSeriesAccumVector.size() !== this.getNativeXValues().size()) {
-            return new NumberRange_1.NumberRange();
-        }
-        // TODO: calc isSorted flag
-        var range = BaseDataSeries_1.getWindowedYRange(this.webAssemblyContext, this.getNativeXValues(), lastSeriesAccumVector, xVisibleRange, true, isXCategoryAxis, true);
-        return new NumberRange_1.NumberRange(0, range.max);
-    };
-    /** @inheritDoc */
     StackedMountainCollection.prototype.onAttach = function (scs) {
         _super.prototype.onAttach.call(this, scs);
         this.nativeDrawingProvider = new this.webAssemblyContext.SCRTBandSeriesDrawingProvider();
@@ -180,25 +166,6 @@ var StackedMountainCollection = /** @class */ (function (_super) {
         series.onAttachToParentCollection(this, this.getParentSurface, this.notifyPropertyChanged);
         this.invalidateParent();
     };
-    StackedMountainCollection.prototype.isEnoughDataToDraw = function () {
-        var stackedSeriesCount = this.size();
-        if (stackedSeriesCount < 1) {
-            return false;
-        }
-        // All renderableSeries should have dataSeries property
-        for (var i = 0; i < stackedSeriesCount; i++) {
-            if (!this.get(i).dataSeries) {
-                return false;
-            }
-        }
-        // All dataSeries should have some values
-        for (var i = 0; i < stackedSeriesCount; i++) {
-            if (this.get(i).dataSeries.count() === 0) {
-                return false;
-            }
-        }
-        return true;
-    };
     StackedMountainCollection.prototype.checkXValuesCorrect = function () {
         var length = this.getDataSeriesValuesCount();
         this.getVisibleSeries().forEach(function (el) {

package/Charting/Visuals/RenderableSeries/StackedMountainRenderableSeries.js

@@ -147,7 +147,9 @@ var StackedMountainRenderableSeries = /** @class */ (function (_super) {
         if (excludeData === void 0) { excludeData = false; }
         var json = _super.prototype.toJSON.call(this, excludeData);
         var options = {
-            fill: this.fill
+            fill: this.fill,
+            stroke: this.stroke,
+            strokeThickness: this.strokeThickness
         };
         Object.assign(json.options, options);
         return json;

package/Charting/Visuals/SciChartOverview.d.ts

@@ -30,7 +30,7 @@ export declare class SciChartOverview implements IDeletable, IThemeable {
      * @remarks This method is async and must be awaited
      * @param parentChart The {@link SciChartSurface} of the {@link SciChartOverview} will reside
      * @param overviewRootElementId The Div Element ID where the {@link SciChartSurface} of the {@link SciChartOverview} will reside
-     * @param options Optional - Optional parameters for chart creation. See {@link IChartCreationOptions for more details}
+     * @param options Optional - Optional parameters for chart creation. See {@link IOverviewOptions for more details}
      */
     static create(parentChart: SciChartSurface, overviewRootElementId: string, options?: IOverviewOptions): Promise<SciChartOverview>;
     private readonly overviewXAxisProperty;

package/Charting/Visuals/SciChartOverview.js

@@ -67,7 +67,7 @@ var SciChartOverview = /** @class */ (function () {
      * @remarks This method is async and must be awaited
      * @param parentChart The {@link SciChartSurface} of the {@link SciChartOverview} will reside
      * @param overviewRootElementId The Div Element ID where the {@link SciChartSurface} of the {@link SciChartOverview} will reside
-     * @param options Optional - Optional parameters for chart creation. See {@link IChartCreationOptions for more details}
+     * @param options Optional - Optional parameters for chart creation. See {@link IOverviewOptions for more details}
      */
     SciChartOverview.create = function (parentChart, overviewRootElementId, options) {
         return __awaiter(this, void 0, void 0, function () {

package/Charting/Visuals/SciChartPieSurface/PieSegment/PieSegment.d.ts

@@ -1,7 +1,9 @@
 import { GradientParams } from "../../../../Core/GradientParams";
+import { RequiredOwnProps } from "../../../../types/HelperTypes";
 import { SciChartPieSurface } from "../SciChartPieSurface";
 import { IPieSegment } from "./IPieSegment";
 export interface IPieSegmentOptions {
+    id?: string;
     text?: string;
     value?: number;
     color?: string;
@@ -35,6 +37,6 @@ export declare class PieSegment implements IPieSegment {
     set value(value: number);
     get delta(): number;
     set delta(value: number);
-    toJSON(): IPieSegmentOptions;
+    toJSON(): RequiredOwnProps<IPieSegmentOptions>;
     private notifyPropertyChanged;
 }

package/Charting/Visuals/SciChartPieSurface/PieSegment/PieSegment.js

@@ -5,18 +5,18 @@ var guid_1 = require("../../../../utils/guid");
 var constants_1 = require("./constants");
 var PieSegment = /** @class */ (function () {
     function PieSegment(options) {
-        var _a, _b, _c, _d, _e, _f;
-        this.id = guid_1.generateGuid();
+        var _a, _b, _c, _d, _e, _f, _g;
         this.colorProperty = "grey";
         this.isSelectedProperty = false;
         this.textProperty = "";
         this.deltaProperty = 0;
-        this.colorProperty = (_a = options === null || options === void 0 ? void 0 : options.color) !== null && _a !== void 0 ? _a : this.colorProperty;
-        this.colorLinearGradientProperty = (_b = options === null || options === void 0 ? void 0 : options.colorLinearGradient) !== null && _b !== void 0 ? _b : this.colorLinearGradientProperty;
-        this.isSelectedProperty = (_c = options === null || options === void 0 ? void 0 : options.isSelected) !== null && _c !== void 0 ? _c : this.isSelectedProperty;
-        this.textProperty = (_d = options === null || options === void 0 ? void 0 : options.text) !== null && _d !== void 0 ? _d : this.textProperty;
-        this.valueProperty = (_e = options === null || options === void 0 ? void 0 : options.value) !== null && _e !== void 0 ? _e : this.valueProperty;
-        this.delta = (_f = options === null || options === void 0 ? void 0 : options.delta) !== null && _f !== void 0 ? _f : this.deltaProperty;
+        this.id = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : guid_1.generateGuid();
+        this.colorProperty = (_b = options === null || options === void 0 ? void 0 : options.color) !== null && _b !== void 0 ? _b : this.colorProperty;
+        this.colorLinearGradientProperty = (_c = options === null || options === void 0 ? void 0 : options.colorLinearGradient) !== null && _c !== void 0 ? _c : this.colorLinearGradientProperty;
+        this.isSelectedProperty = (_d = options === null || options === void 0 ? void 0 : options.isSelected) !== null && _d !== void 0 ? _d : this.isSelectedProperty;
+        this.textProperty = (_e = options === null || options === void 0 ? void 0 : options.text) !== null && _e !== void 0 ? _e : this.textProperty;
+        this.valueProperty = (_f = options === null || options === void 0 ? void 0 : options.value) !== null && _f !== void 0 ? _f : this.valueProperty;
+        this.delta = (_g = options === null || options === void 0 ? void 0 : options.delta) !== null && _g !== void 0 ? _g : this.deltaProperty;
     }
     PieSegment.prototype.onAttach = function (scps) {
         this.invalidateParentCallback = scps.invalidateElement;
@@ -109,6 +109,7 @@ var PieSegment = /** @class */ (function () {
     });
     PieSegment.prototype.toJSON = function () {
         return {
+            id: this.id,
             color: this.color,
             colorLinearGradient: this.colorLinearGradient,
             isSelected: this.isSelected,

package/Charting/Visuals/SciChartSurface.d.ts

@@ -55,20 +55,32 @@ export declare class SciChartSurface extends SciChartSurfaceBase {
      * Creates a {@link SciChartSurface} and {@link TSciChart | WebAssembly Context} to occupy the div by element ID in your DOM.
      * @remarks This method is async and must be awaited
      * @param divElementId The Div Element ID where the {@link SciChartSurface} will reside
-     * @param options Optional - Optional parameters for chart creation. See {@link IChartCreationOptions} for more details
+     * @param options Optional - Optional parameters for chart creation. See {@link I2DSurfaceOptions} for more details
      */
     static create(divElementId: string, options?: I2DSurfaceOptions): Promise<TWebAssemblyChart>;
     /**
      * USED INTERNALLY - performs a similar operation to {@link SciChartSurface.create} but used internally for testing
      * @param divElementId
-     * @param options - optional parameters for chart creation. See {@link IChartCreationOptions} for more details
+     * @param options - optional parameters for chart creation. See {@link I2DSurfaceOptions} for more details
      */
     static createSingle(divElementId: string, options?: I2DSurfaceOptions): Promise<TWebAssemblyChart>;
+    /**
+     * Allows setting of web URL for Wasm and Data files, in the case you are loading SciChart outside of npm/webpack environment.
+     * Note if loading from CDN the version number of data/wasm Urls must match the version number of SciChart.js you are using.
+     * @example
+     * ```ts
+     * SciChart.SciChartSurface.configure({
+     *  dataUrl: "https://cdn.jsdelivr.net/npm/scichart@1.3.1500/_wasm/scichart2d.data",
+     *  wasmUrl: "https://cdn.jsdelivr.net/npm/scichart@1.3.1500/_wasm/scichart2d.wasm"
+     * });
+     * ```
+     * @param config
+     */
     static configure(config: TSciChartConfig): void;
     private static createTest;
     readonly renderSurface: RenderSurface;
     /**
-     * @summary Gets the collection of {@link IRenderableSeries} - the chart types or seres on this {@link SciChartSurface}
+     * @summary Gets the collection of {@link IRenderableSeries} - the chart types or series on this {@link SciChartSurface}
      * @description A {@link SciChartSurface} can have zero to many {@link IRenderableSeries | RenderableSeries}.
      *
      * The RenderableSeries are drawn as chart types, e.g. {@link FastLineRenderableSeries | Line series},
@@ -208,6 +220,11 @@ export declare class SciChartSurface extends SciChartSurfaceBase {
      * set a new Thickness when you want to change the padding.
      */
     set padding(padding: Thickness);
+    /**
+     * Gets the adjusted padding between the SciChartSurface and it's inner elements, in order top, right, bottom, left
+     * Defines a resulting padding accordingly to DPI scaling.
+     */
+    get adjustedPadding(): Thickness;
     /**
      * Gets or sets a property whether rendering should be debugged. This will draw rectangles around key boxes and areas on the chart.
      * Used internally for development purposes