scichart 2.2.2417 → 3.0.0-beta.224

package/Charting/Visuals/SciChartSurfaceBase.d.ts

@@ -28,6 +28,11 @@ export declare type TSciChartConfig = {
     testWasm?: TSciChart | TSciChart3D;
 };
 export interface ISurfaceOptionsBase {
+    /**
+     * Allows you to set custom Id for the surface;
+     * @remarks If skipped the Id will be auto-generated
+     */
+    id?: string;
     /**
      * Optional - The theme applied to the {@link SciChartSurface} on startup
      * @remarks see {@link IThemeProvider} for properties which can affect SciChart theme. Two default
@@ -124,7 +129,6 @@ export declare abstract class SciChartSurfaceBase implements ISciChartSurfaceBas
      */
     static setLicenseCallback(callback: (queryString: string) => Promise<Response>): void;
     static resolveOptions(options: ISurfaceOptionsBase): ISurfaceOptionsBase;
-    readonly id: string;
     /**
      * A propertyChanged EventHandler. See {@link EventHandler} for how to subscribe to and be
      * notified when a property changes on the {@link SciChartSurfaceBase}
@@ -176,8 +180,10 @@ export declare abstract class SciChartSurfaceBase implements ISciChartSurfaceBas
     protected isInitializedProperty: boolean;
     protected isDeletedProperty: boolean;
     protected backgroundProperty: string;
+    protected idProperty: string;
     protected widthAspect: number;
     protected heightAspect: number;
+    protected disableAspect: boolean;
     protected loaderJson: any;
     private readonly sharedWasmContext;
     private readonly suspendableIdProperty;
@@ -191,6 +197,14 @@ export declare abstract class SciChartSurfaceBase implements ISciChartSurfaceBas
      * @param canvases A list of {@link TSciChartSurfaceCanvases} to draw to
      */
     protected constructor(webAssemblyContext: TSciChart | TSciChart3D, canvases?: TSciChartSurfaceCanvases);
+    /**
+     * Gets or sets the SciChartSurface Id
+     */
+    get id(): string;
+    /**
+     * Gets or sets the SciChartSurface Id
+     */
+    set id(value: string);
     /**
      * Gets or sets the SciChartSurface Background as an HTML color code
      */
@@ -294,6 +308,7 @@ export declare abstract class SciChartSurfaceBase implements ISciChartSurfaceBas
      * @inheritDoc
      */
     onDpiChanged(args: TDpiChangedEventArgs): void;
+    get chartModifierGroups(): string[];
     protected applyOptions(options: I2DSurfaceOptions): void;
     /**
      * Detaches a {@link ChartModifierBase2D} from the {@link SciChartSurfaceBase}

package/Charting/Visuals/SciChartSurfaceBase.js

@@ -11,6 +11,7 @@ var ObservableArray_1 = require("../../Core/ObservableArray");
 var PropertyChangedEventArgs_1 = require("../../Core/PropertyChangedEventArgs");
 var WebGlHelper_1 = require("../../Core/WebGlHelper");
 var BaseType_1 = require("../../types/BaseType");
+var array_1 = require("../../utils/array");
 var guid_1 = require("../../utils/guid");
 var ChartModifierBase_1 = require("../ChartModifiers/ChartModifierBase");
 var SciChartJSDarkv2Theme_1 = require("../Themes/SciChartJSDarkv2Theme");
@@ -46,13 +47,14 @@ var SciChartSurfaceBase = /** @class */ (function () {
      * @param canvases A list of {@link TSciChartSurfaceCanvases} to draw to
      */
     function SciChartSurfaceBase(webAssemblyContext, canvases) {
-        var _this = this;
         if (canvases === void 0) { canvases = {}; }
-        this.id = (0, guid_1.generateGuid)();
+        var _this = this;
         this.themeProviderProperty = SciChartSurfaceBase.DEFAULT_THEME;
         this.previousThemeProviderProperty = SciChartSurfaceBase.DEFAULT_THEME;
         this.isInitializedProperty = false;
         this.isDeletedProperty = false;
+        this.backgroundProperty = SciChartSurfaceBase.DEFAULT_THEME.sciChartBackground;
+        this.idProperty = (0, guid_1.generateGuid)();
         this.suspendableIdProperty = (0, guid_1.generateGuid)();
         this.isAlphaEnabledProperty = true;
         this.deletables = [];
@@ -140,6 +142,22 @@ var SciChartSurfaceBase = /** @class */ (function () {
         }
         return options;
     };
+    Object.defineProperty(SciChartSurfaceBase.prototype, "id", {
+        /**
+         * Gets or sets the SciChartSurface Id
+         */
+        get: function () {
+            return this.idProperty;
+        },
+        /**
+         * Gets or sets the SciChartSurface Id
+         */
+        set: function (value) {
+            this.idProperty = value;
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(SciChartSurfaceBase.prototype, "background", {
         /**
          * Gets or sets the SciChartSurface Background as an HTML color code
@@ -334,9 +352,23 @@ var SciChartSurfaceBase = /** @class */ (function () {
     SciChartSurfaceBase.prototype.onDpiChanged = function (args) {
         this.invalidateElement();
     };
+    Object.defineProperty(SciChartSurfaceBase.prototype, "chartModifierGroups", {
+        get: function () {
+            var arr = this.chartModifiers
+                .asArray()
+                .filter(function (cm) { return cm.modifierGroup !== undefined; })
+                .map(function (el) { return el.modifierGroup; });
+            return (0, array_1.getUniqueValues)(arr);
+        },
+        enumerable: false,
+        configurable: true
+    });
     SciChartSurfaceBase.prototype.applyOptions = function (options) {
+        var _a;
+        this.idProperty = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : this.idProperty;
         this.widthAspect = options === null || options === void 0 ? void 0 : options.widthAspect;
         this.heightAspect = options === null || options === void 0 ? void 0 : options.heightAspect;
+        this.disableAspect = options === null || options === void 0 ? void 0 : options.disableAspect;
     };
     /**
      * Detaches a {@link ChartModifierBase2D} from the {@link SciChartSurfaceBase}

package/Charting/Visuals/TextureManager/CanvasTexture.js

@@ -68,7 +68,7 @@ var CanvasTexture = /** @class */ (function () {
      * Get an HTML5 {@link CanvasRenderingContext2D} to draw on.
      */
     CanvasTexture.prototype.getContext = function () {
-        return this.canvas.getContext("2d");
+        return this.canvas.getContext("2d", { willReadFrequently: true });
     };
     /**
      * Get the SciChart WebAssembly / WebGL {@link TSRTexture | Texture}

package/Charting/Visuals/TextureManager/DpiHelper.js

@@ -84,9 +84,6 @@ var DpiHelper = /** @class */ (function () {
             console.log("setWidth ".concat(canvas.id, " backBuffer=").concat(desiredWidth * DpiHelper.PIXEL_RATIO, " display=").concat(desiredWidth));
         }
         // https://www.khronos.org/webgl/wiki/HandlingHighDPI
-        //
-        // Display size set by style
-        canvas.style.width = desiredWidth + "px";
         // Size of drawingbuffer is set by width, height
         canvas.width = desiredWidth * DpiHelper.PIXEL_RATIO;
     };
@@ -100,9 +97,6 @@ var DpiHelper = /** @class */ (function () {
             console.log("setHeight ".concat(canvas.id, " backBuffer=").concat(desiredHeight * DpiHelper.PIXEL_RATIO, " display=").concat(desiredHeight));
         }
         // https://www.khronos.org/webgl/wiki/HandlingHighDPI
-        //
-        // Display size set by style
-        canvas.style.height = desiredHeight + "px";
         // Size of drawingbuffer is set by width, height
         canvas.height = desiredHeight * DpiHelper.PIXEL_RATIO;
     };
@@ -118,7 +112,9 @@ var DpiHelper = /** @class */ (function () {
         if (dpiScale === void 0) { dpiScale = DpiHelper.PIXEL_RATIO; }
         var dpiAdjusted = __assign({}, textStyle);
         dpiAdjusted.fontSize = Math.round(dpiAdjusted.fontSize * dpiScale);
-        dpiAdjusted.padding = DpiHelper.adjustThickness(textStyle.padding, dpiScale);
+        if (textStyle.padding) {
+            dpiAdjusted.padding = DpiHelper.adjustThickness(textStyle.padding, dpiScale);
+        }
         return dpiAdjusted;
     };
     DpiHelper.adjustStrokeSize = function (gridLineStyle, dpiScale) {

package/Charting/Visuals/TextureManager/TextureManager.d.ts

@@ -14,6 +14,17 @@ export declare class TextureManager implements IDeletable {
     private ctx;
     constructor(webAssemblyContext: TSciChart);
     createSimpleTextTexture(text: string, textStyle: TTextStyle, backgroundColor?: string, displayVertically?: boolean, displayMirrored?: boolean, opacity?: number): TTextureObject;
+    /**
+     * Create a text texture supporting multiline and arbitrary rotation
+     * @param text
+     * @param textStyle
+     * @param rotation
+     * @param lineSpacing Expressed as a fraction of the font size. Default 1.1
+     * @param backgroundColor
+     * @param opacity
+     * @returns
+     */
+    createTextTextureNative(text: string[], textStyle: TTextStyle, rotation?: number, lineSpacing?: number, backgroundColor?: string, opacity?: number): TTextureObject;
     /**
      * Create a text texture supporting multiline and arbitrary rotation
      * @param text

package/Charting/Visuals/TextureManager/TextureManager.js

@@ -5,6 +5,8 @@ var app_1 = require("../../../constants/app");
 var AxisAlignment_1 = require("../../../types/AxisAlignment");
 var LabelAlignment_1 = require("../../../types/LabelAlignment");
 var font_1 = require("../../../utils/font");
+var parseColor_1 = require("../../../utils/parseColor");
+var NativeObject_1 = require("../Helpers/NativeObject");
 var DpiHelper_1 = require("./DpiHelper");
 /** @ignore */
 var DEFAULT_HEIGHT = 1080;
@@ -21,7 +23,7 @@ var TextureManager = /** @class */ (function () {
             this.canvas = document.createElement("canvas");
             this.canvas.width = DEFAULT_WIDTH;
             this.canvas.height = DEFAULT_HEIGHT;
-            this.ctx = this.canvas.getContext("2d");
+            this.ctx = this.canvas.getContext("2d", { willReadFrequently: true });
         }
     }
     TextureManager.prototype.createSimpleTextTexture = function (text, textStyle, backgroundColor, displayVertically, displayMirrored, opacity) {
@@ -36,6 +38,32 @@ var TextureManager = /** @class */ (function () {
         }
         return this.createTextTexture([text], textStyle, rotation, undefined, backgroundColor, opacity);
     };
+    /**
+     * Create a text texture supporting multiline and arbitrary rotation
+     * @param text
+     * @param textStyle
+     * @param rotation
+     * @param lineSpacing Expressed as a fraction of the font size. Default 1.1
+     * @param backgroundColor
+     * @param opacity
+     * @returns
+     */
+    TextureManager.prototype.createTextTextureNative = function (text, textStyle, rotation, lineSpacing, backgroundColor, opacity) {
+        var fontStyle = textStyle.fontStyle, fontWeight = textStyle.fontWeight, fontFamily = textStyle.fontFamily, fontSizePx = textStyle.fontSize, padding = textStyle.padding, alignment = textStyle.alignment, color = textStyle.color;
+        var nativeContext = this.webAssemblyContext.SCRTGetMainRenderContext2D();
+        // TODO support rotation, spacing and alignment
+        var fontKey = (0, NativeObject_1.getFontKey)(this.webAssemblyContext, { fontFamily: fontFamily, fontSize: fontSizePx !== null && fontSizePx !== void 0 ? fontSizePx : 12 });
+        var bgColor = backgroundColor ? (0, parseColor_1.parseColorToUIntArgb)(backgroundColor) : 0;
+        var bitmapTexture = nativeContext.CreateTextTextureColored(fontKey, text.join("\n"), (0, parseColor_1.parseColorToUIntArgb)(color), bgColor);
+        this.webAssemblyContext.SCRTSetTextureLinearSamplerEnabled(bitmapTexture, false);
+        var textureWidth = bitmapTexture.GetWidth();
+        var textureHeight = bitmapTexture.GetHeight();
+        return {
+            bitmapTexture: bitmapTexture,
+            textureWidth: textureWidth,
+            textureHeight: textureHeight
+        };
+    };
     /**
      * Create a text texture supporting multiline and arbitrary rotation
      * @param text
@@ -47,6 +75,9 @@ var TextureManager = /** @class */ (function () {
      * @returns
      */
     TextureManager.prototype.createTextTexture = function (text, textStyle, rotation, lineSpacing, backgroundColor, opacity) {
+        if (app_1.IS_TEST_ENV) {
+            return { bitmapTexture: undefined, textureWidth: 1, textureHeight: 1 };
+        }
         var fontStyle = textStyle.fontStyle, fontWeight = textStyle.fontWeight, fontFamily = textStyle.fontFamily, fontSizePx = textStyle.fontSize, padding = textStyle.padding, alignment = textStyle.alignment, color = textStyle.color;
         this.ctx.globalAlpha = opacity !== null && opacity !== void 0 ? opacity : 1;
         this.ctx.textBaseline = "top";
@@ -168,12 +199,15 @@ var TextureManager = /** @class */ (function () {
         return this.createTextureFromCtxBuffer(width, height);
     };
     TextureManager.prototype.getTextureContext = function (width, height) {
+        if (app_1.IS_TEST_ENV)
+            return undefined;
         if (width > this.canvas.width) {
             this.canvas.width = width;
         }
         if (height > this.canvas.height) {
             this.canvas.height = height;
         }
+        // TODO it's not clear if this is actually required, and it's slow.
         this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
         return this.ctx;
     };
@@ -263,6 +297,8 @@ exports.TextureManager = TextureManager;
 var measureTextHeight = function (fontSizePx) { return fontSizePx; };
 exports.measureTextHeight = measureTextHeight;
 var measureTextWidth = function (ctx, text) {
+    if (app_1.IS_TEST_ENV)
+        return 1;
     var textMeasure = ctx.measureText(text);
     return Math.ceil(textMeasure.width);
 };

package/Charting/Visuals/createMaster.js

@@ -195,16 +195,6 @@ var createMaster = function () {
                     if (dest) {
                         dest.sciChartSurface.renderSurface.onRenderTimeElapsed();
                     }
-                    // sciChartDestinations.forEach((dest, index) => {
-                    //     const { canvasElementId, sciChartSurface } = dest;
-                    //     const chart = wasmContext.SCRTGetGlobalSampleChartInterface();
-                    //     if (chart.GetCurrentDestination()) {
-                    //         const currDestID = chart.GetCurrentDestination().GetID();
-                    //         if (currDestID === canvasElementId) {
-                    //             (sciChartSurface as SciChartSurface).renderSurface.onRenderTimeElapsed();
-                    //         }
-                    //     }
-                    // });
                 },
                 Update: function (deltaTime) {
                     // Logger.log("sciChartInitCommon.ts Update");
@@ -214,6 +204,8 @@ var createMaster = function () {
                 }
             };
             var chartInitObj = wasmContext.SCRTSampleChartInterface.implement(chartInitializer);
+            var frameRenderer2D = new wasmContext.SCRTFrameRenderer2D();
+            chartInitObj.SetFrameRenderer(frameRenderer2D);
             wasmContext.SCRTSetGlobalSampleChartInterface(chartInitObj);
             /// create an object that native side can trigger the copy to from...
             var canvasCopyObj = wasmContext.SCRTCopyToDestinationInterface.implement({
@@ -221,6 +213,11 @@ var createMaster = function () {
             });
             wasmContext.SCRTSetGlobalCopyToDestinationInterface(canvasCopyObj);
             wasmContext.TSRSetDrawRequestsEnabled(true);
+            // SCJS-1321 fixes cutting 3d chart issue. 3D wasm and vice versa doesn't know about domMasterCanvas width/height
+            // when creating one 3d chart and one 2d chart on the same screen. So we tell the other wasm about existing master canvas size
+            if (SciChartSurfaceBase_1.SciChartSurfaceBase.domMasterCanvas) {
+                wasmContext.TSRSetMainWindowSize(SciChartSurfaceBase_1.SciChartSurfaceBase.domMasterCanvas.width, SciChartSurfaceBase_1.SciChartSurfaceBase.domMasterCanvas.height);
+            }
             // @ts-ignore
             wasmContext.callMain();
         })

package/Charting/Visuals/createSingle.js

@@ -86,6 +86,8 @@ var initDrawEngineSingleChart = function (wasmContext, canvases, resolve, theme)
         }
     };
     var chartInitObj = wasmContext.SCRTSampleChartInterface.implement(chartInitializer);
+    var frameRenderer2D = new wasmContext.SCRTFrameRenderer2D();
+    chartInitObj.SetFrameRenderer(frameRenderer2D);
     chartInitObj.SetFPSCounterEnabled(false);
     wasmContext.SCRTSetGlobalSampleChartInterface(chartInitObj);
     // @ts-ignore

package/Charting/Visuals/licenseManager2D.js

@@ -311,6 +311,8 @@ var dolicenseChallenge = function (licenseContext, sciChartSurface) { return __a
                     expirySeconds = setChallengeResponse(token, licenseContext);
                     if (expirySeconds > 0) {
                         key = (0, exports.getLicenseCookie)().key;
+                        if (!key)
+                            key = getRuntimeLicenseKey();
                         timeNow = Math.floor(new Date().getTime() / 1000);
                         setLicenseCookie(key, token, expirySeconds, timeNow);
                         debug("License validated");
@@ -352,14 +354,13 @@ var dolicenseChallenge = function (licenseContext, sciChartSurface) { return __a
                     checkStatus = licensingClasses_1.LicenseCheckStatus.NoLicense;
                     licenseContext.SCRTCredentials.ResetRuntimeLicense();
                     isRuntimeKey = false;
-                    (0, exports.applyLicense)(licenseContext, sciChartSurface);
-                    // licenseManager2dState.setIsDev(true);
-                    // checkStatus = LicenseCheckStatus.LookingForLicenseWizard;
-                    // getlicenseFromWizard();
-                    // if (licenseContext2D !== undefined) {
-                    //     updateLicenseDisplay(getLicenseInfo(licenseContext2D), sciChartSurface2D, true, false);
-                    // }
-                    // callbacks3D.updateLicenseDisplay3D();
+                    licenseManager2dState_1.licenseManager2dState.setIsDev(true);
+                    checkStatus = licensingClasses_1.LicenseCheckStatus.LookingForLicenseWizard;
+                    getlicenseFromWizard(licenseContext, sciChartSurface);
+                    if (licenseContext2D !== undefined) {
+                        (0, exports.updateLicenseDisplay)((0, exports.getLicenseInfo)(licenseContext2D), sciChartSurface2D, true, false);
+                    }
+                    callbacks3D.updateLicenseDisplay3D();
                     return [2 /*return*/];
                 }
                 // Failed to connect.  Retry
@@ -528,7 +529,6 @@ var applyLicense = function (licenseContext, sciChartSurface) {
             }
             else if (checkStatus === licensingClasses_1.LicenseCheckStatus.NoLicense) {
                 checkStatus = licensingClasses_1.LicenseCheckStatus.ValidatingDeveloperLicense;
-                setLicenseCookie(licenseKey, "", 0, 0);
                 dolicenseChallenge(licenseContext, sciChartSurface);
             }
         }

package/Charting/Visuals/sciChartInitCommon.js

@@ -9,6 +9,7 @@ var ECanvasType;
     ECanvasType[ECanvasType["canvas2D"] = 1] = "canvas2D";
     ECanvasType[ECanvasType["svg"] = 2] = "svg";
 })(ECanvasType || (ECanvasType = {}));
+var DEFAULT_ASPECT_RATIO = 1.5;
 var getCanvas2dId = function (divElementId) { return "".concat(divElementId, "_2D"); };
 var getCanvasSizes = function (divWidth, divHeight, maxHeight, aspectWidth, aspectHeight) {
     if (aspectWidth === void 0) { aspectWidth = 0; }
@@ -22,7 +23,7 @@ var getCanvasSizes = function (divWidth, divHeight, maxHeight, aspectWidth, aspe
         aspectRatio = undefined;
     }
     else {
-        aspectRatio = 3 / 2;
+        aspectRatio = DEFAULT_ASPECT_RATIO;
     }
     var width = Math.round(divWidth || 600);
     if (aspectRatio) {
@@ -82,6 +83,11 @@ var initCanvas = function (divElement, aspectWidth, aspectHeight, activeCanvas,
     var divWidth = chartRoot.offsetWidth, divHeight = chartRoot.offsetHeight;
     var maxHeight = getMaxHeight(chartRoot);
     var _a = getCanvasSizes(divWidth, divHeight, maxHeight, aspectWidth, aspectHeight), width = _a.width, height = _a.height, aspectRatio = _a.aspectRatio;
+    // if aspect ration is defined we use is to calc height
+    if (!disableAspect && aspectRatio) {
+        // @ts-ignore
+        chartRoot.style.aspectRatio = "".concat(aspectRatio);
+    }
     // set canvasSize for parent div because of all children in absolute
     var canvasWebGL;
     if (activeCanvas === ECanvasType.canvasWebGL) {
@@ -90,6 +96,8 @@ var initCanvas = function (divElement, aspectWidth, aspectHeight, activeCanvas,
         canvasWebGL.id = "".concat(divElementId, "_WebGL");
         canvasWebGL.style.position = "absolute";
         canvasWebGL.style.display = "block";
+        canvasWebGL.style.width = "100%";
+        canvasWebGL.style.height = "100%";
         var gl = WebGlHelper_1.WebGlHelper.getContext(canvasWebGL, {
             premultipliedAlpha: true,
             antialias: SciChartSurfaceBase_1.SciChartSurfaceBase.AntiAliasWebGlBackbuffer
@@ -99,6 +107,8 @@ var initCanvas = function (divElement, aspectWidth, aspectHeight, activeCanvas,
     // 2D Canvas
     var canvas2D = document.createElement("canvas");
     canvas2D.id = getCanvas2dId(divElementId);
+    canvas2D.style.width = "100%";
+    canvas2D.style.height = "100%";
     DpiHelper_1.DpiHelper.setSize(canvas2D, width, height);
     canvas2D.style.position = "absolute";
     if (activeCanvas !== ECanvasType.canvas2D) {
@@ -121,6 +131,8 @@ var initCanvas = function (divElement, aspectWidth, aspectHeight, activeCanvas,
     svgRootElement.setAttribute("xmlns", "http://www.w3.org/2000/svg");
     svgRootElement.style.position = "absolute";
     svgRootElement.style.display = "block";
+    svgRootElement.style.width = "100%";
+    svgRootElement.style.height = "100%";
     if (activeCanvas !== ECanvasType.svg) {
         svgRootElement.style.pointerEvents = "none";
     }
@@ -135,12 +147,14 @@ var initCanvas = function (divElement, aspectWidth, aspectHeight, activeCanvas,
     svgAdornerLayer.style.position = "absolute";
     svgAdornerLayer.style.display = "block";
     svgAdornerLayer.style.pointerEvents = "none";
+    svgAdornerLayer.style.width = "100%";
+    svgAdornerLayer.style.height = "100%";
     chartRoot.appendChild(svgAdornerLayer);
     // Root Div Element
     var divRootElement = document.createElement("div");
     divRootElement.id = "".concat(divElementId, "_div");
     divRootElement.style.width = "100%";
-    divRootElement.style.height = "".concat(height, "px");
+    divRootElement.style.height = "100%";
     divRootElement.style.position = "relative";
     divRootElement.style.pointerEvents = "none";
     divRootElement.style.textAlign = "center";
@@ -186,16 +200,6 @@ var subscribeToResize = function (chartRoot, aspect, sciChartSurface, disableAsp
                 console.error("ResizeObserver is not supported");
                 newWidth = 900;
             }
-            // if aspect ration is defined we use is to calc height
-            if (!disableAspect) {
-                if (aspect) {
-                    newHeight = Math.round(newWidth / aspect);
-                }
-                else if (!newHeight) {
-                    // hardcoded aspect ration if newHeight is not defined
-                    newHeight = (newWidth * 2) / 3;
-                }
-            }
             // check max-height
             var maxHeight = getMaxHeight(chartRoot);
             if (maxHeight && newHeight > maxHeight) {

package/Charting3D/CameraController.d.ts

@@ -32,6 +32,10 @@ export interface ICameraOptions {
      * Gets or sets the camera target (Look-at) as a {@link Vector3} in World Space
      */
     target?: Vector3;
+    /**
+     * When true, will output position, target to console
+     */
+    debugPositions?: boolean;
 }
 /**
  * Defines the interface to a {@link CameraController} - a Class which manipulates and manages
@@ -169,6 +173,7 @@ export declare class CameraController implements ICameraController {
     private projectionModeProperty;
     private targetProperty;
     private readonly webAssemblyContext;
+    private debugPositionsProperty;
     /**
      * Creates an instance of the {@link CameraController}
      * @param webAssemblyContext The {@link TSciChart3D | SciChart 3D WebAssembly Context}

package/Charting3D/CameraController.js

@@ -29,6 +29,7 @@ var CameraController = /** @class */ (function () {
      * @param options optional parameters of type {@link ICameraOptions} passed to the constructor
      */
     function CameraController(webAssemblyContext, options) {
+        var _a;
         this.aspectRatioProperty = 1.5;
         this.farClipProperty = 4000;
         this.fieldOfViewProperty = 60;
@@ -46,6 +47,7 @@ var CameraController = /** @class */ (function () {
         this.position = (options === null || options === void 0 ? void 0 : options.position) || this.position;
         this.target = (options === null || options === void 0 ? void 0 : options.target) || this.target;
         this.id = (options === null || options === void 0 ? void 0 : options.id) || this.id;
+        this.debugPositionsProperty = (_a = options === null || options === void 0 ? void 0 : options.debugPositions) !== null && _a !== void 0 ? _a : false;
     }
     Object.defineProperty(CameraController.prototype, "id", {
         /**
@@ -496,6 +498,10 @@ var CameraController = /** @class */ (function () {
      */
     CameraController.prototype.notifyPropertyChanged = function (propertyName) {
         var _a;
+        if (this.debugPositionsProperty &&
+            (propertyName === Constants_1.PROPERTY.CAMERA_POSITION || propertyName === Constants_1.PROPERTY.CAMERA_TARGET)) {
+            console.log("SciChart.js Camera P=".concat(this.position.toString(), ", T=").concat(this.target.toString()));
+        }
         (_a = this.propertyChanged) === null || _a === void 0 ? void 0 : _a.raiseEvent(new PropertyChangedEventArgs_1.PropertyChangedEventArgs(propertyName));
     };
     /**

package/Charting3D/ChartModifiers/ResetCamera3DModifier.js

@@ -43,8 +43,9 @@ var ResetCamera3DModifier = /** @class */ (function (_super) {
      * @param options optional parameters of type {@link IResetCamera3DOptions} used to configure the modifier
      */
     function ResetCamera3DModifier(options) {
+        var _this = this;
         var _a, _b, _c;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /**
          * When true, the Zoom operations are animated. See also {@link animationDuration} and {@link easingFunction}
          */

package/Charting3D/Visuals/Axis/AxisBase3D.js

@@ -425,11 +425,13 @@ var AxisBase3D = /** @class */ (function (_super) {
     };
     AxisBase3D.prototype.getTicks = function () {
         var maxAutoTicks = this.getMaxAutoTicks();
-        var delta = this.deltaCalculator.getDeltaFromRange(this.visibleRange.min, this.visibleRange.max, this.minorsPerMajor, maxAutoTicks);
-        this.minorDeltaProperty = delta.min;
-        this.majorDeltaProperty = delta.max;
-        var majorTicks = this.tickProvider.getMajorTicks(delta.min, delta.max, this.visibleRange);
-        var minorTicks = this.tickProvider.getMinorTicks(delta.min, delta.max, this.visibleRange);
+        if (this.autoTicks) {
+            var delta = this.deltaCalculator.getDeltaFromRange(this.visibleRange.min, this.visibleRange.max, this.minorsPerMajor, maxAutoTicks);
+            this.minorDeltaProperty = delta.min;
+            this.majorDeltaProperty = delta.max;
+        }
+        var majorTicks = this.tickProvider.getMajorTicks(this.minorDeltaProperty, this.majorDeltaProperty, this.visibleRange);
+        var minorTicks = this.tickProvider.getMinorTicks(this.minorDeltaProperty, this.majorDeltaProperty, this.visibleRange);
         return {
             majorTicks: majorTicks,
             minorTicks: minorTicks

package/Charting3D/Visuals/Axis/NumericAxis3D.js

@@ -43,8 +43,9 @@ var NumericAxis3D = /** @class */ (function (_super) {
      * @param options optional parameters of type {@link INumericAxis3dOptions} to configure the axis
      */
     function NumericAxis3D(webAssemblyContext, options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, webAssemblyContext, options) || this;
+        _this = _super.call(this, webAssemblyContext, options) || this;
         /**
          * @inheritDoc
          */

package/Charting3D/Visuals/Primitives/ScatterPointsSceneEntity.d.ts

@@ -27,6 +27,10 @@ export declare class ScatterPointsSceneEntity extends RenderableSeriesSceneEntit
      * @inheritDoc
      */
     delete(): void;
+    /**
+     * @inheritDoc
+     */
+    Render(): void;
     /**
      * @inheritDoc
      */

package/Charting3D/Visuals/Primitives/ScatterPointsSceneEntity.js

@@ -54,6 +54,13 @@ var ScatterPointsSceneEntity = /** @class */ (function (_super) {
         this.pointScales = (0, Deleter_1.deleteSafe)(this.pointScales);
         _super.prototype.delete.call(this);
     };
+    /**
+     * @inheritDoc
+     */
+    ScatterPointsSceneEntity.prototype.Render = function () {
+        this.nativeEntity.SetOpacity(this.parentSeries.opacity);
+        _super.prototype.Render.call(this);
+    };
     /**
      * @inheritDoc
      */

package/Charting3D/Visuals/Primitives/SurfaceMeshSceneEntity.js

@@ -50,8 +50,8 @@ function debugProps(props) {
     // console.log(` m_fShininess ${props.m_fShininess}`);
     // console.log(` m_fHighlight ${props.m_fHighlight}`);
     // console.log(` m_fHardNormals ${props.m_fHardNormals}`);
-    // console.log(` m_vContourColor ${toString(props.m_vContourColor)}`);
-    // console.log(` m_vWireframeStroke ${toString(props.m_vWireframeStroke)}`);
+    // // console.log(` m_vContourColor ${toString(props.m_vContourColor)}`);
+    // // console.log(` m_vWireframeStroke ${toString(props.m_vWireframeStroke)}`);
     // console.log(` m_fContourOffset ${props.m_fContourOffset}`);
     // console.log(` m_fContourInterval ${props.m_fContourInterval}`);
     // console.log(` m_fContourThickness ${props.m_fContourThickness}`);
@@ -116,8 +116,9 @@ var SurfaceMeshSceneEntity = /** @class */ (function (_super) {
      * @param parentSeries The parent {@link BaseRenderableSeries3D} which this entity maps to
      */
     function SurfaceMeshSceneEntity(webAssemblyContext, parentSeries) {
+        var _this = this;
         var _a;
-        var _this = _super.call(this, webAssemblyContext, parentSeries, new SurfaceMeshSceneEntityState()) || this;
+        _this = _super.call(this, webAssemblyContext, parentSeries, new SurfaceMeshSceneEntityState()) || this;
         /**
          * @inheritDoc
          */
@@ -157,6 +158,8 @@ var SurfaceMeshSceneEntity = /** @class */ (function (_super) {
             console.log("Cannot draw a SurfaceMeshRenderableSeries3D without a meshColorPalette or dataSeries!");
             return;
         }
+        // Set opacity
+        this.nativeEntity.SetOpacity(this.parentSeries.opacity);
         // Setup Properties for grid mesh
         //
         var props;
@@ -215,7 +218,6 @@ var SurfaceMeshSceneEntity = /** @class */ (function (_super) {
             props.m_fHighlight = this.parentSeries.highlight;
             props.m_fShininess = this.parentSeries.shininess;
             props.m_fLightingAmount = this.parentSeries.lightingFactor;
-            // console.log("..setting GridDrawingProps");
             debugProps(props);
             this.nativeEntity.SetGridDrawingProperties(props);
         }

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

@@ -91,7 +91,7 @@ export interface IBaseRenderableSeries3DOptions {
      */
     readonly id?: string;
     /**
-     * The {@link BaseDataSeries3D | DataSeries} which provides a datasource for this {@link BaseRenderableSeries3D} to draw
+     * The {@link BaseDataSeries3D | DataSeries} which provides a datasource for this {@link IRenderableSeries3D} to draw
      */
     dataSeries?: BaseDataSeries3D;
     /**
@@ -100,7 +100,7 @@ export interface IBaseRenderableSeries3DOptions {
      */
     pointMarker?: BasePointMarker3D;
     /**
-     * Gets or sets whether the {@link BaseDataSeries3D} is visible or not
+     * Gets or sets whether the {@link IRenderableSeries3D} is visible or not
      */
     isVisible?: boolean;
     /**
@@ -111,6 +111,11 @@ export interface IBaseRenderableSeries3DOptions {
      * Gets or sets an optional Shininess factor, passed to 3D rendering shaders to make shiny objects
      */
     shininess?: number;
+    /**
+     * Gets or sets the opacity of the {@link IRenderableSeries3D}
+     * @remarks Value range 0.0 to 1.0. Default = 1.
+     */
+    opacity?: number;
 }
 /**
  * @summary Defines the base class to a 3D Render Series (or 3D Chart Type) in SciChart's High Performance Real-time

package/Charting3D/Visuals/RenderableSeries/BaseRenderableSeries3D.js

@@ -23,14 +23,15 @@ var BaseRenderableSeries3D = /** @class */ (function () {
      * @protected
      */
     function BaseRenderableSeries3D(webAssemblyContext, options) {
-        var _a;
+        var _a, _b;
         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.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) || 64;
+        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);
     }