@hpcc-js/chart 2.84.0 → 2.85.0

package/dist/index.js

@@ -5,8 +5,8 @@
 })(this, (function (exports, api, common, util) { 'use strict';
 
   var PKG_NAME = "@hpcc-js/chart";
-  var PKG_VERSION = "2.84.0";
-  var BUILD_VERSION = "2.106.0";
+  var PKG_VERSION = "2.85.0";
+  var BUILD_VERSION = "2.106.4";
 
   /******************************************************************************
   Copyright (c) Microsoft Corporation.
@@ -9043,6 +9043,8 @@
   var css_248z$6 = ".chart_Pie path,.chart_Pie>g>text{cursor:pointer}.chart_Pie .arc path{stroke:#fff;stroke-width:.75px}.chart_Pie .arc.selected path{stroke:red;stroke-width:1.5px}.chart_Pie polyline{stroke:#000;stroke-width:2px;fill:none;opacity:.3}";
   styleInject(css_248z$6);
 
+  var sortAscending = function (a, b) { return a[1] - b[1] > 0 ? 1 : -1; };
+  var sortDescending = function (a, b) { return a[1] - b[1] > 0 ? -1 : 1; };
   var Pie = /** @class */ (function (_super) {
       __extends(Pie, _super);
       function Pie() {
@@ -9189,9 +9191,15 @@
               .padRadius(outerRadius)
               .outerRadius(outerRadius);
           this._quadIdxArr = [[], [], [], []];
-          var data = __spreadArray([], __read(this.data()), false).sort(function (a, b) {
-              return a[1] - b[1] > 0 ? -1 : 1;
-          });
+          var data = __spreadArray([], __read(this.data()), false);
+          switch (this.sortDataByValue()) {
+              case "ascending":
+                  data.sort(sortAscending);
+                  break;
+              case "descending":
+                  data.sort(sortDescending);
+                  break;
+          }
           var arc = this._slices.selectAll(".arc").data(this.d3Pie(data), function (d) { return d.data[0]; });
           this._labelPositions = [];
           //  Enter  ---
@@ -9393,13 +9401,20 @@
       };
       Pie.prototype.updateD3Pie = function () {
           var startAngle = util.normalizeRadians(util.degreesToRadians(this.startAngle()));
+          switch (this.sortDataByValue()) {
+              case "ascending":
+                  this.d3Pie.sort(sortAscending);
+                  break;
+              case "descending":
+                  this.d3Pie.sort(sortDescending);
+                  break;
+              default:
+                  this.d3Pie.sort(null);
+          }
           this.d3Pie
               .padAngle(0.0025)
               .startAngle(startAngle)
               .endAngle(2 * Math.PI + startAngle)
-              .sort(function (b, a) {
-              return a[1] < b[1] ? -1 : a[1] > b[1] ? 1 : 0;
-          })
               .value(function (d) {
               return d[1];
           });
@@ -9428,6 +9443,7 @@
   Pie.prototype.publish("minOuterRadius", 20, "number", "Minimum outer radius (pixels)");
   Pie.prototype.publish("startAngle", 0, "number", "Starting angle of the first (and largest) wedge (degrees)");
   Pie.prototype.publish("labelHeight", 12, "number", "Font size of labels (pixels)", null, { disable: function (w) { return !w.showLabels(); } });
+  Pie.prototype.publish("sortDataByValue", "descending", "set", "Sort data by value", ["none", "ascending", "descending"]);
 
   var HalfPie = /** @class */ (function (_super) {
       __extends(HalfPie, _super);
@@ -9623,6 +9639,12 @@
           // draw a grayscale heatmap by putting a blurred ellipse at each data point
           for (var i = 0, len = this._data.length, p = void 0; i < len; i++) {
               p = this._data[i];
+              if (p[2] < 0) {
+                  p[2] = 0;
+              }
+              else if (p[2] > this._max) {
+                  p[2] = this._max;
+              }
               ctx.globalAlpha = Math.max(p[2] / this._max, minOpacity === undefined ? 0.05 : minOpacity);
               ctx.drawImage(this._ellipse, p[0] - this._r, p[1] - this._r);
           }
@@ -10647,7 +10669,7 @@
   var StatChart = /** @class */ (function (_super) {
       __extends(StatChart, _super);
       function StatChart() {
-          var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
+          var _this = _super.call(this) || this;
           _this._bellCurve = new Scatter()
               .columns(["", "Std. Dev."])
               .paletteID("Quartile")
@@ -10671,6 +10693,8 @@
               .valueFontSize(0)
               .lineColor(rainbow(90, 0, 100))
               .innerRectColor(rainbow(10, 0, 100));
+          _this
+              .columns(["Min", "25%", "50%", "75%", "Max", "Mean", "Std. Dev."]);
           return _this;
       }
       StatChart.prototype.stdDev = function (degrees) {
@@ -10680,7 +10704,7 @@
           return this._tickFormatter(this.stdDev(degrees));
       };
       StatChart.prototype.quartile = function (q) {
-          return this.data()[0][q];
+          return this.quartiles()[q];
       };
       StatChart.prototype.formatQ = function (q) {
           return this._tickFormatter(this.quartile(q));
@@ -10696,31 +10720,19 @@
                   return [this.quartile(0), this.quartile(4)];
           }
       };
-      StatChart.prototype.mean = function (_) {
-          if (!arguments.length)
-              return this._mean;
-          this._mean = _;
-          if (this.data()[0]) {
-              this.data()[0][5] = _;
-          }
-          return this;
+      StatChart.prototype.min = function () {
+          return this.quartile(0);
       };
-      StatChart.prototype.standardDeviation = function (_) {
-          if (!arguments.length)
-              return this._standardDeviation;
-          this._standardDeviation = _;
-          if (this.data()[0]) {
-              this.data()[0][6] = _;
-          }
-          return this;
+      StatChart.prototype.max = function () {
+          return this.quartile(4);
       };
-      StatChart.prototype.quartiles = function (_) {
+      StatChart.prototype.data = function (_) {
           if (!arguments.length)
-              return this._quartiles;
-          this._quartiles = _;
-          if (this.data()[0]) {
-              this.data()[0] = _.concat(this.data()[0].slice(-2));
-          }
+              return [__spreadArray(__spreadArray([], __read(this.quartiles()), false), [this.mean(), this.standardDeviation()], false)];
+          var row = _[0];
+          this.quartiles([row[0], row[1], row[2], row[3], row[4]]);
+          this.mean(row[5]);
+          this.standardDeviation(row[6]);
           return this;
       };
       StatChart.prototype.enter = function (domNode, element) {
@@ -10728,16 +10740,17 @@
           _super.prototype.enter.call(this, domNode, element);
           this._bellCurve.target(element.append("div").node());
           this._candle.target(element.append("div").node());
-          this._selectMode = element.append("div")
+          this._selectElement = element.append("div")
               .style("position", "absolute")
               .style("top", "0px")
               .style("right", "0px").append("select")
               .on("change", function () {
-              _this.render();
+              _this.view(_this._selectElement.node().value);
+              _this.lazyRender();
           });
-          this._selectMode.append("option").attr("value", "min_max").text("Min / Max");
-          this._selectMode.append("option").attr("value", "25_75").text("25% / 75%");
-          this._selectMode.append("option").attr("value", "normal").text("Normal");
+          this._selectElement.append("option").attr("value", "min_max").text("Min / Max");
+          this._selectElement.append("option").attr("value", "25_75").text("25% / 75%");
+          this._selectElement.append("option").attr("value", "normal").text("Normal");
       };
       StatChart.prototype.bellTicks = function (mode) {
           var ticks;
@@ -10772,13 +10785,13 @@
                       { label: this.formatQ(4), value: this.quartile(4) }
                   ];
           }
-          var _a = __read(this.domain(this._selectMode.node().value), 2), domainLow = _a[0], domainHigh = _a[1];
+          var _a = __read(this.domain(this._selectElement.node().value), 2), domainLow = _a[0], domainHigh = _a[1];
           return ticks
               .filter(function (sd) { return sd.value >= domainLow && sd.value <= domainHigh; })
               .map(function (sd) { return ({ label: sd.label, value: sd.value.toString() }); });
       };
       StatChart.prototype.updateScatter = function () {
-          var mode = this._selectMode.node().value;
+          var mode = this._selectElement.node().value;
           var _a = __read(this.domain(mode), 2), domainLow = _a[0], domainHigh = _a[1];
           var padding = (domainHigh - domainLow) * (this.domainPadding() / 100);
           this._bellCurve
@@ -10813,19 +10826,20 @@
       StatChart.prototype.update = function (domNode, element) {
           _super.prototype.update.call(this, domNode, element);
           this._tickFormatter = myFormatter(this.tickFormat());
-          if (this.data()[0] && this.data()[0].length === 7) {
-              this.quartiles(this.data()[0].slice(0, 5));
-              this.mean(this.data()[0][5]);
-              this.standardDeviation(this.data()[0][6]);
-          }
+          this._selectElement.node().value = this.view();
           this.updateScatter();
           this.updateCandle();
       };
       return StatChart;
   }(common.HTMLWidget));
+  StatChart.prototype._class += " chart_Stat";
+  StatChart.prototype.publish("view", "min_max", "set", "View", ["min_max", "25_75", "normal"]);
   StatChart.prototype.publish("tickFormat", ".2e", "string", "X-Axis Tick Format");
   StatChart.prototype.publish("candleHeight", 20, "number", "Height of candle widget (pixels)");
   StatChart.prototype.publish("domainPadding", 10, "number", "Domain value padding");
+  StatChart.prototype.publish("mean", .5, "number", "Mean");
+  StatChart.prototype.publish("standardDeviation", .125, "number", "Standard Deviation (σ)");
+  StatChart.prototype.publish("quartiles", [0, .25, .5, .75, 1], "object", "Quartiles (Min, 25%, 50%, 75%, Max)");
 
   var Step = /** @class */ (function (_super) {
       __extends(Step, _super);