scichart 3.0.0-beta.230 → 3.0.0-beta.235

package/Charting/ChartModifiers/OverviewRangeSelectionModifier.d.ts

@@ -47,10 +47,6 @@ export declare class OverviewRangeSelectionModifier extends ChartModifierBase2D
      * @inheritDoc
      */
     onAttach(): void;
-    /**
-     * @inheritDoc
-     */
-    onDetach(): void;
     /**
      * @inheritDoc
      */
@@ -81,5 +77,4 @@ export declare class OverviewRangeSelectionModifier extends ChartModifierBase2D
     set selectedArea(value: NumberRange);
     createAnnotation(options: ICustomResizableAnnotationOptions): OverviewCustomResizableAnnotation;
     protected updateSelectionAnnotation(): void;
-    private xVisibleRangeChangeHandler;
 }

package/Charting/ChartModifiers/OverviewRangeSelectionModifier.js

@@ -67,7 +67,6 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         _this.onSelectedAreaChanged = options === null || options === void 0 ? void 0 : options.onSelectedAreaChanged;
         _this.xAxisId = (_a = options === null || options === void 0 ? void 0 : options.xAxisId) !== null && _a !== void 0 ? _a : _this.xAxisId;
         _this.yAxisId = (_b = options === null || options === void 0 ? void 0 : options.yAxisId) !== null && _b !== void 0 ? _b : _this.yAxisId;
-        _this.xVisibleRangeChangeHandler = _this.xVisibleRangeChangeHandler.bind(_this);
         return _this;
     }
     /**
@@ -77,13 +76,6 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
         _super.prototype.onAttach.call(this);
         this.updateSelectionAnnotation();
     };
-    /**
-     * @inheritDoc
-     */
-    OverviewRangeSelectionModifier.prototype.onDetach = function () {
-        var xAxis = this.parentSurface.getXAxisById(this.xAxisId);
-        xAxis.visibleRangeChanged.unsubscribe(this.xVisibleRangeChangeHandler);
-    };
     /**
      * @inheritDoc
      */
@@ -251,25 +243,32 @@ var OverviewRangeSelectionModifier = /** @class */ (function (_super) {
             this.rangeSelectionAnnotationProperty = dragBox;
             this.annotationBeforeSelectedAreaProperty = annotationBeforeSelectedArea;
             this.annotationAfterSelectedAreaProperty = annotationAfterSelectedArea;
-            xAxis.visibleRangeChanged.subscribe(this.xVisibleRangeChangeHandler);
         }
     };
-    OverviewRangeSelectionModifier.prototype.xVisibleRangeChangeHandler = function (args) {
-        this.annotationBeforeSelectedAreaProperty.x1 = args.visibleRange.min;
-        this.annotationAfterSelectedAreaProperty.x2 = args.visibleRange.max;
-    };
     return OverviewRangeSelectionModifier;
 }(ChartModifierBase2D_1.ChartModifierBase2D));
 exports.OverviewRangeSelectionModifier = OverviewRangeSelectionModifier;
 /** @ignore */
 var horizontalAdornerSvgTemplate = function (x1, y1, x2, y2) {
     var colorLine = "black";
-    return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"".concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y1, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x2, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y2, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x1, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <rect x=\"").concat(x1 - 3, "\" y=\"30%\" width=\"7\" height=\"40%\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        <rect x=\"").concat(x2 - 3, "\" y=\"30%\" width=\"7\" height=\"40%\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        </svg>");
+    var gridpHandleFill = "#2e2e2e";
+    var gripHandleHalfWidth = 3;
+    var gripHandleHeight = "40%";
+    var gripHandleYCoord = "30%";
+    var width = x2 - x1;
+    var height = y2 - y1;
+    return "<svg x=\"".concat(x1, "\" y=\"").concat(y1, "\" width=\"").concat(width, "px\" height=\"").concat(height, "px\" viewBox=\"0 0 ").concat(width, " ").concat(height, "\" overflow=\"visible\" xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"0\" y1=\"0\" x2=\"").concat(width, "\" y2=\"0\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"0\" y1=\"").concat(height, "\" x2=\"").concat(width, "\" y2=\"").concat(height, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"0\" y1=\"0\" x2=\"0\" y2=\"").concat(height, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(width, "\" y1=\"0\" x2=\"").concat(width, "\" y2=\"").concat(height, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <rect x=\"").concat(0 - gripHandleHalfWidth, "\" y=\"").concat(gripHandleYCoord, "\" width=\"7\" height=\"").concat(gripHandleHeight, "\" fill=\"").concat(gridpHandleFill, "\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        <rect x=\"").concat(width - gripHandleHalfWidth, "\" y=\"").concat(gripHandleYCoord, "\" width=\"7\" height=\"").concat(gripHandleHeight, "\" fill=\"").concat(gridpHandleFill, "\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        </svg>");
 };
 /** @ignore */
 var verticalAdornerSvgTemplate = function (x1, y1, x2, y2) {
     var colorLine = "black";
-    return "<svg xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"".concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y1, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x2, "\" y1=\"").concat(y1, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y2, "\" x2=\"").concat(x2, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(x1, "\" y1=\"").concat(y1, "\" x2=\"").concat(x1, "\" y2=\"").concat(y2, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <rect x=\"30%\" y=\"").concat(y1 - 3, "\" width=\"40%\" height=\"7\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        <rect x=\"30%\" y=\"").concat(y2 - 3, "\" width=\"40%\" height=\"7\" fill=\"#2e2e2e\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        </svg>");
+    var gridpHandleFill = "#2e2e2e";
+    var gripHandleWidth = "40%";
+    var gripHandleHalfHeight = 3;
+    var gripHandleXCoord = "30%";
+    var width = x2 - x1;
+    var height = y2 - y1;
+    return "<svg x=\"".concat(x1, "\" y=\"").concat(y1, "\" width=\"").concat(width, "px\" height=\"").concat(height, "px\" viewBox=\"0 0 ").concat(width, " ").concat(height, "\" overflow=\"visible\" xmlns=\"http://www.w3.org/2000/svg\">\n        <line x1=\"0\" y1=\"0\" x2=\"").concat(width, "\" y2=\"0\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"0\" y1=\"").concat(height, "\" x2=\"").concat(width, "\" y2=\"").concat(height, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"0\" y1=\"0\" x2=\"0\" y2=\"").concat(height, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <line x1=\"").concat(width, "\" y1=\"0\" x2=\"").concat(width, "\" y2=\"").concat(height, "\" stroke=\"").concat(colorLine, "\" stroke-width=\"1\" />\n        <rect x=\"").concat(gripHandleXCoord, "\" y=\"").concat(0 - gripHandleHalfHeight, "\" width=\"").concat(gripHandleWidth, "\" height=\"7\" fill=\"").concat(gridpHandleFill, "\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        <rect x=\"").concat(gripHandleXCoord, "\" y=\"").concat(height - gripHandleHalfHeight, "\" width=\"").concat(gripHandleWidth, "\" height=\"7\" fill=\"").concat(gridpHandleFill, "\" rx=\"5\" stroke=\"").concat(colorLine, "\" />\n        </svg>");
 };
 var defaultSelectionAnnotationSvgString = "<svg width=\"50\" height=\"50\" preserveAspectRatio=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <rect width=\"100%\" height=\"100%\" style=\"fill:transparent\">\n    </rect>\n</svg>";
 var defaultUnSelectedAnnotationSvgString = "<svg width=\"50\" height=\"50\" preserveAspectRatio=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n        <rect width=\"100%\" height=\"100%\" style=\"fill:black\">\n        </rect>\n    </svg>";

package/Charting/Services/SciChartRenderer.js

@@ -239,6 +239,18 @@ var SciChartRenderer = /** @class */ (function () {
         // Is XAxes and YAxes collection null or empty
         // is XAxis a CategoryAxis and renderableseries is null or empty
         // Do all renderableseries have dataseries
+        var errors = [];
+        if (this.sciChartSurface.renderableSeries.size() > 0) {
+            if (this.sciChartSurface.xAxes.size() === 0) {
+                errors.push("Chart must have at least one X axis");
+            }
+            if (this.sciChartSurface.yAxes.size() === 0) {
+                errors.push("Chart must have at least one Y axis");
+            }
+        }
+        if (errors.length > 0) {
+            throw new Error(errors.join("\n"));
+        }
     };
     SciChartRenderer.prototype.updateSvgCanvasSize = function (seriesViewRect) {
         // Convert seriesViewRect back to device pixels

package/Charting/Visuals/Annotations/NativeTextAnnotation.js

@@ -303,7 +303,7 @@ var NativeTextAnnotation = /** @class */ (function (_super) {
         var y1 = this.getY1Coordinate(xCalc, yCalc);
         var style = {
             fontFamily: this.fontFamily,
-            fontSize: this.fontSize
+            fontSize: Math.round(this.fontSize * DpiHelper_1.DpiHelper.PIXEL_RATIO)
         };
         var colorNum = (0, parseColor_1.parseColorToUIntArgb)(this.textColor);
         colorNum = (0, colorUtil_1.uintArgbColorOverrideOpacity)(colorNum, this.opacity);

package/Charting/Visuals/SciChartOverview.d.ts

@@ -32,10 +32,10 @@ export declare class SciChartOverview implements IDeletable, IThemeable {
      * Creates a {@link SciChartOverview} 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 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 overviewRootElementId The Div Element ID or reference where the {@link SciChartSurface} of the {@link SciChartOverview} will reside
      * @param options Optional - Optional parameters for chart creation. See {@link IOverviewOptions for more details}
      */
-    static create(parentChart: SciChartSurface, overviewRootElementId: string, options?: IOverviewOptions): Promise<SciChartOverview>;
+    static create(parentChart: SciChartSurface, overviewRootElement?: string | HTMLDivElement, options?: IOverviewOptions): Promise<SciChartOverview>;
     private readonly overviewXAxisProperty;
     private readonly overviewYAxisProperty;
     private readonly rangeSelectionModifierProperty;

package/Charting/Visuals/SciChartOverview.js

@@ -79,15 +79,15 @@ var SciChartOverview = /** @class */ (function () {
      * Creates a {@link SciChartOverview} 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 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 overviewRootElementId The Div Element ID or reference where the {@link SciChartSurface} of the {@link SciChartOverview} will reside
      * @param options Optional - Optional parameters for chart creation. See {@link IOverviewOptions for more details}
      */
-    SciChartOverview.create = function (parentChart, overviewRootElementId, options) {
+    SciChartOverview.create = function (parentChart, overviewRootElement, options) {
         return __awaiter(this, void 0, void 0, function () {
             var _a, sciChartSurface, wasmContext, rangeSelectionModifier, xAxis, yAxis;
             return __generator(this, function (_b) {
                 switch (_b.label) {
-                    case 0: return [4 /*yield*/, createSciChartOverview(parentChart, overviewRootElementId, options)];
+                    case 0: return [4 /*yield*/, createSciChartOverview(parentChart, overviewRootElement, options)];
                     case 1:
                         _a = _b.sent(), sciChartSurface = _a.sciChartSurface, wasmContext = _a.wasmContext, rangeSelectionModifier = _a.rangeSelectionModifier, xAxis = _a.xAxis, yAxis = _a.yAxis;
                         return [2 /*return*/, new SciChartOverview(parentChart, sciChartSurface, wasmContext, rangeSelectionModifier, xAxis, yAxis)];
@@ -158,13 +158,13 @@ var SciChartOverview = /** @class */ (function () {
 }());
 exports.SciChartOverview = SciChartOverview;
 /** @ignore */
-var createSciChartOverview = function (originalSciChartSurface, overviewRootElementId, options) { return __awaiter(void 0, void 0, void 0, function () {
+var createSciChartOverview = function (originalSciChartSurface, overviewRootElement, options) { return __awaiter(void 0, void 0, void 0, function () {
     var _a, wasmContext, sciChartSurface, mainAxisId, secondaryAxisId, originalMainAxis, originalSecondaryAxis, originalXAxis, originalYAxis, xAxisOptions, yAxisOptions, xAxis, yAxis, mainOverviewAxis, defaultTransform, renderableSeries, rangeSelectionModifier;
     var _b;
     var _c, _d, _e, _f;
     return __generator(this, function (_g) {
         switch (_g.label) {
-            case 0: return [4 /*yield*/, SciChartSurface_1.SciChartSurface.create(overviewRootElementId, options)];
+            case 0: return [4 /*yield*/, SciChartSurface_1.SciChartSurface.create(overviewRootElement, options)];
             case 1:
                 _a = _g.sent(), wasmContext = _a.wasmContext, sciChartSurface = _a.sciChartSurface;
                 mainAxisId = (_c = options === null || options === void 0 ? void 0 : options.mainAxisId) !== null && _c !== void 0 ? _c : AxisBase2D_1.AxisBase2D.DEFAULT_AXIS_ID;
@@ -225,12 +225,13 @@ var createSciChartOverview = function (originalSciChartSurface, overviewRootElem
                 if ((options === null || options === void 0 ? void 0 : options.rangeSelectionAnnotationSvgString) !== undefined) {
                     rangeSelectionModifier.rangeSelectionAnnotation.svgString = options.rangeSelectionAnnotationSvgString;
                 }
+                xAxis.visibleRangeChanged.subscribe(function (_a) {
+                    var overviewVisibleRange = _a.visibleRange;
+                    var updatedSelectedRange = originalMainAxis.visibleRange.clip(overviewVisibleRange);
+                    rangeSelectionModifier.selectedArea = updatedSelectedRange;
+                });
                 originalMainAxis.visibleRangeChanged.subscribe(function (_a) {
                     var visibleRange = _a.visibleRange;
-                    if (visibleRange.min < mainOverviewAxis.visibleRange.min ||
-                        visibleRange.max > mainOverviewAxis.visibleRange.max) {
-                        mainOverviewAxis.visibleRange = new NumberRange_1.NumberRange(Math.min(visibleRange.min, mainOverviewAxis.visibleRange.min), Math.max(visibleRange.max, mainOverviewAxis.visibleRange.max));
-                    }
                     var updatedSelectedRange = visibleRange.clip(mainOverviewAxis.visibleRange);
                     var shouldUpdateSelectedRange = !updatedSelectedRange.equals(rangeSelectionModifier.selectedArea);
                     if (shouldUpdateSelectedRange) {

package/Charting/Visuals/sciChartInitCommon.js

@@ -149,6 +149,7 @@ var initCanvas = function (divElement, aspectWidth, aspectHeight, activeCanvas,
     svgAdornerLayer.style.pointerEvents = "none";
     svgAdornerLayer.style.width = "100%";
     svgAdornerLayer.style.height = "100%";
+    svgAdornerLayer.style.zIndex = "1";
     chartRoot.appendChild(svgAdornerLayer);
     // Root Div Element
     var divRootElement = document.createElement("div");

package/Core/BuildStamp.d.ts

@@ -1,4 +1,4 @@
 import { TSciChart } from "../types/TSciChart";
 import { TSciChart3D } from "../types/TSciChart3D";
-export declare const libraryVersion = "3.0.0-beta.230";
+export declare const libraryVersion = "3.0.0-beta.235";
 export declare const checkBuildStamp: (wasmContext: TSciChart | TSciChart3D) => boolean;

package/Core/BuildStamp.js

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.checkBuildStamp = exports.libraryVersion = void 0;
-var buildStamp = "2022-12-15T00:00:00";
+var buildStamp = "2022-12-21T00:00:00";
 var result;
 // tslint:disable-next-line:no-var-requires
-exports.libraryVersion = "3.0.0-beta.230";
+exports.libraryVersion = "3.0.0-beta.235";
 var checkBuildStamp = function (wasmContext) {
     if (result !== undefined)
         return result;