scichart 2.0.2228 → 2.1.0-beta.40

package/Charting/Numerics/Resamplers/ResamplingMode.d.ts

@@ -0,0 +1,37 @@
+export declare enum EResamplingMode {
+    /**
+     * Do not use resampling when redrawing a series
+     */
+    None = "None",
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the min-max of oversampled data.
+     * This results in the most visually accurate resampling, with the most performan
+     */
+    MinMax = "MinMax",
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the median point of oversampled data
+     */
+    Mid = "Mid",
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the maximum point of oversampled data
+     */
+    Max = "Max",
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the minimum point of oversampled data
+     */
+    Min = "Min",
+    /**
+     * Does not assume Evenly-spaced data (TimeSeries). Resample by taking the min-max of oversampled data.
+     * This results in the most visually accurate resampling, with the most performant rendering
+     */
+    MinMaxWithUnevenSpacing = "MinMaxWithUnevenSpacing",
+    /**
+     * Auto-detect the most suitable resampling algorithm (Fastest, plus most accurate) for the type of data appended
+     */
+    Auto = "Auto",
+    /**
+     * EXPERIMENTAL! Assumes Evenly-spaced data (TimeSeries).
+     * Resample by taking the Min, or the Max point of oversampled data. Outputs Min and Max when points in the resampling bucket span zero
+     */
+    MinOrMax = "MinOrMax"
+}

package/Charting/Numerics/Resamplers/ResamplingMode.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EResamplingMode = void 0;
+var EResamplingMode;
+(function (EResamplingMode) {
+    /**
+     * Do not use resampling when redrawing a series
+     */
+    EResamplingMode["None"] = "None";
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the min-max of oversampled data.
+     * This results in the most visually accurate resampling, with the most performan
+     */
+    EResamplingMode["MinMax"] = "MinMax";
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the median point of oversampled data
+     */
+    EResamplingMode["Mid"] = "Mid";
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the maximum point of oversampled data
+     */
+    EResamplingMode["Max"] = "Max";
+    /**
+     * Assumes Evenly-spaced data (TimeSeries). Resample by taking the minimum point of oversampled data
+     */
+    EResamplingMode["Min"] = "Min";
+    /**
+     * Does not assume Evenly-spaced data (TimeSeries). Resample by taking the min-max of oversampled data.
+     * This results in the most visually accurate resampling, with the most performant rendering
+     */
+    EResamplingMode["MinMaxWithUnevenSpacing"] = "MinMaxWithUnevenSpacing";
+    /**
+     * Auto-detect the most suitable resampling algorithm (Fastest, plus most accurate) for the type of data appended
+     */
+    EResamplingMode["Auto"] = "Auto";
+    /**
+     * EXPERIMENTAL! Assumes Evenly-spaced data (TimeSeries).
+     * Resample by taking the Min, or the Max point of oversampled data. Outputs Min and Max when points in the resampling bucket span zero
+     */
+    EResamplingMode["MinOrMax"] = "MinOrMax";
+})(EResamplingMode = exports.EResamplingMode || (exports.EResamplingMode = {}));

package/Charting/Numerics/Resamplers/ResamplingParams.d.ts

@@ -0,0 +1,39 @@
+import { NumberRange } from "../../../Core/NumberRange";
+import { Rect } from "../../../Core/Rect";
+import { AxisBase2D } from "../../Visuals/Axis/AxisBase2D";
+import { IRenderableSeries } from "../../Visuals/RenderableSeries/IRenderableSeries";
+import { EResamplingMode } from "./ResamplingMode";
+export interface IResamplingParamsCloneOptions {
+    zeroLineY?: number;
+    precision?: number;
+    xVisibleRange?: NumberRange;
+    indicesRange?: NumberRange;
+    viewportRect?: Rect;
+    isCategoryAxis?: boolean;
+    isXAxisAutoRanged?: boolean;
+    resamplingMode?: EResamplingMode;
+    renderableSeriesHash?: number;
+    enableExperimentalResampling?: boolean;
+    dataHasNaN?: boolean;
+    dataIsFifo?: boolean;
+    fifoCapacity?: number;
+    dataEvenlySpaced?: boolean;
+}
+export declare class ResamplingParams {
+    zeroLineY: number;
+    precision: number;
+    xVisibleRange: NumberRange;
+    indexesRange: NumberRange;
+    viewportRect: Rect;
+    isCategoryAxis: boolean;
+    isXAxisAutoRanged: boolean;
+    resamplingMode: EResamplingMode;
+    renderableSeriesHash: number;
+    enableExperimentalResampling: boolean;
+    dataHasNaN: boolean;
+    dataIsFifo: boolean;
+    fifoCapacity: number;
+    dataEvenlySpaced: boolean;
+    constructor(seriesViewRect: Rect, rs: IRenderableSeries, xAxis: AxisBase2D);
+    clone(options: IResamplingParamsCloneOptions): ResamplingParams;
+}

package/Charting/Numerics/Resamplers/ResamplingParams.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ResamplingParams = void 0;
+var AutoRange_1 = require("../../../types/AutoRange");
+var ResamplingParams = /** @class */ (function () {
+    function ResamplingParams(seriesViewRect, rs, xAxis) {
+        this.zeroLineY = 0;
+        this.precision = 0;
+        this.enableExperimentalResampling = false;
+        this.dataIsFifo = false;
+        this.fifoCapacity = 0;
+        this.viewportRect = seriesViewRect;
+        if (rs) {
+            var dataSeries = rs.dataSeries;
+            this.resamplingMode = rs.resamplingMode;
+            this.precision = rs.resamplingPrecision;
+            if (xAxis) {
+                this.indexesRange = rs.getIndicesRange(xAxis.visibleRange, xAxis.isCategoryAxis);
+                // console.log("visible range", xAxis.visibleRange.min, xAxis.visibleRange.max);
+                // console.log("indexes range", this.indexesRange.min, this.indexesRange.max);
+                this.isCategoryAxis = xAxis.isCategoryAxis;
+                this.isXAxisAutoRanged = xAxis.autoRange === AutoRange_1.EAutoRange.Always;
+                this.xVisibleRange = xAxis.visibleRange;
+            }
+            if (dataSeries) {
+                this.dataHasNaN = dataSeries === null || dataSeries === void 0 ? void 0 : dataSeries.dataDistributionCalculator.containsNaN;
+                this.dataEvenlySpaced = dataSeries === null || dataSeries === void 0 ? void 0 : dataSeries.isEvenlySpaced;
+            }
+        }
+    }
+    ResamplingParams.prototype.clone = function (options) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+        var rp = new ResamplingParams(undefined, undefined, undefined);
+        rp.zeroLineY = (_a = options === null || options === void 0 ? void 0 : options.zeroLineY) !== null && _a !== void 0 ? _a : this.zeroLineY;
+        rp.precision = (_b = options === null || options === void 0 ? void 0 : options.precision) !== null && _b !== void 0 ? _b : this.precision;
+        rp.xVisibleRange = (_c = options === null || options === void 0 ? void 0 : options.xVisibleRange) !== null && _c !== void 0 ? _c : this.xVisibleRange;
+        rp.indexesRange = (_d = options === null || options === void 0 ? void 0 : options.indicesRange) !== null && _d !== void 0 ? _d : this.indexesRange;
+        rp.viewportRect = (_e = options === null || options === void 0 ? void 0 : options.viewportRect) !== null && _e !== void 0 ? _e : this.viewportRect;
+        rp.isCategoryAxis = (_f = options === null || options === void 0 ? void 0 : options.isCategoryAxis) !== null && _f !== void 0 ? _f : this.isCategoryAxis;
+        rp.isXAxisAutoRanged = (_g = options === null || options === void 0 ? void 0 : options.isXAxisAutoRanged) !== null && _g !== void 0 ? _g : this.isXAxisAutoRanged;
+        rp.resamplingMode = (_h = options === null || options === void 0 ? void 0 : options.resamplingMode) !== null && _h !== void 0 ? _h : this.resamplingMode;
+        rp.renderableSeriesHash = (_j = options === null || options === void 0 ? void 0 : options.renderableSeriesHash) !== null && _j !== void 0 ? _j : this.renderableSeriesHash;
+        rp.enableExperimentalResampling = (_k = options === null || options === void 0 ? void 0 : options.enableExperimentalResampling) !== null && _k !== void 0 ? _k : this.enableExperimentalResampling;
+        rp.dataHasNaN = (_l = options === null || options === void 0 ? void 0 : options.dataHasNaN) !== null && _l !== void 0 ? _l : this.dataHasNaN;
+        rp.dataIsFifo = (_m = options === null || options === void 0 ? void 0 : options.dataIsFifo) !== null && _m !== void 0 ? _m : this.dataIsFifo;
+        rp.fifoCapacity = (_o = options === null || options === void 0 ? void 0 : options.fifoCapacity) !== null && _o !== void 0 ? _o : this.fifoCapacity;
+        rp.dataEvenlySpaced = (_p = options === null || options === void 0 ? void 0 : options.dataEvenlySpaced) !== null && _p !== void 0 ? _p : this.dataEvenlySpaced;
+        return rp;
+    };
+    return ResamplingParams;
+}());
+exports.ResamplingParams = ResamplingParams;

package/Charting/Services/RenderPassData.d.ts

@@ -1,4 +1,5 @@
 import { NumberRange } from "../../Core/NumberRange";
+import { IPointSeries } from "../Model/PointSeries/IPointSeries";
 import { CoordinateCalculatorBase } from "../Numerics/CoordinateCalculators/CoordinateCalculatorBase";
 /**
  * @summary RenderPassData contains properties which are passed to {@link BaseRenderableSeries} at the time of drawing
@@ -8,6 +9,8 @@ export declare class RenderPassData {
     readonly xCoordinateCalculator: CoordinateCalculatorBase;
     readonly yCoordinateCalculator: CoordinateCalculatorBase;
     readonly isVerticalChart: boolean;
+    readonly pointSeries?: IPointSeries;
+    readonly resamplingHash?: number;
     /**
      * Creates an instance of RenderPassData
      * @param indexRange The min and max index to data-range currently visible on the {@link SciChartSurface}
@@ -16,6 +19,8 @@ export declare class RenderPassData {
      * @param yCoordinateCalculator The YAxis {@link CoordinateCalculatorBase | Coordinate Calculator},
      * used to transform between pixel and data-coordinates
      * @param isVerticalChart A flag indicating if the chart is currently vertically arranged (XAxis on the left, YAxis on the top/bottom)
+     * @param pointSeries The point series
+     * @param resamplingHash The resampling hash value, used for caching
      */
-    constructor(indexRange: NumberRange, xCoordinateCalculator: CoordinateCalculatorBase, yCoordinateCalculator: CoordinateCalculatorBase, isVerticalChart: boolean);
+    constructor(indexRange: NumberRange, xCoordinateCalculator: CoordinateCalculatorBase, yCoordinateCalculator: CoordinateCalculatorBase, isVerticalChart: boolean, pointSeries?: IPointSeries, resamplingHash?: number);
 }

package/Charting/Services/RenderPassData.js

@@ -13,12 +13,16 @@ var RenderPassData = /** @class */ (function () {
      * @param yCoordinateCalculator The YAxis {@link CoordinateCalculatorBase | Coordinate Calculator},
      * used to transform between pixel and data-coordinates
      * @param isVerticalChart A flag indicating if the chart is currently vertically arranged (XAxis on the left, YAxis on the top/bottom)
+     * @param pointSeries The point series
+     * @param resamplingHash The resampling hash value, used for caching
      */
-    function RenderPassData(indexRange, xCoordinateCalculator, yCoordinateCalculator, isVerticalChart) {
+    function RenderPassData(indexRange, xCoordinateCalculator, yCoordinateCalculator, isVerticalChart, pointSeries, resamplingHash) {
         this.indexRange = indexRange;
         this.xCoordinateCalculator = xCoordinateCalculator;
         this.yCoordinateCalculator = yCoordinateCalculator;
         this.isVerticalChart = isVerticalChart;
+        this.pointSeries = pointSeries;
+        this.resamplingHash = resamplingHash;
     }
     return RenderPassData;
 }());

package/Charting/Services/RenderPassInfo.d.ts

@@ -0,0 +1,18 @@
+import { NumberRange } from "../../Core/NumberRange";
+import { Rect } from "../../Core/Rect";
+import { IPointSeries } from "../Model/PointSeries/IPointSeries";
+import { IRenderableSeries } from "../Visuals/RenderableSeries/IRenderableSeries";
+export declare type TSeriesRenderPassInfo = {
+    pointSeries: IPointSeries;
+    renderableSeries: IRenderableSeries;
+    indicesRange: NumberRange;
+    resamplingHash: number;
+};
+export declare class RenderPassInfo {
+    pointSeriesArray: IPointSeries[];
+    renderableSeriesArray: IRenderableSeries[];
+    indicesRanges: NumberRange[];
+    resamplingHashes: number[];
+    seriesViewRect: Rect;
+    constructor(seriesCount: number, seriesViewRect: Rect);
+}

package/Charting/Services/RenderPassInfo.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RenderPassInfo = void 0;
+var RenderPassInfo = /** @class */ (function () {
+    function RenderPassInfo(seriesCount, seriesViewRect) {
+        this.pointSeriesArray = [];
+        this.renderableSeriesArray = [];
+        this.indicesRanges = [];
+        this.resamplingHashes = [];
+        this.seriesViewRect = seriesViewRect;
+    }
+    return RenderPassInfo;
+}());
+exports.RenderPassInfo = RenderPassInfo;

package/Charting/Services/SciChartRenderer.d.ts

@@ -1,9 +1,21 @@
+import { Rect } from "../../Core/Rect";
 import { WebGlRenderContext2D } from "../Drawing/WebGlRenderContext2D";
+import { AxisBase2D } from "../Visuals/Axis/AxisBase2D";
+import { IRenderableSeries } from "../Visuals/RenderableSeries/IRenderableSeries";
 import { SciChartSurface } from "../Visuals/SciChartSurface";
+import { TSeriesRenderPassInfo } from "./RenderPassInfo";
 /**
  * A class used internally in SciChart to perform layout, arrangement, data-preparation and rendering on the Cartesian 2D {@link SciChartSurface}
  */
 export declare class SciChartRenderer {
+    /**
+     * Used internally
+     * @param xAxis
+     * @param rs
+     * @param seriesViewRect
+     */
+    static resampleSeries(xAxis: AxisBase2D, rs: IRenderableSeries, seriesViewRect: Rect): TSeriesRenderPassInfo;
+    private static calculateResamplingHash;
     private sciChartSurface;
     private previousTime;
     /**
@@ -20,7 +32,8 @@ export declare class SciChartRenderer {
     private drawSvgAnnotations;
     private validate;
     private updateSvgCanvasSize;
-    private prepareRenderData;
+    private prepareAxesRenderData;
+    private prepareSeriesRenderData;
     private drawAxes;
     private drawSeries;
     private drawDebugAxes;

package/Charting/Services/SciChartRenderer.js

@@ -11,15 +11,17 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SciChartRenderer = void 0;
 var Dictionary_1 = require("../../Core/Dictionary");
-var NumberRange_1 = require("../../Core/NumberRange");
 var Rect_1 = require("../../Core/Rect");
 var AutoRange_1 = require("../../types/AutoRange");
 var AxisAlignment_1 = require("../../types/AxisAlignment");
 var RenderLayer_1 = require("../../types/RenderLayer");
+var hash_1 = require("../../utils/hash");
+var ResamplingParams_1 = require("../Numerics/Resamplers/ResamplingParams");
 var IAnnotation_1 = require("../Visuals/Annotations/IAnnotation");
 var SciChartSurfaceBase_1 = require("../Visuals/SciChartSurfaceBase");
 var DpiHelper_1 = require("../Visuals/TextureManager/DpiHelper");
 var RenderPassData_1 = require("./RenderPassData");
+var RenderPassInfo_1 = require("./RenderPassInfo");
 /**
  * A class used internally in SciChart to perform layout, arrangement, data-preparation and rendering on the Cartesian 2D {@link SciChartSurface}
  */
@@ -31,6 +33,66 @@ var SciChartRenderer = /** @class */ (function () {
     function SciChartRenderer(sciChartSurface) {
         this.sciChartSurface = sciChartSurface;
     }
+    /**
+     * Used internally
+     * @param xAxis
+     * @param rs
+     * @param seriesViewRect
+     */
+    SciChartRenderer.resampleSeries = function (xAxis, rs, seriesViewRect) {
+        /**
+         * Stacked series and Heatmap do not support resampling
+         * If a series does not support resampling, the pointSeries is not used in the drawing provider.
+         * For example, UniformHeatmapDrawingProvider does not use renderPassData.pointSeries,
+         * but LineSeriesDrawingProvider use renderPassData.pointSeries in the draw() method!
+         */
+        if (!rs.supportsResampling)
+            return {
+                pointSeries: rs.toPointSeries(),
+                renderableSeries: rs,
+                indicesRange: undefined,
+                resamplingHash: undefined
+            };
+        var rp = new ResamplingParams_1.ResamplingParams(seriesViewRect, rs, xAxis);
+        if (!rs.needsResampling(rp))
+            return {
+                pointSeries: rs.toPointSeries(),
+                renderableSeries: rs,
+                indicesRange: undefined,
+                resamplingHash: undefined
+            };
+        var resamplingHash = SciChartRenderer.calculateResamplingHash(rs, rp);
+        var prevRPD = rs.getCurrentRenderPassData();
+        var useFromCache = Boolean(prevRPD && prevRPD.resamplingHash === resamplingHash);
+        // console.log("resampling ...");
+        // console.log("useFromCache", useFromCache);
+        var pointSeries = useFromCache ? prevRPD.pointSeries : rs.toPointSeries(rp);
+        return {
+            pointSeries: pointSeries,
+            renderableSeries: rs,
+            indicesRange: rp.indexesRange,
+            resamplingHash: resamplingHash
+        };
+    };
+    SciChartRenderer.calculateResamplingHash = function (rs, rp) {
+        var hashes = [];
+        var enableDrawingOptimizationsHash = hash_1.hashUtils.generateBooleanHash(rs.enableDrawingOptimisations);
+        hashes.push(enableDrawingOptimizationsHash);
+        var dataSeries = rs.dataSeries;
+        if (dataSeries) {
+            var dataSeriesHash = hash_1.hashUtils.generateHash(dataSeries.id);
+            hashes.push(dataSeriesHash);
+            var dataSeriesCountHash = hash_1.hashUtils.generateNumberHash(dataSeries.count());
+            hashes.push(dataSeriesCountHash);
+            var dataSeriesSortedHash = hash_1.hashUtils.generateBooleanHash(dataSeries.dataDistributionCalculator.isSortedAscending);
+            hashes.push(dataSeriesSortedHash);
+            var dataSeriesChangeCountHash = hash_1.hashUtils.generateNumberHash(dataSeries.changeCount);
+            hashes.push(dataSeriesChangeCountHash);
+        }
+        var resamplingParamsHash = hash_1.hashUtils.generateObjectHash(rp);
+        hashes.push(resamplingParamsHash);
+        return hash_1.hashUtils.generateCombinedHash(hashes);
+    };
     /**
      * Render loop for the current {@SciChartSurface}
      * @param renderContext the {@WebGLRenderContext2D} used for drawing
@@ -61,7 +123,8 @@ var SciChartRenderer = /** @class */ (function () {
         var seriesViewRect = this.sciChartSurface.layoutManager.layoutChart(renderContext.viewportSize);
         this.updateSvgCanvasSize(seriesViewRect);
         // Step 4 prepare render data
-        var xyAxesById = this.prepareRenderData();
+        var _a = this.prepareAxesRenderData(), xAxesById = _a.xAxesById, yAxesById = _a.yAxesById;
+        var renderPassInfo = this.prepareSeriesRenderData(seriesViewRect, xAxesById);
         // Draw seriesViewRect border
         this.sciChartSurface.drawBorder(renderContext);
         // Step 5 Draw X, Y axis and gridlines
@@ -81,22 +144,21 @@ var SciChartRenderer = /** @class */ (function () {
                 el.type === IAnnotation_1.EAnnotationType.RenderContextAxisMarkerAnnotation);
         });
         renderContext.enqueueLayeredDraw(function () {
-            _this.drawRenderContextAnnotations(renderContextAnnotations, xyAxesById[0], xyAxesById[1], IAnnotation_1.EAnnotationLayer.BelowChart, renderContext, seriesViewRect);
+            _this.drawRenderContextAnnotations(renderContextAnnotations, xAxesById, yAxesById, IAnnotation_1.EAnnotationLayer.BelowChart, renderContext, seriesViewRect);
         }, RenderLayer_1.ERenderLayer.Third);
-        // queue series rendering after grid lines and bands, but before the axes
-        renderContext.enqueueLayeredDraw(function () { return _this.drawSeries(_this.sciChartSurface, _this.sciChartSurface.renderableSeries.asArray(), renderContext); }, RenderLayer_1.ERenderLayer.Third);
+        // Step 7 Draw series. Queue series rendering after grid lines and bands, but before the axes
+        renderContext.enqueueLayeredDraw(function () { return _this.drawSeries(_this.sciChartSurface, renderPassInfo, renderContext); }, RenderLayer_1.ERenderLayer.Third);
         // Execute rendering of queued elements
         renderContext.drawLayers();
-        // Step 7 Draw series
         // Step 8 Draw annotations above the series
-        this.drawRenderContextAnnotations(renderContextAnnotations, xyAxesById[0], xyAxesById[1], IAnnotation_1.EAnnotationLayer.AboveChart, renderContext, seriesViewRect);
+        this.drawRenderContextAnnotations(renderContextAnnotations, xAxesById, yAxesById, IAnnotation_1.EAnnotationLayer.AboveChart, renderContext, seriesViewRect);
         // Step 9 Draw SVG or Html Overlays
         var svgAnnotations = annotations.filter(function (el) {
             return el.type === IAnnotation_1.EAnnotationType.SVG ||
                 el.type === IAnnotation_1.EAnnotationType.SVGTextAnnotation ||
                 el.type === IAnnotation_1.EAnnotationType.SVGCustomAnnotation;
         });
-        this.drawSvgAnnotations(svgAnnotations, xyAxesById[0], xyAxesById[1]);
+        this.drawSvgAnnotations(svgAnnotations, xAxesById, yAxesById);
         // Update watermark
         this.updateWatermark(renderContext, seriesViewRect);
         // Step 10 Call OnParentSurfaceRendered
@@ -175,7 +237,7 @@ var SciChartRenderer = /** @class */ (function () {
             svgRootElement.currentScale = 1;
         }
     };
-    SciChartRenderer.prototype.prepareRenderData = function () {
+    SciChartRenderer.prototype.prepareAxesRenderData = function () {
         var xAxesById = new Dictionary_1.Dictionary();
         var yAxesById = new Dictionary_1.Dictionary();
         // Prepare XAxes
@@ -188,7 +250,23 @@ var SciChartRenderer = /** @class */ (function () {
             yAxesById.add(yAxis.id, yAxis);
             yAxis.prepareRenderData();
         });
-        return [xAxesById, yAxesById];
+        return { xAxesById: xAxesById, yAxesById: yAxesById };
+    };
+    SciChartRenderer.prototype.prepareSeriesRenderData = function (seriesViewRect, xAxesById) {
+        var seriesCount = this.sciChartSurface.renderableSeries.size();
+        var renderPassInfo = new RenderPassInfo_1.RenderPassInfo(seriesCount, seriesViewRect);
+        // TODO: Calculate XRange before resample but YRange after resample for faster autorange on large datasets
+        for (var i = 0; i < this.sciChartSurface.renderableSeries.size(); i++) {
+            var series = this.sciChartSurface.renderableSeries.get(i);
+            // TODO: Do resampling, store result for use in drawing
+            var xAxis = xAxesById.item(series.xAxisId);
+            var seriesRenderPassInfo = SciChartRenderer.resampleSeries(xAxis, series, seriesViewRect);
+            renderPassInfo.renderableSeriesArray.push(seriesRenderPassInfo.renderableSeries);
+            renderPassInfo.pointSeriesArray.push(seriesRenderPassInfo.pointSeries);
+            renderPassInfo.indicesRanges.push(seriesRenderPassInfo.indicesRange);
+            renderPassInfo.resamplingHashes.push(seriesRenderPassInfo.resamplingHash);
+        }
+        return renderPassInfo;
     };
     SciChartRenderer.prototype.drawAxes = function (scs, renderContext) {
         scs.xAxes.asArray().forEach(function (xAxis) {
@@ -198,31 +276,30 @@ var SciChartRenderer = /** @class */ (function () {
             yAxis.draw(renderContext);
         });
     };
-    SciChartRenderer.prototype.drawSeries = function (scs, renderableSeries, renderContext) {
-        var drawSeriesImpl = function (series) {
-            var indexRange = new NumberRange_1.NumberRange(0, 0);
-            var xAxis = scs.xAxes.asArray().find(function (a) { return a.id === series.xAxisId; });
-            if (!xAxis) {
-                throw Error("Cannot find an X Axis with ID = " + series.xAxisId);
-            }
-            var yAxis = scs.yAxes.asArray().find(function (a) { return a.id === series.yAxisId; });
-            if (!yAxis) {
-                throw Error("Cannot find a Y Axis with ID = " + series.yAxisId);
-            }
-            if (xAxis.isVerticalChart && ![AxisAlignment_1.EAxisAlignment.Top, AxisAlignment_1.EAxisAlignment.Bottom].includes(yAxis.axisAlignment)) {
+    SciChartRenderer.prototype.drawSeries = function (scs, renderPassInfo, renderContext) {
+        var renderableSeriesArray = renderPassInfo.renderableSeriesArray, pointSeriesArray = renderPassInfo.pointSeriesArray, resamplingHashes = renderPassInfo.resamplingHashes, indicesRanges = renderPassInfo.indicesRanges;
+        var drawSeriesImpl = function (index) {
+            var renderableSeries = renderableSeriesArray[index];
+            var pointSeries = pointSeriesArray[index];
+            var resamplingHash = resamplingHashes[index];
+            var indexRange = indicesRanges[index];
+            var xAxis = scs.xAxes.asArray().find(function (a) { return a.id === renderableSeries.xAxisId; });
+            if (!xAxis)
+                throw Error("Cannot find an X Axis with ID = " + renderableSeries.xAxisId);
+            var yAxis = scs.yAxes.asArray().find(function (a) { return a.id === renderableSeries.yAxisId; });
+            if (!yAxis)
+                throw Error("Cannot find a Y Axis with ID = " + renderableSeries.yAxisId);
+            if (xAxis.isVerticalChart && ![AxisAlignment_1.EAxisAlignment.Top, AxisAlignment_1.EAxisAlignment.Bottom].includes(yAxis.axisAlignment))
                 throw Error("For vertical chart (chart with X Axis alignment Left or Right) Y Axis alignment should be Top or Bottom, X Axis ID = ".concat(xAxis.id));
-            }
-            if ((0, AxisAlignment_1.getIsVertical)(xAxis.axisAlignment) && (0, AxisAlignment_1.getIsVertical)(yAxis.axisAlignment)) {
+            if ((0, AxisAlignment_1.getIsVertical)(xAxis.axisAlignment) && (0, AxisAlignment_1.getIsVertical)(yAxis.axisAlignment))
                 throw Error("Both x and y axes can't have vertical alignment");
-            }
-            if ((0, AxisAlignment_1.getIsHorizontal)(xAxis.axisAlignment) && (0, AxisAlignment_1.getIsHorizontal)(yAxis.axisAlignment)) {
+            if ((0, AxisAlignment_1.getIsHorizontal)(xAxis.axisAlignment) && (0, AxisAlignment_1.getIsHorizontal)(yAxis.axisAlignment))
                 throw Error("Both x and y axes can't have horizontal alignment");
-            }
             var xCalc = xAxis.getCurrentCoordinateCalculator();
             var yCalc = yAxis.getCurrentCoordinateCalculator();
             try {
-                var renderPassData = new RenderPassData_1.RenderPassData(indexRange, xCalc, yCalc, xAxis.isVerticalChart);
-                series.draw(renderContext, renderPassData);
+                var renderPassData = new RenderPassData_1.RenderPassData(indexRange, xCalc, yCalc, xAxis.isVerticalChart, pointSeries, resamplingHash);
+                renderableSeries.draw(renderContext, renderPassData);
             }
             finally {
                 // We can not delete calculators because we use them in Hit Test
@@ -230,10 +307,24 @@ var SciChartRenderer = /** @class */ (function () {
                 // yCalc.delete();
             }
         };
+        var nativeContext = renderContext.getNativeContext();
+        var viewRect = this.sciChartSurface.seriesViewRect;
+        nativeContext.PushMatrix();
+        nativeContext.PushState();
+        nativeContext.Translate(viewRect.x, viewRect.y);
+        nativeContext.SetClipRect(viewRect.x, viewRect.y, viewRect.width, viewRect.height);
         // Draw unselected series first
-        renderableSeries.filter(function (rs) { return rs.isVisible && !rs.isSelected; }).forEach(drawSeriesImpl);
+        renderableSeriesArray.forEach(function (rs, index) {
+            if (rs.isVisible && !rs.isSelected)
+                drawSeriesImpl(index);
+        });
         // Draw selected series at higher z-index
-        renderableSeries.filter(function (rs) { return rs.isVisible && rs.isSelected; }).forEach(drawSeriesImpl);
+        renderableSeriesArray.forEach(function (rs, index) {
+            if (rs.isVisible && rs.isSelected)
+                drawSeriesImpl(index);
+        });
+        nativeContext.PopMatrix();
+        nativeContext.PopState();
     };
     SciChartRenderer.prototype.drawDebugAxes = function (scs, renderContext) {
         scs.xAxes.asArray().forEach(function (xAxis) {

package/Charting/Visuals/Axis/AxisCore.d.ts

@@ -275,6 +275,7 @@ export declare abstract class AxisCore implements IAxisParams, IDeletable {
     protected maxAutoTicksProperty: number;
     protected visibleRangeAnimationToken: IGenericAnimation;
     protected readonly defaultVisibleRange: NumberRange;
+    protected allowFastMathProperty: boolean;
     /**
      * Creates an instance of an {@link AxisCore}
      * @param options Optional parameters of type {@link IAxisCoreOptions} used to define properties at instantiation time
@@ -290,6 +291,16 @@ export declare abstract class AxisCore implements IAxisParams, IDeletable {
      * See {@link AxisBase2D.axisAlignment} if you want to set a 2D Axis alignment to the left, right, top or bottom
      */
     get isXAxis(): boolean;
+    /**
+     * When true, 32-bit faster paths for coordinate calculation maths are used. This improves performance in
+     * edge-cases where every CPU cycle counts.
+     */
+    get allowFastMath(): boolean;
+    /**
+     * When true, 32-bit faster paths for coordinate calculation maths are used. This improves performance in
+     * edge-cases where every CPU cycle counts.
+     */
+    set allowFastMath(allowFastMath: boolean);
     /**
      * When true, the axis has a valid {@link AxisCore.visibleRange} which can be drawn
      * @remarks

package/Charting/Visuals/Axis/AxisCore.js

@@ -44,7 +44,7 @@ var AxisCore = /** @class */ (function () {
      * @param options Optional parameters of type {@link IAxisCoreOptions} used to define properties at instantiation time
      */
     function AxisCore(options) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
         /**
          * An {@link EventHandler} which fires a callback when the {@link AxisCore.visibleRange} property changes.
          * @desc
@@ -161,6 +161,7 @@ var AxisCore = /** @class */ (function () {
          */
         this.maxAutoTicksProperty = 10;
         this.defaultVisibleRange = new NumberRange_1.NumberRange(0, 10);
+        this.allowFastMathProperty = false;
         this.visibleRange = (options === null || options === void 0 ? void 0 : options.visibleRange) || this.defaultVisibleRange;
         this.id = (_a = options === null || options === void 0 ? void 0 : options.id) !== null && _a !== void 0 ? _a : this.id;
         this.growBy = (_b = options === null || options === void 0 ? void 0 : options.growBy) !== null && _b !== void 0 ? _b : this.growBy;
@@ -168,23 +169,24 @@ var AxisCore = /** @class */ (function () {
         this.isVisible = (_d = options === null || options === void 0 ? void 0 : options.isVisible) !== null && _d !== void 0 ? _d : this.isVisible;
         this.axisTitle = (_e = options === null || options === void 0 ? void 0 : options.axisTitle) !== null && _e !== void 0 ? _e : this.axisTitle;
         this.axisTitleStyle = (_f = options === null || options === void 0 ? void 0 : options.axisTitleStyle) !== null && _f !== void 0 ? _f : this.axisTitleStyle;
-        this.autoTicksProperty = (_g = options === null || options === void 0 ? void 0 : options.autoTicks) !== null && _g !== void 0 ? _g : this.autoTicksProperty;
-        this.maxAutoTicksProperty = (_h = options === null || options === void 0 ? void 0 : options.maxAutoTicks) !== null && _h !== void 0 ? _h : this.maxAutoTicksProperty;
-        this.minorsPerMajorProperty = (_j = options === null || options === void 0 ? void 0 : options.minorsPerMajor) !== null && _j !== void 0 ? _j : this.minorsPerMajorProperty;
-        this.majorDeltaProperty = (_k = options === null || options === void 0 ? void 0 : options.majorDelta) !== null && _k !== void 0 ? _k : this.majorDeltaProperty;
-        this.minorDeltaProperty = (_l = options === null || options === void 0 ? void 0 : options.minorDelta) !== null && _l !== void 0 ? _l : this.minorDeltaProperty;
-        this.drawLabelsProperty = (_m = options === null || options === void 0 ? void 0 : options.drawLabels) !== null && _m !== void 0 ? _m : this.drawLabelsProperty;
-        this.drawMajorTickLinesProperty = (_o = options === null || options === void 0 ? void 0 : options.drawMajorTickLines) !== null && _o !== void 0 ? _o : this.drawMajorTickLinesProperty;
-        this.drawMinorTickLinesProperty = (_p = options === null || options === void 0 ? void 0 : options.drawMinorTickLines) !== null && _p !== void 0 ? _p : this.drawMinorTickLinesProperty;
-        this.drawMinorGridLinesProperty = (_q = options === null || options === void 0 ? void 0 : options.drawMinorGridLines) !== null && _q !== void 0 ? _q : this.drawMinorGridLinesProperty;
-        this.drawMajorGridLinesProperty = (_r = options === null || options === void 0 ? void 0 : options.drawMajorGridLines) !== null && _r !== void 0 ? _r : this.drawMajorGridLinesProperty;
-        this.majorGridLineStyleProperty = (_s = options === null || options === void 0 ? void 0 : options.majorGridLineStyle) !== null && _s !== void 0 ? _s : this.majorGridLineStyleProperty;
-        this.minorGridLineStyleProperty = (_t = options === null || options === void 0 ? void 0 : options.minorGridLineStyle) !== null && _t !== void 0 ? _t : this.minorGridLineStyleProperty;
-        this.majorTickLineStyleProperty = (_u = options === null || options === void 0 ? void 0 : options.majorTickLineStyle) !== null && _u !== void 0 ? _u : this.majorTickLineStyleProperty;
-        this.minorTickLineStyleProperty = (_v = options === null || options === void 0 ? void 0 : options.minorTickLineStyle) !== null && _v !== void 0 ? _v : this.minorTickLineStyleProperty;
-        this.drawMajorBandsProperty = (_w = options === null || options === void 0 ? void 0 : options.drawMajorBands) !== null && _w !== void 0 ? _w : this.drawMajorBandsProperty;
-        this.axisBandsFillProperty = (_x = options === null || options === void 0 ? void 0 : options.axisBandsFill) !== null && _x !== void 0 ? _x : this.axisBandsFillProperty;
-        this.flippedCoordinatesProperty = (_y = options === null || options === void 0 ? void 0 : options.flippedCoordinates) !== null && _y !== void 0 ? _y : this.flippedCoordinatesProperty;
+        this.allowFastMath = (_g = options === null || options === void 0 ? void 0 : options.allowFastMath) !== null && _g !== void 0 ? _g : this.allowFastMathProperty;
+        this.autoTicksProperty = (_h = options === null || options === void 0 ? void 0 : options.autoTicks) !== null && _h !== void 0 ? _h : this.autoTicksProperty;
+        this.maxAutoTicksProperty = (_j = options === null || options === void 0 ? void 0 : options.maxAutoTicks) !== null && _j !== void 0 ? _j : this.maxAutoTicksProperty;
+        this.minorsPerMajorProperty = (_k = options === null || options === void 0 ? void 0 : options.minorsPerMajor) !== null && _k !== void 0 ? _k : this.minorsPerMajorProperty;
+        this.majorDeltaProperty = (_l = options === null || options === void 0 ? void 0 : options.majorDelta) !== null && _l !== void 0 ? _l : this.majorDeltaProperty;
+        this.minorDeltaProperty = (_m = options === null || options === void 0 ? void 0 : options.minorDelta) !== null && _m !== void 0 ? _m : this.minorDeltaProperty;
+        this.drawLabelsProperty = (_o = options === null || options === void 0 ? void 0 : options.drawLabels) !== null && _o !== void 0 ? _o : this.drawLabelsProperty;
+        this.drawMajorTickLinesProperty = (_p = options === null || options === void 0 ? void 0 : options.drawMajorTickLines) !== null && _p !== void 0 ? _p : this.drawMajorTickLinesProperty;
+        this.drawMinorTickLinesProperty = (_q = options === null || options === void 0 ? void 0 : options.drawMinorTickLines) !== null && _q !== void 0 ? _q : this.drawMinorTickLinesProperty;
+        this.drawMinorGridLinesProperty = (_r = options === null || options === void 0 ? void 0 : options.drawMinorGridLines) !== null && _r !== void 0 ? _r : this.drawMinorGridLinesProperty;
+        this.drawMajorGridLinesProperty = (_s = options === null || options === void 0 ? void 0 : options.drawMajorGridLines) !== null && _s !== void 0 ? _s : this.drawMajorGridLinesProperty;
+        this.majorGridLineStyleProperty = (_t = options === null || options === void 0 ? void 0 : options.majorGridLineStyle) !== null && _t !== void 0 ? _t : this.majorGridLineStyleProperty;
+        this.minorGridLineStyleProperty = (_u = options === null || options === void 0 ? void 0 : options.minorGridLineStyle) !== null && _u !== void 0 ? _u : this.minorGridLineStyleProperty;
+        this.majorTickLineStyleProperty = (_v = options === null || options === void 0 ? void 0 : options.majorTickLineStyle) !== null && _v !== void 0 ? _v : this.majorTickLineStyleProperty;
+        this.minorTickLineStyleProperty = (_w = options === null || options === void 0 ? void 0 : options.minorTickLineStyle) !== null && _w !== void 0 ? _w : this.minorTickLineStyleProperty;
+        this.drawMajorBandsProperty = (_x = options === null || options === void 0 ? void 0 : options.drawMajorBands) !== null && _x !== void 0 ? _x : this.drawMajorBandsProperty;
+        this.axisBandsFillProperty = (_y = options === null || options === void 0 ? void 0 : options.axisBandsFill) !== null && _y !== void 0 ? _y : this.axisBandsFillProperty;
+        this.flippedCoordinatesProperty = (_z = options === null || options === void 0 ? void 0 : options.flippedCoordinates) !== null && _z !== void 0 ? _z : this.flippedCoordinatesProperty;
     }
     Object.defineProperty(AxisCore.prototype, "isCategoryAxis", {
         /**
@@ -208,6 +210,25 @@ var AxisCore = /** @class */ (function () {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(AxisCore.prototype, "allowFastMath", {
+        /**
+         * When true, 32-bit faster paths for coordinate calculation maths are used. This improves performance in
+         * edge-cases where every CPU cycle counts.
+         */
+        get: function () {
+            return this.allowFastMathProperty;
+        },
+        /**
+         * When true, 32-bit faster paths for coordinate calculation maths are used. This improves performance in
+         * edge-cases where every CPU cycle counts.
+         */
+        set: function (allowFastMath) {
+            this.allowFastMathProperty = allowFastMath;
+            this.notifyPropertyChanged(constants_1.PROPERTY.ALLOW_FAST_MATH);
+        },
+        enumerable: false,
+        configurable: true
+    });
     /**
      * When true, the axis has a valid {@link AxisCore.visibleRange} which can be drawn
      * @remarks