scichart 2.2.2416 → 3.0.0-beta.224

package/Charting/Visuals/PointMarkers/IPointMarker.d.ts

@@ -1,6 +1,7 @@
 import { TPointMarkerDefinition } from "../../../Builder/buildSeries";
 import { IDeletable } from "../../../Core/IDeletable";
 import { EPointMarkerType } from "../../../types/PointMarkerType";
+import { IThemeProvider } from "../../Themes/IThemeProvider";
 import { BasePointMarkerStyle } from "../RenderableSeries/Animations/BasePointMarkerStyle";
 import { CanvasTexture } from "../TextureManager/CanvasTexture";
 import { INotifyOnDpiChanged } from "../TextureManager/DpiHelper";
@@ -87,6 +88,13 @@ export interface IPointMarker extends IDeletable, INotifyOnDpiChanged {
      * Resumes recreation of the PointMarker
      */
     resumeUpdates(): void;
+    /**
+     * Resolve colors marked AUTO_COLOR using the theme's strokePalette and fillPalette
+     * To do custom adjustments to the resolved colors, override the adjustAutoColor method
+     */
+    resolveAutoColors(index: number, maxSeries: number, theme: IThemeProvider): void;
+    /** Replace this to do custom adjustments to the auto color for a particular property */
+    adjustAutoColor(propertyName: string, color: string): string;
     /** Convert the object to a definition that can be serialized to JSON, or used directly with the builder api */
     toJSON(): TPointMarkerDefinition;
 }

package/Charting/Visuals/RenderableSeries/Animations/BandAnimation.js

@@ -24,8 +24,9 @@ var SeriesAnimation_1 = require("./SeriesAnimation");
 var BandAnimation = /** @class */ (function (_super) {
     __extends(BandAnimation, _super);
     function BandAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/BandAnimationStyle.js

@@ -21,8 +21,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var BandAnimationStyle = /** @class */ (function (_super) {
     __extends(BandAnimationStyle, _super);
     function BandAnimationStyle(options) {
+        var _this = this;
         var _a, _b, _c;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.strokeY1 = (_a = options === null || options === void 0 ? void 0 : options.strokeY1) !== null && _a !== void 0 ? _a : _this.strokeY1Property;
         _this.fill = (_b = options === null || options === void 0 ? void 0 : options.fill) !== null && _b !== void 0 ? _b : _this.fillProperty;
         _this.fillY1 = (_c = options === null || options === void 0 ? void 0 : options.fillY1) !== null && _c !== void 0 ? _c : _this.fillY1Property;

package/Charting/Visuals/RenderableSeries/Animations/BubbleAnimation.js

@@ -22,8 +22,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var BubbleAnimation = /** @class */ (function (_super) {
     __extends(BubbleAnimation, _super);
     function BubbleAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/CandlestickAnimation.js

@@ -24,8 +24,9 @@ var OhlcAnimation_1 = require("./OhlcAnimation");
 var CandlestickAnimation = /** @class */ (function (_super) {
     __extends(CandlestickAnimation, _super);
     function CandlestickAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/CandlestickAnimationStyle.js

@@ -21,8 +21,9 @@ var OhlcAnimationStyle_1 = require("./OhlcAnimationStyle");
 var CandlestickAnimationStyle = /** @class */ (function (_super) {
     __extends(CandlestickAnimationStyle, _super);
     function CandlestickAnimationStyle(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.brushUp = (_a = options === null || options === void 0 ? void 0 : options.brushUp) !== null && _a !== void 0 ? _a : _this.brushUpProperty;
         _this.brushDown = (_b = options === null || options === void 0 ? void 0 : options.brushDown) !== null && _b !== void 0 ? _b : _this.brushDownProperty;
         return _this;

package/Charting/Visuals/RenderableSeries/Animations/ColumnAnimation.js

@@ -25,8 +25,9 @@ var PointMarkerStyle_1 = require("./PointMarkerStyle");
 var ColumnAnimation = /** @class */ (function (_super) {
     __extends(ColumnAnimation, _super);
     function ColumnAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/ColumnAnimationStyle.js

@@ -21,8 +21,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var ColumnAnimationStyle = /** @class */ (function (_super) {
     __extends(ColumnAnimationStyle, _super);
     function ColumnAnimationStyle(options) {
+        var _this = this;
         var _a, _b, _c;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.fill = (_a = options === null || options === void 0 ? void 0 : options.fill) !== null && _a !== void 0 ? _a : _this.fillProperty;
         _this.zeroLineY = (_b = options === null || options === void 0 ? void 0 : options.zeroLineY) !== null && _b !== void 0 ? _b : _this.zeroLineY;
         _this.dataPointWidth = (_c = options === null || options === void 0 ? void 0 : options.dataPointWidth) !== null && _c !== void 0 ? _c : _this.dataPointWidth;

package/Charting/Visuals/RenderableSeries/Animations/CustomPointMarkerStyle.js

@@ -20,8 +20,9 @@ var BasePointMarkerStyle_1 = require("./BasePointMarkerStyle");
 var CustomPointMarkerStyle = /** @class */ (function (_super) {
     __extends(CustomPointMarkerStyle, _super);
     function CustomPointMarkerStyle(options) {
+        var _this = this;
         var _a;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.image = (_a = options === null || options === void 0 ? void 0 : options.image) !== null && _a !== void 0 ? _a : _this.image;
         return _this;
     }

package/Charting/Visuals/RenderableSeries/Animations/FadeAnimation.js

@@ -21,8 +21,9 @@ var SeriesAnimation_1 = require("./SeriesAnimation");
 var FadeAnimation = /** @class */ (function (_super) {
     __extends(FadeAnimation, _super);
     function FadeAnimation(options) {
+        var _this = this;
         var _a;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Fade;
         _this.isFadeEffectAnimation = (_a = options === null || options === void 0 ? void 0 : options.fadeEffect) !== null && _a !== void 0 ? _a : true;

package/Charting/Visuals/RenderableSeries/Animations/LineAnimation.js

@@ -22,8 +22,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var LineAnimation = /** @class */ (function (_super) {
     __extends(LineAnimation, _super);
     function LineAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/MountainAnimation.js

@@ -25,8 +25,9 @@ var PointMarkerStyle_1 = require("./PointMarkerStyle");
 var MountainAnimation = /** @class */ (function (_super) {
     __extends(MountainAnimation, _super);
     function MountainAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/MountainAnimationStyle.js

@@ -21,8 +21,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var MountainAnimationStyle = /** @class */ (function (_super) {
     __extends(MountainAnimationStyle, _super);
     function MountainAnimationStyle(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.fill = (_a = options === null || options === void 0 ? void 0 : options.fill) !== null && _a !== void 0 ? _a : _this.fillProperty;
         _this.zeroLineY = (_b = options === null || options === void 0 ? void 0 : options.zeroLineY) !== null && _b !== void 0 ? _b : _this.zeroLineY;
         return _this;

package/Charting/Visuals/RenderableSeries/Animations/OhlcAnimation.js

@@ -24,8 +24,9 @@ var OhlcAnimationStyle_1 = require("./OhlcAnimationStyle");
 var OhlcAnimation = /** @class */ (function (_super) {
     __extends(OhlcAnimation, _super);
     function OhlcAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/OhlcAnimationStyle.js

@@ -21,8 +21,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var OhlcAnimationStyle = /** @class */ (function (_super) {
     __extends(OhlcAnimationStyle, _super);
     function OhlcAnimationStyle(options) {
+        var _this = this;
         var _a, _b, _c;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.strokeUp = (_a = options === null || options === void 0 ? void 0 : options.strokeUp) !== null && _a !== void 0 ? _a : _this.strokeUpProperty;
         _this.strokeDown = (_b = options === null || options === void 0 ? void 0 : options.strokeDown) !== null && _b !== void 0 ? _b : _this.strokeDownProperty;
         _this.dataPointWidth = (_c = options === null || options === void 0 ? void 0 : options.dataPointWidth) !== null && _c !== void 0 ? _c : _this.dataPointWidth;

package/Charting/Visuals/RenderableSeries/Animations/PointMarkerStyle.js

@@ -21,8 +21,9 @@ var BasePointMarkerStyle_1 = require("./BasePointMarkerStyle");
 var PointMarkerStyle = /** @class */ (function (_super) {
     __extends(PointMarkerStyle, _super);
     function PointMarkerStyle(options) {
+        var _this = this;
         var _a, _b, _c;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         _this.strokeThickness = 0;
         _this.strokeThickness = (_a = options === null || options === void 0 ? void 0 : options.strokeThickness) !== null && _a !== void 0 ? _a : _this.strokeThickness;
         _this.stroke = (_b = options === null || options === void 0 ? void 0 : options.stroke) !== null && _b !== void 0 ? _b : "#ffffff00";

package/Charting/Visuals/RenderableSeries/Animations/ScaleAnimation.js

@@ -21,8 +21,9 @@ var SeriesAnimation_1 = require("./SeriesAnimation");
 var ScaleAnimation = /** @class */ (function (_super) {
     __extends(ScaleAnimation, _super);
     function ScaleAnimation(options) {
+        var _this = this;
         var _a;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Scale;
         /**

package/Charting/Visuals/RenderableSeries/Animations/ScatterAnimation.js

@@ -22,8 +22,9 @@ var BaseAnimationStyle_1 = require("./BaseAnimationStyle");
 var ScatterAnimation = /** @class */ (function (_super) {
     __extends(ScatterAnimation, _super);
     function ScatterAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Style;
         _this.duration = (_a = options === null || options === void 0 ? void 0 : options.duration) !== null && _a !== void 0 ? _a : 1000;

package/Charting/Visuals/RenderableSeries/Animations/SeriesAnimation.d.ts

@@ -6,7 +6,13 @@ import { IDataSeries } from "../../../Model/IDataSeries";
 import { IRenderableSeries } from "../IRenderableSeries";
 import { BaseAnimationStyle } from "./BaseAnimationStyle";
 export interface IBaseAnimationOptions {
+    /**
+     * The animation delay in ms
+     */
     delay?: number;
+    /**
+     * The animation duration in ms
+     */
     duration?: number;
     fadeEffect?: boolean;
     ease?: TEasingFn | string;
@@ -23,11 +29,11 @@ export declare abstract class SeriesAnimation implements IAnimation {
      */
     abstract readonly type: EAnimationType;
     /**
-     * The animation delay
+     * The animation delay in ms
      */
     delay: number;
     /**
-     * The animation duration
+     * The animation duration in ms
      */
     duration: number;
     /**

package/Charting/Visuals/RenderableSeries/Animations/SeriesAnimation.js

@@ -16,11 +16,11 @@ var SeriesAnimation = /** @class */ (function () {
     function SeriesAnimation(options) {
         var _a, _b, _c, _d;
         /**
-         * The animation delay
+         * The animation delay in ms
          */
         this.delay = 0;
         /**
-         * The animation duration
+         * The animation duration in ms
          */
         this.duration = 3000;
         /**
@@ -76,7 +76,7 @@ var SeriesAnimation = /** @class */ (function () {
     SeriesAnimation.prototype.calculateDataSeriesAnimationValues = function (wasmContext, initialValues, finalValues, interpolatedValues, progress) {
         var size = initialValues.size();
         if (size !== finalValues.size()) {
-            throw new Error("DoubleVectors with initialValues and initialValues must have the same length");
+            throw new Error("DoubleVectors with initialValues and finalValues must have the same length");
         }
         interpolatedValues.resize(size, 0);
         for (var i = 0; i < size; i++) {

package/Charting/Visuals/RenderableSeries/Animations/WaveAnimation.js

@@ -21,8 +21,9 @@ var SeriesAnimation_1 = require("./SeriesAnimation");
 var WaveAnimation = /** @class */ (function (_super) {
     __extends(WaveAnimation, _super);
     function WaveAnimation(options) {
+        var _this = this;
         var _a, _b;
-        var _this = _super.call(this, options) || this;
+        _this = _super.call(this, options) || this;
         /** @inheritDoc */
         _this.type = AnimationType_1.EAnimationType.Wave;
         /**

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

@@ -4,6 +4,7 @@ import { XyyPointSeriesResampled } from "../../Model/PointSeries/XyyPointSeriesR
 import { ResamplingParams } from "../../Numerics/Resamplers/ResamplingParams";
 import { IThemeProvider } from "../../Themes/IThemeProvider";
 import { BaseRenderableSeries } from "./BaseRenderableSeries";
+import { IBandSeriesDataLabelProviderOptions } from "./DataLabels/BandSeriesDataLabelProvider";
 import { IHitTestProvider } from "./HitTest/IHitTestProvider";
 import { IBaseRenderableSeriesOptions } from "./IBaseRenderableSeriesOptions";
 /**
@@ -33,6 +34,10 @@ export interface IBaseBandRenderableSeriesOptions extends IBaseRenderableSeriesO
      * Accepts an array of values, e.g. [2,2] will have a line of length 2 and a gap of length 2.
      */
     strokeY1DashArray?: number[];
+    /**
+     * Options to pass to the {@link DataLabelProvider}. Set a style with font and size to enable per-point text for this series.
+     */
+    dataLabels?: IBandSeriesDataLabelProviderOptions;
 }
 export declare abstract class BaseBandRenderableSeries extends BaseRenderableSeries {
     protected pointSeries: XyyPointSeriesResampled;
@@ -104,5 +109,7 @@ export declare abstract class BaseBandRenderableSeries extends BaseRenderableSer
     /** @inheritDoc */
     toJSON(excludeData?: boolean): import("../../../Builder/buildSeries").TSeriesDefinition;
     /** @inheritDoc */
+    resolveAutoColors(index: number, maxSeries: number, theme: IThemeProvider): void;
+    /** @inheritDoc */
     protected newHitTestProvider(): IHitTestProvider;
 }

package/Charting/Visuals/RenderableSeries/BaseBandRenderableSeries.js

@@ -16,19 +16,23 @@ var __extends = (this && this.__extends) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.BaseBandRenderableSeries = void 0;
+var Deleter_1 = require("../../../Core/Deleter");
 var XyyPointSeriesResampled_1 = require("../../Model/PointSeries/XyyPointSeriesResampled");
 var XyyPointSeriesWrapped_1 = require("../../Model/PointSeries/XyyPointSeriesWrapped");
+var IThemeProvider_1 = require("../../Themes/IThemeProvider");
 var SciChartSurfaceBase_1 = require("../SciChartSurfaceBase");
 var BaseRenderableSeries_1 = require("./BaseRenderableSeries");
 var constants_1 = require("./constants");
+var BandSeriesDataLabelProvider_1 = require("./DataLabels/BandSeriesDataLabelProvider");
 var BandSeriesDrawingProvider_1 = require("./DrawingProviders/BandSeriesDrawingProvider");
 var PointMarkerDrawingProvider_1 = require("./DrawingProviders/PointMarkerDrawingProvider");
 var BandSeriesHitTestProvider_1 = require("./HitTest/BandSeriesHitTestProvider");
 var BaseBandRenderableSeries = /** @class */ (function (_super) {
     __extends(BaseBandRenderableSeries, _super);
     function BaseBandRenderableSeries(webAssemblyContext, options) {
+        var _this = this;
         var _a, _b, _c, _d;
-        var _this = _super.call(this, webAssemblyContext, options) || this;
+        _this = _super.call(this, webAssemblyContext, options) || this;
         _this.stroke = (_a = options === null || options === void 0 ? void 0 : options.stroke) !== null && _a !== void 0 ? _a : SciChartSurfaceBase_1.SciChartSurfaceBase.DEFAULT_THEME.downBandSeriesLineColor;
         _this.strokeY1Property = (_b = options === null || options === void 0 ? void 0 : options.strokeY1) !== null && _b !== void 0 ? _b : SciChartSurfaceBase_1.SciChartSurfaceBase.DEFAULT_THEME.upBandSeriesLineColor;
         _this.fillProperty = (_c = options === null || options === void 0 ? void 0 : options.fill) !== null && _c !== void 0 ? _c : SciChartSurfaceBase_1.SciChartSurfaceBase.DEFAULT_THEME.upBandSeriesFillColor;
@@ -38,6 +42,10 @@ var BaseBandRenderableSeries = /** @class */ (function (_super) {
         _this.drawingProviders.push(new BandSeriesDrawingProvider_1.BandSeriesDrawingProvider(webAssemblyContext, _this));
         _this.drawingProviders.push(new PointMarkerDrawingProvider_1.PointMarkerDrawingProvider(webAssemblyContext, _this));
         _this.drawingProviders.push(new PointMarkerDrawingProvider_1.PointMarkerDrawingProvider(webAssemblyContext, _this, function (ps) { return ps.y1Values; }, function (rs) { return rs.y1SplineValues; }));
+        if (!_this.dataLabelProviderProperty) {
+            _this.dataLabelProviderProperty = new BandSeriesDataLabelProvider_1.BandSeriesDataLabelProvider(options === null || options === void 0 ? void 0 : options.dataLabels);
+            _this.dataLabelProviderProperty.onAttach(_this.webAssemblyContext, _this);
+        }
         if (options === null || options === void 0 ? void 0 : options.animation) {
             _this.animationQueue.push(options.animation);
         }
@@ -67,14 +75,16 @@ var BaseBandRenderableSeries = /** @class */ (function (_super) {
          * Gets or sets the fill color for when Y is less than Y as an HTML Color code
          */
         get: function () {
-            return this.fillProperty;
+            return (0, IThemeProvider_1.stripAutoColor)(this.fillProperty);
         },
         /**
          * Gets or sets the fill color for when Y is less than Y1 as an HTML Color code
          */
         set: function (fill) {
-            this.fillProperty = fill;
-            this.notifyPropertyChanged(constants_1.PROPERTY.FILL);
+            if (this.fillProperty !== fill) {
+                this.fillProperty = fill;
+                this.notifyPropertyChanged(constants_1.PROPERTY.FILL);
+            }
         },
         enumerable: false,
         configurable: true
@@ -85,15 +95,17 @@ var BaseBandRenderableSeries = /** @class */ (function (_super) {
          * See associated {@link XyyDataSeries} for further information
          */
         get: function () {
-            return this.strokeY1Property;
+            return (0, IThemeProvider_1.stripAutoColor)(this.strokeY1Property);
         },
         /**
          * Gets or sets the stroke color the Y1 values in the data-series.
          * See associated {@link XyyDataSeries} for further information
          */
         set: function (strokeY1) {
-            this.strokeY1Property = strokeY1;
-            this.notifyPropertyChanged(constants_1.PROPERTY.STROKE_Y1);
+            if (this.strokeY1Property !== strokeY1) {
+                this.strokeY1Property = strokeY1;
+                this.notifyPropertyChanged(constants_1.PROPERTY.STROKE_Y1);
+            }
         },
         enumerable: false,
         configurable: true
@@ -103,14 +115,16 @@ var BaseBandRenderableSeries = /** @class */ (function (_super) {
          * Gets or sets the fill color for when Y1 is less than Y as an HTML Color code
          */
         get: function () {
-            return this.fillY1Property;
+            return (0, IThemeProvider_1.stripAutoColor)(this.fillY1Property);
         },
         /**
          * Gets or sets the fill color for when Y1 is less than Y as an HTML Color code
          */
         set: function (fillY1) {
-            this.fillY1Property = fillY1;
-            this.notifyPropertyChanged(constants_1.PROPERTY.FILL_Y1);
+            if (this.fillY1Property !== fillY1) {
+                this.fillY1Property = fillY1;
+                this.notifyPropertyChanged(constants_1.PROPERTY.FILL_Y1);
+            }
         },
         enumerable: false,
         configurable: true
@@ -162,6 +176,7 @@ var BaseBandRenderableSeries = /** @class */ (function (_super) {
     /** @inheritDoc */
     BaseBandRenderableSeries.prototype.delete = function () {
         _super.prototype.delete.call(this);
+        this.xyyTempPointSeries = (0, Deleter_1.deleteSafe)(this.xyyTempPointSeries);
     };
     /** @inheritDoc */
     BaseBandRenderableSeries.prototype.toPointSeries = function (rp) {
@@ -220,6 +235,23 @@ var BaseBandRenderableSeries = /** @class */ (function (_super) {
         return json;
     };
     /** @inheritDoc */
+    BaseBandRenderableSeries.prototype.resolveAutoColors = function (index, maxSeries, theme) {
+        _super.prototype.resolveAutoColors.call(this, index, maxSeries, theme);
+        if (this.fillProperty.startsWith(IThemeProvider_1.AUTO_COLOR)) {
+            var color = theme.getFillColor(index, maxSeries, this.webAssemblyContext);
+            this.fill = IThemeProvider_1.AUTO_COLOR + this.adjustAutoColor("fill", color);
+        }
+        var y1Index = (index + Math.floor(maxSeries / 2)) % maxSeries;
+        if (this.strokeY1Property.startsWith(IThemeProvider_1.AUTO_COLOR)) {
+            var color = theme.getStrokeColor(y1Index, maxSeries, this.webAssemblyContext);
+            this.strokeY1 = IThemeProvider_1.AUTO_COLOR + this.adjustAutoColor("strokeY1", color);
+        }
+        if (this.fillY1Property.startsWith(IThemeProvider_1.AUTO_COLOR)) {
+            var color = theme.getFillColor(y1Index, maxSeries, this.webAssemblyContext);
+            this.fillY1 = IThemeProvider_1.AUTO_COLOR + this.adjustAutoColor("fillY1", color);
+        }
+    };
+    /** @inheritDoc */
     BaseBandRenderableSeries.prototype.newHitTestProvider = function () {
         return new BandSeriesHitTestProvider_1.BandSeriesHitTestProvider(this, this.webAssemblyContext);
     };

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

@@ -0,0 +1,128 @@
+import { PropertyChangedEventArgs } from "../../../Core/PropertyChangedEventArgs";
+import { TSciChart } from "../../../types/TSciChart";
+import { BaseHeatmapDataSeries } from "../../Model/BaseHeatmapDataSeries";
+import { IPointSeries } from "../../Model/PointSeries/IPointSeries";
+import { ResamplingParams } from "../../Numerics/Resamplers/ResamplingParams";
+import { LabelProvider } from "../Axis/LabelProvider/LabelProvider";
+import { BaseRenderableSeries } from "./BaseRenderableSeries";
+import { IHeatmapDataLabelProviderOptions } from "./DataLabels/HeatMapDataLabelProvider";
+import { HeatmapColorMap, IHeatmapColorMapOptions } from "./HeatmapColorMap";
+import { IBaseRenderableSeriesOptions } from "./IBaseRenderableSeriesOptions";
+/**
+ * Optional parameters passed to {@link BaseHeatmapRenderableSeries} constructor
+ */
+export interface IHeatmapRenderableSeriesOptions extends IBaseRenderableSeriesOptions {
+    /**
+     * The {@link HeatmapColorMap} instance, which maps heatmap z-values to colors
+     * or an {@link IHeatmapColorMapOptions} object which will be used to build a HeatmapColorMap
+     */
+    colorMap?: HeatmapColorMap | IHeatmapColorMapOptions;
+    /**
+     * The {@link BaseHeatmapDataSeries} instance containing 2-dimensional heatmap data
+     */
+    dataSeries?: BaseHeatmapDataSeries;
+    /**
+     * The flag whether to make the heatmap linearly interpolated or smoothed between cells. Default false
+     */
+    useLinearTextureFiltering?: boolean;
+    /**
+     * The flag whether to fill cells with edge color if its value is outside of {@link colorMap.minimum} to {@link colorMap.maximum} range
+     */
+    fillValuesOutOfRange?: boolean;
+    /**
+     * Options to pass to the DataLabelProvider. Set a style with font and size to enable per-point text for this series.
+     */
+    dataLabels?: IHeatmapDataLabelProviderOptions;
+}
+/** @ignore */
+export declare const COLOR_MAP_PREFIX = "colorMap.";
+/**
+ * @summary A JavaScript Heatmap chart type rendering a 2-dimensional array of data as color values between X,Y bounds in
+ * SciChart's High Performance Real-time {@link https://www.scichart.com/javascript-chart-features | JavaScript Chart Library}
+ * @description
+ * Heatmaps are 2-dimensional arrays of data, rendered as a color-map on the chart. The {@link UniformHeatmapRenderableSeries}
+ * assumes the cells are equal size, and spaced along the X,Y axis according to properties on the {@link UniformHeatmapDataSeries}.
+ *
+ * For a code sample how to initialize a uniform heatmap, see below
+ *
+ * ```ts
+ * // Create an empty 2D array using the helper function zeroArray2D
+ * const zValues: number[][] = zeroArray2D([height, width]);
+ * // todo: fill the zValues 2d array with values
+ *
+ * // Create a UniformHeatmapDataSeries passing in zValues
+ * const heatmapDataSeries = new UniformHeatmapDataSeries(wasmContext, 0, 1, 0, 1, zValues);
+ *
+ * // Create a Heatmap RenderableSeries with the color map. ColorMap.minimum/maximum defines the values in
+ * // HeatmapDataSeries which correspond to gradient stops at 0..1
+ * const heatmapSeries = new UniformHeatmapRenderableSeries(wasmContext, {
+ *        dataSeries: heatmapDataSeries,
+ *        colorMap: new HeatmapColorMap({
+ *            minimum: 0,
+ *           maximum: 200,
+ *           gradientStops: [
+ *               { offset: 0, color: "#00008B" },
+ *               { offset: 0.2, color: "#6495ED" },
+ *               { offset: 0.4, color: "#006400" },
+ *               { offset: 0.6, color: "#7FFF00" },
+ *               { offset: 0.8, color: "#FFFF00" },
+ *               { offset: 1.0, color: "#FF0000" }
+ *           ]
+ *       })
+ *   });
+ *
+ * // Add heatmap to the chart
+ * sciChartSurface.renderableSeries.add(heatmapSeries);
+ * ```
+ */
+export declare abstract class BaseHeatmapRenderableSeries extends BaseRenderableSeries {
+    private colorMapProperty;
+    private useLinearTextureFilteringProperty;
+    private fillValuesOutOfRangeProperty;
+    private zLabelProviderProperty;
+    /**
+     * Creates an instance of the {@link UniformHeatmapRenderableSeries}
+     * @param webAssemblyContext The {@link TSciChart | SciChart WebAssembly Context} containing
+     * native methods and access to our WebGL2 WebAssembly Drawing Engine
+     * @param options optional parameters of type {@link IHeatmapRenderableSeriesOptions} applied when constructing the series type
+     */
+    constructor(webAssemblyContext: TSciChart, options?: IHeatmapRenderableSeriesOptions);
+    /**
+     * Gets or sets the {@link HeatmapColorMap}, which maps heatmap z-values to colors
+     */
+    get colorMap(): HeatmapColorMap;
+    /**
+     * Gets or sets the {@link HeatmapColorMap}, which maps heatmap z-values to colors
+     */
+    set colorMap(colorMap: HeatmapColorMap);
+    /**
+     * Gets or sets whether to make the heatmap linearly interpolated or smoothed between cells
+     */
+    get useLinearTextureFiltering(): boolean;
+    /**
+     * Gets or sets whether to make the heatmap linearly interpolated or smoothed between cells
+     */
+    set useLinearTextureFiltering(value: boolean);
+    /** @inheritDoc */
+    checkIsOutOfDataRange(xValue: number, yValue: number): boolean;
+    get zLabelProvider(): LabelProvider;
+    set zLabelProvider(labelProvider: LabelProvider);
+    /**
+     * Gets or sets whether to fill cells with edge color if its value is outside of {@link colorMap.minimum} to {@link colorMap.maximum} range
+     */
+    get fillValuesOutOfRange(): boolean;
+    /**
+     * Gets or sets whether to fill cells with edge color if its value is outside of {@link colorMap.minimum} to {@link colorMap.maximum} range
+     */
+    set fillValuesOutOfRange(value: boolean);
+    /** @inheritDoc */
+    toPointSeries(resamplingParams?: ResamplingParams): IPointSeries;
+    /** @inheritDoc */
+    toJSON(excludeData?: boolean): import("../../../Builder/buildSeries").TSeriesDefinition;
+    /**
+     * Called when a property changes on {@link HeatmapColorMap}, and notifies the parent {@link SciChartSurface}
+     * that a redraw is required.
+     * @param args
+     */
+    protected colorMapPropertyChanged(args: PropertyChangedEventArgs): void;
+}