scichart 3.2.0-beta → 3.2.434

package/Charting3D/ChartModifiers/ResetCamera3DModifier.js

@@ -32,7 +32,7 @@ var ChartModifierBase3D_1 = require("./ChartModifierBase3D");
  *
  * ```ts
  * const sciChartS3Durface: SciChart3DSurface;
- * sciChart3DSurface.chartModifiers.add(new ZoomExtentsModifier3D());
+ * sciChart3DSurface.chartModifiers.add(new ResetCamera3DModifier());
  * ```
  *
  */
@@ -103,7 +103,6 @@ var ResetCamera3DModifier = /** @class */ (function (_super) {
         if (!camera) {
             return;
         }
-        var radius = camera.radius;
         if (camera.projectionMode === CameraController_1.ECameraProjectionMode.Perspective) {
             var animation = new GenericAnimation_1.GenericAnimation({
                 from: { radius: camera.radius, pitch: camera.orbitalPitch, yaw: camera.orbitalYaw },

package/Charting3D/ChartModifiers/TooltipModifier3D.d.ts

@@ -7,8 +7,19 @@ import { ChartModifierBase3D, IChartModifierBase3DOptions } from "./ChartModifie
  * Optional parameters passed to the constructor of {@link TooltipModifier3D} to configure it
  */
 export interface ITooltipModifier3DOptions extends IChartModifierBase3DOptions {
+    /**
+     * Gets or sets the stroke color of the crosshair as an HTML Color code
+     * @param stroke
+     */
     crosshairStroke?: string;
+    /**
+     * Gets or sets the strokethickness of the crosshair line
+     */
     crosshairStrokeThickness?: number;
+    /**
+     * When true, a crosshair line will be displayed from the hovered point location to the far axis wall
+     * @param isVisible
+     */
     isCrosshairVisible?: boolean;
     showTooltip?: boolean;
     tooltipTitle?: string;
@@ -48,11 +59,33 @@ export declare class TooltipModifier3D extends ChartModifierBase3D {
     constructor(options?: ITooltipModifier3DOptions);
     includeSeries(series: IRenderableSeries3D, isIncluded: boolean): void;
     getIncludedSeries(): IRenderableSeries3D[];
+    /**
+     * When true, a crosshair line will be displayed from the hovered point location to the far axis wall
+     * @param isVisible
+     */
     get isCrosshairVisible(): boolean;
+    /**
+     * When true, a crosshair line will be displayed from the hovered point location to the far axis wall
+     * @param isVisible
+     */
     set isCrosshairVisible(isVisible: boolean);
+    /**
+     * Gets or sets the stroke color of the crosshair as an HTML Color code
+     * @param stroke
+     */
     get crosshairStroke(): string;
+    /**
+     * Gets or sets the stroke color of the crosshair as an HTML Color code
+     * @param stroke
+     */
     set crosshairStroke(stroke: string);
+    /**
+     * Gets or sets the strokethickness of the crosshair line
+     */
     get crosshairStrokeThickness(): number;
+    /**
+     * Gets or sets the strokethickness of the crosshair line
+     */
     set crosshairStrokeThickness(strokeThickness: number);
     get tooltipSvgTemplate(): TTooltip3DSvgTemplate;
     set tooltipSvgTemplate(value: TTooltip3DSvgTemplate);
@@ -82,6 +115,8 @@ export declare class TooltipModifier3D extends ChartModifierBase3D {
     onDetach(): void;
     /** @inheritDoc */
     modifierMouseMove(args: ModifierMouseArgs): void;
+    onParentSurfaceRendered(): void;
+    protected update(): void;
 }
 /** Relocate the tooltip so that it is always within the seriesViewRect */
 export declare const adjustTooltipPosition3D: (width: number, height: number, svgAnnotation: TooltipSvgAnnotation3D) => void;

package/Charting3D/ChartModifiers/TooltipModifier3D.js

@@ -94,9 +94,17 @@ var TooltipModifier3D = /** @class */ (function (_super) {
             .filter(function (rs) { return rs.isVisible && _this.includedSeriesMap.get(rs) !== false; });
     };
     Object.defineProperty(TooltipModifier3D.prototype, "isCrosshairVisible", {
+        /**
+         * When true, a crosshair line will be displayed from the hovered point location to the far axis wall
+         * @param isVisible
+         */
         get: function () {
             return this.isCrosshairVisibleProperty;
         },
+        /**
+         * When true, a crosshair line will be displayed from the hovered point location to the far axis wall
+         * @param isVisible
+         */
         set: function (isVisible) {
             var _a;
             this.isCrosshairVisibleProperty = isVisible;
@@ -106,9 +114,17 @@ var TooltipModifier3D = /** @class */ (function (_super) {
         configurable: true
     });
     Object.defineProperty(TooltipModifier3D.prototype, "crosshairStroke", {
+        /**
+         * Gets or sets the stroke color of the crosshair as an HTML Color code
+         * @param stroke
+         */
         get: function () {
             return this.crosshairStrokeProperty;
         },
+        /**
+         * Gets or sets the stroke color of the crosshair as an HTML Color code
+         * @param stroke
+         */
         set: function (stroke) {
             var _a;
             this.crosshairStrokeProperty = stroke;
@@ -118,9 +134,15 @@ var TooltipModifier3D = /** @class */ (function (_super) {
         configurable: true
     });
     Object.defineProperty(TooltipModifier3D.prototype, "crosshairStrokeThickness", {
+        /**
+         * Gets or sets the strokethickness of the crosshair line
+         */
         get: function () {
             return this.crosshairStrokeThicknessProperty;
         },
+        /**
+         * Gets or sets the strokethickness of the crosshair line
+         */
         set: function (strokeThickness) {
             var _a;
             this.crosshairStrokeThicknessProperty = strokeThickness;
@@ -284,11 +306,23 @@ var TooltipModifier3D = /** @class */ (function (_super) {
     };
     /** @inheritDoc */
     TooltipModifier3D.prototype.modifierMouseMove = function (args) {
-        var _a, _b, _c, _d, _e;
+        this.activePointerEvents.set(args.pointerId, args);
         _super.prototype.modifierMouseMove.call(this, args);
-        var _f = args.mousePoint, x = _f.x, y = _f.y;
+        if (this.getIsActionAllowed(args)) {
+            this.update();
+        }
+    };
+    TooltipModifier3D.prototype.onParentSurfaceRendered = function () {
+        this.update();
+    };
+    TooltipModifier3D.prototype.update = function () {
+        var _this = this;
+        var _a, _b, _c, _d, _e;
+        if (!this.mousePoint)
+            return;
+        var _f = this.mousePoint, x = _f.x, y = _f.y;
         var seriesInfo = this.getIncludedSeries()
-            .map(function (rs) { return rs.hitTest(args.mousePoint); })
+            .map(function (rs) { return rs.hitTest(_this.mousePoint); })
             .find(function (result) { return result.isHit; });
         if (seriesInfo === null || seriesInfo === void 0 ? void 0 : seriesInfo.isHit) {
             // console.log(`TooltipModifier3D: HitTest at (${x}, ${y})`);
@@ -317,8 +351,10 @@ var TooltipModifier3D = /** @class */ (function (_super) {
             }
             this.tooltipAnnotation.isHidden = !this.showTooltip;
             if (this.showTooltip) {
-                this.tooltipAnnotation.x1 = x;
-                this.tooltipAnnotation.y1 = y;
+                var xt = (0, translate_1.translateToNotScaled)(x);
+                var yt = (0, translate_1.translateToNotScaled)(y);
+                this.tooltipAnnotation.x1 = xt;
+                this.tooltipAnnotation.y1 = yt;
             }
             if (this.showTooltip || this.tooltipLegendTemplate) {
                 this.tooltipAnnotation.seriesInfo = seriesInfo;

package/Charting3D/Model/DataSeries/BaseGridDataSeries3D.d.ts

@@ -116,7 +116,7 @@ export declare abstract class BaseGridDataSeries3D extends BaseDataSeries3D impl
      * @param xIndex the x-index from 0 to xSize
      * @param YValue the new Height-value
      */
-    setYValue(yIndex: number, xIndex: number, zValue: number): void;
+    setYValue(zIndex: number, xIndex: number, yValue: number): void;
     /**
      * @inheritDoc
      */

package/Charting3D/Model/DataSeries/BaseGridDataSeries3D.js

@@ -144,8 +144,8 @@ var BaseGridDataSeries3D = /** @class */ (function (_super) {
      * @param xIndex the x-index from 0 to xSize
      * @param YValue the new Height-value
      */
-    BaseGridDataSeries3D.prototype.setYValue = function (yIndex, xIndex, zValue) {
-        this.yValuesProperty[yIndex][xIndex] = zValue;
+    BaseGridDataSeries3D.prototype.setYValue = function (zIndex, xIndex, yValue) {
+        this.yValuesProperty[zIndex][xIndex] = yValue;
         this.notifyDataChanged();
     };
     /**

package/Charting3D/Model/DataSeries/IPointMetadata3D.d.ts

@@ -5,11 +5,16 @@
  */
 export interface IPointMetadata3D {
     /**
-     * Override the color for this particular point. Set=undefined for default
+     * @deprecated Property naming was wrong, we've updated it to vertexColor [SCJS-1566]
      */
     vertexColorAbgr?: number;
+    /**
+     * Override the color for this particular point. Set=undefined for default.
+     * Note: This is a 32-bit integer in ARGB format, e.g. 0xFFFF0000 is Red
+     */
+    vertexColor?: number;
     /**
      * Override the scale for this particular point. Set=1.0 for default
      */
-    pointScale: number;
+    pointScale?: number;
 }

package/Charting3D/Visuals/Axis/AxisBase3D.d.ts

@@ -1,7 +1,10 @@
+import { TLabelProviderDefinition } from "../../../Builder/buildAxis";
 import { IThemeable } from "../../../Charting/Themes/IThemeable";
 import { IThemeProvider } from "../../../Charting/Themes/IThemeProvider";
 import { AxisCore } from "../../../Charting/Visuals/Axis/AxisCore";
 import { IAxisCoreOptions } from "../../../Charting/Visuals/Axis/IAxisCoreOptions";
+import { ILabelOptions } from "../../../Charting/Visuals/Axis/LabelProvider/LabelProvider";
+import { LabelProviderBase2D } from "../../../Charting/Visuals/Axis/LabelProvider/LabelProviderBase2D";
 import { NumberRange } from "../../../Core/NumberRange";
 import { ObservableArray } from "../../../Core/ObservableArray";
 import { TSciChart3D } from "../../../types/TSciChart3D";
@@ -14,7 +17,7 @@ import { IAxisDescriptor } from "./IAxisDescriptor";
 /**
  * Optional parameters passed to {@link AxisBase3D} constructor to set defaults at construction time
  */
-export interface IAxisBase3dOptions extends IAxisCoreOptions {
+export interface IAxisBase3dOptions extends IAxisCoreOptions, ILabelOptions {
     /**
      * Gets or sets tick labels offset from the axis plane
      */
@@ -35,6 +38,10 @@ export interface IAxisBase3dOptions extends IAxisCoreOptions {
      * Sets the plane background color as an HTML Color string
      */
     planeBackgroundFill?: string;
+    /**
+     * Sets a {@link LabelProvider} - a class which is responsible for formatting axis labels and cursor labels from numeric values
+     */
+    labelProvider?: LabelProviderBase2D | TLabelProviderDefinition;
 }
 /**
  * Which axis - used for calculations

package/Charting3D/Visuals/Axis/AxisBase3D.js

@@ -69,7 +69,6 @@ var AxisBase3D = /** @class */ (function (_super) {
         _this.planeBorderThicknessProperty = (_d = options === null || options === void 0 ? void 0 : options.planeBorderThickness) !== null && _d !== void 0 ? _d : 2;
         _this.axisPlaneBackgroundFillProperty = (_e = options === null || options === void 0 ? void 0 : options.planeBackgroundFill) !== null && _e !== void 0 ? _e : _this.axisPlaneBackgroundFillProperty;
         return _this;
-        //console.log(`ctor planeBorderColorProperty: ${this.planeBorderColorProperty}`);
     }
     /**
      * @inheritDoc
@@ -104,7 +103,6 @@ var AxisBase3D = /** @class */ (function (_super) {
         if (this.axisPlaneBackgroundFill === previousThemeProvider.axisPlaneBackgroundFill) {
             this.axisPlaneBackgroundFill = themeProvider.axisPlaneBackgroundFill;
         }
-        //console.log(`applyTheme planeBorderColorProperty: ${this.planeBorderColorProperty}`);
     };
     Object.defineProperty(AxisBase3D.prototype, "isYAxis", {
         /**

package/Charting3D/Visuals/Axis/NumericAxis3D.d.ts

@@ -2,11 +2,12 @@ import { CoordinateCalculatorBase } from "../../../Charting/Numerics/CoordinateC
 import { TEasingFn } from "../../../Core/Animations/EasingFunctions";
 import { NumberRange } from "../../../Core/NumberRange";
 import { EAxisType } from "../../../types/AxisType";
-import { ENumericFormat } from "../../../types/NumericFormat";
 import { TSciChart3D } from "../../../types/TSciChart3D";
 import { AxisBase3D, IAxisBase3dOptions } from "./AxisBase3D";
 interface INumericAxis3dOptions extends IAxisBase3dOptions {
-    labelFormat?: ENumericFormat;
+    /**
+     * @deprecated use labelPrecision instead
+     */
     precision?: number;
 }
 /**

package/Charting3D/Visuals/Axis/NumericAxis3D.js

@@ -44,7 +44,7 @@ var NumericAxis3D = /** @class */ (function (_super) {
      */
     function NumericAxis3D(webAssemblyContext, options) {
         var _this = this;
-        var _a, _b;
+        var _a;
         _this = _super.call(this, webAssemblyContext, options) || this;
         /**
          * @inheritDoc
@@ -53,8 +53,12 @@ var NumericAxis3D = /** @class */ (function (_super) {
         _this.tickProvider = new NumericTickProvider_1.NumericTickProvider(_this.webAssemblyContext3D);
         _this.labelProvider = new NumericLabelProvider_1.NumericLabelProvider();
         _this.deltaCalculator = new NumericDeltaCalculator_1.NumericDeltaCalculator(_this.webAssemblyContext3D);
-        _this.labelProvider.numericFormat = (_a = options === null || options === void 0 ? void 0 : options.labelFormat) !== null && _a !== void 0 ? _a : _this.labelProvider.numericFormat;
-        _this.labelProvider.precision = (_b = options === null || options === void 0 ? void 0 : options.precision) !== null && _b !== void 0 ? _b : _this.labelProvider.precision;
+        // Workaround for deprecated property
+        if (options === null || options === void 0 ? void 0 : options.precision) {
+            options.labelPrecision = options.precision;
+        }
+        _this.labelProvider =
+            (_a = options === null || options === void 0 ? void 0 : options.labelProvider) !== null && _a !== void 0 ? _a : new NumericLabelProvider_1.NumericLabelProvider(options);
         return _this;
     }
     /**

package/Charting3D/Visuals/Primitives/PointLine3DSceneEntity.js

@@ -164,10 +164,12 @@ var PointLine3DSceneEntity = /** @class */ (function (_super) {
         // metadata will always be non-null but individual metadata items may be undefined
         // as its implemented as a non-sparse array
         metadata.forEach(function (meta, index) {
+            var _a;
             if (meta) {
-                if (meta.vertexColorAbgr) {
+                var vertexColor = (_a = meta.vertexColorAbgr) !== null && _a !== void 0 ? _a : meta.vertexColor;
+                if (vertexColor) {
                     hasDefaultColors = false;
-                    _this.pointColors.set(index, meta.vertexColorAbgr);
+                    _this.pointColors.set(index, vertexColor);
                 }
                 if (meta.pointScale) {
                     hasDefaultScales = false;

package/Charting3D/Visuals/Primitives/ScatterPointsSceneEntity.js

@@ -157,9 +157,12 @@ var ScatterPointsSceneEntity = /** @class */ (function (_super) {
         // metadata will always be non-null but individual metadata items may be undefined
         // as its implemented as a non-sparse array
         metadata.forEach(function (meta, index) {
+            var _a;
             if (meta) {
-                if (meta.vertexColorAbgr) {
-                    _this.pointColors.set(index, meta.vertexColorAbgr);
+                // [SCJS-1566] Renamed vertexColorAbgr to vertexColor. Preserved backward compatibility
+                var vertexColor = (_a = meta.vertexColorAbgr) !== null && _a !== void 0 ? _a : meta.vertexColor;
+                if (vertexColor) {
+                    _this.pointColors.set(index, vertexColor);
                 }
                 if (meta.pointScale) {
                     _this.pointScales.set(index, meta.pointScale);

package/Charting3D/Visuals/Primitives/SurfaceMeshSceneEntity.js

@@ -300,7 +300,8 @@ var SurfaceMeshSceneEntity = /** @class */ (function (_super) {
             var gridWidth = gridDataSeries.xSize;
             var gridHeight = gridDataSeries.zSize;
             Guard_1.Guard.notNull(this.currentRenderPassData, "SurfaceMeshSceneEntity.currentRenderPassData");
-            if (this.state.setColorMapTextureInvalid) {
+            // SCJS-1562 2 DAYS to find the source of the crash! Don't recreate every frame.
+            if (this.state.isColorMapTextureInvalid) {
                 this.colorMapTexture = (0, Deleter_1.deleteSafe)(this.colorMapTexture);
                 this.colorMapTexture = (_a = this.parentSeries.meshColorPalette) === null || _a === void 0 ? void 0 : _a.getTexture(this.parentSeries.colorMapTextureSize);
             }

package/Charting3D/Visuals/RenderableSeries/BaseRenderableSeries3D.d.ts

@@ -215,6 +215,11 @@ export declare abstract class BaseRenderableSeries3D extends DeletableEntity imp
     onDpiChanged(args: TDpiChangedEventArgs): void;
     /** @inheritDoc */
     hitTest(screenPoint: Point): SeriesInfo3D;
+    /**
+     * Is being called when the data for the underlying DataSeries changes
+     * @protected
+     */
+    protected dataSeriesDataChanged(): void;
     protected enrichHitTest(hitTestInfo: HitTestInfo3D): SeriesInfo3D;
     /**
      * Used internally - sets the {@link IRenderableSeriesSceneEntity | 3D Scene Entity}

package/Charting3D/Visuals/RenderableSeries/BaseRenderableSeries3D.js

@@ -49,16 +49,17 @@ var BaseRenderableSeries3D = /** @class */ (function (_super) {
         _this = _super.call(this) || this;
         _this.id = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : (0, guid_1.generateGuid)();
         _this.webAssemblyContext = webAssemblyContext;
-        _this.dataSeriesProperty = (options === null || options === void 0 ? void 0 : options.dataSeries) || undefined;
+        _this.dataSeriesDataChanged = _this.dataSeriesDataChanged.bind(_this);
+        _this.pointMarkerPropertyChanged = _this.pointMarkerPropertyChanged.bind(_this);
+        _this.onDpiChanged = _this.onDpiChanged.bind(_this);
+        _this.hitTest = _this.hitTest.bind(_this);
+        _this.enrichHitTest = _this.enrichHitTest.bind(_this);
+        _this.dataSeries = (options === null || options === void 0 ? void 0 : options.dataSeries) || undefined;
         _this.isVisibleProperty = (options === null || options === void 0 ? void 0 : options.isVisible) !== undefined ? options === null || options === void 0 ? void 0 : options.isVisible : true;
         _this.pointMarkerProperty = (options === null || options === void 0 ? void 0 : options.pointMarker) || undefined;
         _this.strokeProperty = (options === null || options === void 0 ? void 0 : options.stroke) || "#FFFFFF";
         _this.shininessProperty = (options === null || options === void 0 ? void 0 : options.shininess) === undefined ? 64 : options.shininess;
         _this.opacityProperty = (_b = options === null || options === void 0 ? void 0 : options.opacity) !== null && _b !== void 0 ? _b : 1;
-        _this.pointMarkerPropertyChanged = _this.pointMarkerPropertyChanged.bind(_this);
-        _this.onDpiChanged = _this.onDpiChanged.bind(_this);
-        _this.hitTest = _this.hitTest.bind(_this);
-        _this.enrichHitTest = _this.enrichHitTest.bind(_this);
         return _this;
     }
     /** @inheritDoc */
@@ -132,7 +133,11 @@ var BaseRenderableSeries3D = /** @class */ (function (_super) {
         },
         /** @inheritDoc */
         set: function (dataSeries) {
+            var _a, _b;
             this.dataSeriesProperty = dataSeries;
+            (_a = this.dataSeriesProperty) === null || _a === void 0 ? void 0 : _a.dataChanged.unsubscribe(this.dataSeriesDataChanged);
+            this.dataSeriesProperty = dataSeries;
+            (_b = this.dataSeriesProperty) === null || _b === void 0 ? void 0 : _b.dataChanged.subscribe(this.dataSeriesDataChanged);
             this.notifyPropertyChanged(Constants_1.PROPERTY.DATA_SERIES);
         },
         enumerable: false,
@@ -216,6 +221,15 @@ var BaseRenderableSeries3D = /** @class */ (function (_super) {
         }
         return SeriesInfo3D_1.SeriesInfo3D.empty();
     };
+    /**
+     * Is being called when the data for the underlying DataSeries changes
+     * @protected
+     */
+    BaseRenderableSeries3D.prototype.dataSeriesDataChanged = function () {
+        if (this.invalidateParentCallback) {
+            this.invalidateParentCallback();
+        }
+    };
     BaseRenderableSeries3D.prototype.enrichHitTest = function (hitTestInfo) {
         var _a;
         var hitDataSeries = (_a = hitTestInfo.associatedSeries) === null || _a === void 0 ? void 0 : _a.dataSeries;

package/Charting3D/Visuals/SciChart3DRenderer.d.ts

@@ -32,7 +32,6 @@ export declare class SciChart3DRenderer {
      * The main render loop
      */
     render(): void;
-    private updateSvgCanvasSize;
     private updateWatermark;
     private isSurfaceValid;
     private prepareAxes;

package/Charting3D/Visuals/SciChart3DRenderer.js

@@ -11,7 +11,6 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SciChart3DRenderer = void 0;
 var IAnnotation_1 = require("../../Charting/Visuals/Annotations/IAnnotation");
-var DpiHelper_1 = require("../../Charting/Visuals/TextureManager/DpiHelper");
 var Deleter_1 = require("../../Core/Deleter");
 var Guard_1 = require("../../Core/Guard");
 var Rect_1 = require("../../Core/Rect");
@@ -84,12 +83,15 @@ var SciChart3DRenderer = /** @class */ (function () {
         if (!this.isSurfaceValid(this.scs)) {
             throw Error("SciChart3DSurface is not valid");
         }
+        // Enable/disable hit test as required.
+        this.scs.webAssemblyContext3D.SCRTSetIsSelectionBufferEnabled(this.scs.isHitTestEnabled);
         // Step 1: Update the current active SceneWorld and camera
         var sceneWorld = this.scs.getSceneWorld();
         if (!sceneWorld) {
             console.warn("SciChart3DRenderer: Undefined scene world!");
             return;
         }
+        this.scs.preRender.raiseEvent();
         this.wasmContext.SCRTSetActiveWorld(sceneWorld);
         this.updateWorldDimensions(sceneWorld, this.scs.worldDimensions);
         var tsrCamera = sceneWorld.GetMainCamera();
@@ -98,7 +100,6 @@ var SciChart3DRenderer = /** @class */ (function () {
         var _a = this.scs.viewportManager, width = _a.width, height = _a.height;
         var viewRect = new Rect_1.Rect(0, 0, width, height);
         this.scs.setSeriesViewRect(viewRect);
-        this.updateSvgCanvasSize(viewRect);
         // Animation Step
         var timeElapsed = this.previousTime ? Date.now() - this.previousTime : undefined;
         this.previousTime = Date.now();
@@ -130,30 +131,6 @@ var SciChart3DRenderer = /** @class */ (function () {
             setTimeout(this.scs.invalidateElement, 0);
         }
     };
-    SciChart3DRenderer.prototype.updateSvgCanvasSize = function (seriesViewRect) {
-        // Convert seriesViewRect back to device pixels
-        // e.g. at Retina display canvas size may be 400x300 but seriesViewRect size would be 800x600
-        var viewRectInDevicePixels = new Rect_1.Rect(seriesViewRect.x / DpiHelper_1.DpiHelper.PIXEL_RATIO, seriesViewRect.y / DpiHelper_1.DpiHelper.PIXEL_RATIO, seriesViewRect.width / DpiHelper_1.DpiHelper.PIXEL_RATIO, seriesViewRect.height / DpiHelper_1.DpiHelper.PIXEL_RATIO);
-        if (!this.prevRect) {
-            this.prevRect = viewRectInDevicePixels;
-        }
-        else if (Rect_1.Rect.isEqual(this.prevRect, viewRectInDevicePixels)) {
-            return;
-        }
-        var svgRootElement = this.scs.domSvgContainer;
-        if (svgRootElement) {
-            svgRootElement.style.marginLeft = "".concat(viewRectInDevicePixels.x, "px");
-            svgRootElement.style.marginTop = "".concat(viewRectInDevicePixels.y, "px");
-            // Set width, height
-            svgRootElement.setAttribute("width", viewRectInDevicePixels.width.toString());
-            svgRootElement.setAttribute("height", viewRectInDevicePixels.height.toString());
-            // Set display width, height
-            svgRootElement.style.width = viewRectInDevicePixels.width + "px";
-            svgRootElement.style.height = viewRectInDevicePixels.height + "px";
-            // Set scaling so annotations, tooltips etc are in right position after DPI Scaling
-            svgRootElement.currentScale = 1;
-        }
-    };
     SciChart3DRenderer.prototype.updateWatermark = function () {
         var chartHeight = this.scs.getMainCanvas().clientHeight;
         var chartWidth = this.scs.getMainCanvas().clientWidth;

package/Charting3D/Visuals/SciChart3DSurface.d.ts

@@ -1,6 +1,5 @@
 import { IChartModifierBase } from "../../Charting/ChartModifiers/ChartModifierBase";
 import { IThemeProvider } from "../../Charting/Themes/IThemeProvider";
-import { I2DSurfaceOptions } from "../../Charting/Visuals/I2DSurfaceOptions";
 import { ESurfaceType, SciChartSurfaceBase, TSciChartConfig } from "../../Charting/Visuals/SciChartSurfaceBase";
 import { TDpiChangedEventArgs } from "../../Charting/Visuals/TextureManager/DpiHelper";
 import { IGenericAnimation } from "../../Core/Animations/GenericAnimation";
@@ -17,6 +16,8 @@ import { IRenderableSeries3D } from "./RenderableSeries/BaseRenderableSeries3D";
 import { RootSceneEntity } from "./RootSceneEntity";
 import { ViewportManager3DBase } from "./ViewportManager3DBase";
 import { EWatermarkPosition } from "../../types/WatermarkPosition";
+import { EventHandler } from "../../Core/EventHandler";
+import { Thickness } from "../../Core/Thickness";
 export declare type TSciChart3D = TWasmContext;
 export declare type TWebAssemblyChart3D = {
     wasmContext: TSciChart3D;
@@ -62,9 +63,9 @@ export declare class SciChart3DSurface extends SciChartSurfaceBase {
     /**
      * USED INTERNALLY - performs a similar operation to {@link SciChart3DSurface.create} but used internally for testing
      * @param divElement The Div Element ID or reference where the {@link SciChartSurface} will reside
-     * @param options Optional parameters of type {@link I2DSurfaceOptions}
+     * @param options Optional parameters of type {@link I3DSurfaceOptions}
      */
-    static createSingle(divElement: string | HTMLDivElement, options?: I2DSurfaceOptions): Promise<TWebAssemblyChart3D>;
+    static createSingle(divElement: string | HTMLDivElement, options?: I3DSurfaceOptions): Promise<TWebAssemblyChart3D>;
     /**
      * 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.
@@ -87,9 +88,9 @@ export declare class SciChart3DSurface extends SciChartSurfaceBase {
      * Creates a {@link SciChart3DSurface} and {@link TSciChart3D | WebAssembly Context} to occupy the div by element ID in your DOM.
      * @remarks This method is async and must be awaited
      * @param divElementId The ID or reference of Div Element where the {@link SciChart3DSurface} will reside
-     * @param options Optional parameters of type {@link IChartCreationOptions}
+     * @param options Optional parameters of type {@link I3DSurfaceOptions}
      */
-    static create(divElementId: string | HTMLDivElement, options?: I2DSurfaceOptions): Promise<TWebAssemblyChart3D>;
+    static create(divElementId: string | HTMLDivElement, options?: I3DSurfaceOptions): Promise<TWebAssemblyChart3D>;
     static disposeSharedWasmContext(): void;
     /**
      * @summary Gets the collection of {@link IRenderableSeries3D} - the chart types or seres on this {@link SciChart3DSurface}
@@ -127,6 +128,11 @@ export declare class SciChart3DSurface extends SciChartSurfaceBase {
     readonly webAssemblyContext3D: TSciChart3D;
     /** The position of the watermark for trials and community licenses */
     watermarkPosition: EWatermarkPosition;
+    /**
+     * An event handler which notifies its subscribers when a render operation starts. Use this
+     * to update elements of the chart for the current render.  Any updates made here will not trigger a subsequent render.
+     */
+    preRender: EventHandler<void>;
     protected animationList: IGenericAnimation[];
     private xAxisProperty;
     private yAxisProperty;
@@ -326,6 +332,7 @@ export declare class SciChart3DSurface extends SciChartSurfaceBase {
      * @inheritDoc
      */
     updateWatermark(left: number, bottom: number): void;
+    getSeriesViewRectPadding(scaled: boolean): Thickness;
     protected applyOptions(options: I3DSurfaceOptions): void;
     /**
      * @inheritDoc

package/Charting3D/Visuals/SciChart3DSurface.js

@@ -37,6 +37,8 @@ var SciChartDefaults_1 = require("../../Charting/Visuals/SciChartDefaults");
 var WebGlHelper_1 = require("../../Core/WebGlHelper");
 var Globals_1 = require("../../Core/Globals");
 var createMaster_1 = require("../../Charting/Visuals/createMaster");
+var EventHandler_1 = require("../../Core/EventHandler");
+var Thickness_1 = require("../../Core/Thickness");
 exports.sciChartConfig3D = {};
 /**
  * @summary The {@link SciChart3DSurface} is the root 3D Chart control in SciChart's High Performance Real-time
@@ -68,6 +70,11 @@ var SciChart3DSurface = /** @class */ (function (_super) {
         _this = _super.call(this, webAssemblyContext, options === null || options === void 0 ? void 0 : options.canvases) || this;
         /** The position of the watermark for trials and community licenses */
         _this.watermarkPosition = SciChartDefaults_1.SciChartDefaults.watermarkPosition;
+        /**
+         * An event handler which notifies its subscribers when a render operation starts. Use this
+         * to update elements of the chart for the current render.  Any updates made here will not trigger a subsequent render.
+         */
+        _this.preRender = new EventHandler_1.EventHandler();
         _this.animationList = [];
         _this.isAxisCubeRenderedProperty = false;
         _this.isHitTestEnabledProperty = false;
@@ -123,7 +130,7 @@ var SciChart3DSurface = /** @class */ (function (_super) {
     /**
      * USED INTERNALLY - performs a similar operation to {@link SciChart3DSurface.create} but used internally for testing
      * @param divElement The Div Element ID or reference where the {@link SciChartSurface} will reside
-     * @param options Optional parameters of type {@link I2DSurfaceOptions}
+     * @param options Optional parameters of type {@link I3DSurfaceOptions}
      */
     SciChart3DSurface.createSingle = function (divElement, options) {
         return (0, createSingle3d_1.createSingle3dInternal)(divElement, options).then(function (result) {
@@ -160,7 +167,7 @@ var SciChart3DSurface = /** @class */ (function (_super) {
      * Creates a {@link SciChart3DSurface} and {@link TSciChart3D | WebAssembly Context} to occupy the div by element ID in your DOM.
      * @remarks This method is async and must be awaited
      * @param divElementId The ID or reference of Div Element where the {@link SciChart3DSurface} will reside
-     * @param options Optional parameters of type {@link IChartCreationOptions}
+     * @param options Optional parameters of type {@link I3DSurfaceOptions}
      */
     SciChart3DSurface.create = function (divElementId, options) {
         return (0, createMaster3d_1.createMultichart3d)(divElementId, options).then(function (result) {
@@ -390,7 +397,6 @@ var SciChart3DSurface = /** @class */ (function (_super) {
         set: function (isEnabled) {
             if (isEnabled !== this.isHitTestEnabledProperty) {
                 this.isHitTestEnabledProperty = isEnabled;
-                this.webAssemblyContext3D.SCRTSetIsSelectionBufferEnabled(isEnabled);
                 this.invalidateElement();
             }
         },
@@ -456,7 +462,10 @@ var SciChart3DSurface = /** @class */ (function (_super) {
      * Called after the {@link SciChart3DSurface} has rendered.
      */
     SciChart3DSurface.prototype.onSciChartRendered = function () {
-        // TODO - event after rendered
+        this.chartModifiers.asArray().forEach(function (cm) {
+            cm.onParentSurfaceRendered();
+        });
+        this.rendered.raiseEvent();
     };
     /**
      * Called internally - the main drawing loop
@@ -480,10 +489,12 @@ var SciChart3DSurface = /** @class */ (function (_super) {
      * @inheritDoc
      */
     SciChart3DSurface.prototype.changeViewportSize = function (pixelWidth, pixelHeight) {
-        if (!pixelWidth || !pixelHeight) {
+        if (!pixelWidth || !pixelHeight || this.isDeleted) {
             return;
         }
-        this.viewportManager.setSize(pixelWidth, pixelHeight);
+        var backBufferWidth = pixelWidth * DpiHelper_1.DpiHelper.PIXEL_RATIO;
+        var backBufferHeight = pixelHeight * DpiHelper_1.DpiHelper.PIXEL_RATIO;
+        this.viewportManager.setSize(backBufferWidth, backBufferHeight);
         if (this.isCopyCanvasSurface) {
             this.changeMasterCanvasViewportSize(this.webAssemblyContext3D, pixelWidth, pixelHeight);
             if (this.domCanvas2D) {
@@ -493,6 +504,21 @@ var SciChart3DSurface = /** @class */ (function (_super) {
         else {
             this.changeWebGLCanvasViewportSize(this.webAssemblyContext3D, pixelWidth, pixelHeight);
         }
+        var svgRootElement = this.domSvgContainer;
+        if (svgRootElement) {
+            // Set width, height
+            svgRootElement.setAttribute("width", pixelWidth.toString());
+            svgRootElement.setAttribute("height", pixelHeight.toString());
+            // Set display width, height
+            svgRootElement.style.width = pixelWidth + "px";
+            svgRootElement.style.height = pixelHeight + "px";
+            // Set scaling so annotations, tooltips etc are in right position after DPI Scaling
+            svgRootElement.currentScale = 1;
+        }
+        if (this.domSvgAdornerLayer) {
+            this.domSvgAdornerLayer.setAttribute("width", pixelWidth.toString());
+            this.domSvgAdornerLayer.setAttribute("height", pixelHeight.toString());
+        }
         this.invalidateElement();
     };
     /**
@@ -577,6 +603,9 @@ var SciChart3DSurface = /** @class */ (function (_super) {
             this.webAssemblyContext3D.SCRT3DSetWaterMarkProperties(this.watermarkProperties);
         }
     };
+    SciChart3DSurface.prototype.getSeriesViewRectPadding = function (scaled) {
+        return Thickness_1.Thickness.fromNumber(0);
+    };
     SciChart3DSurface.prototype.applyOptions = function (options) {
         _super.prototype.applyOptions.call(this, options);
         this.camera = new CameraController_1.CameraController(this.webAssemblyContext3D, options === null || options === void 0 ? void 0 : options.cameraOptions);