@hpcc-js/chart 2.81.10 → 2.83.1

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.81.10";
-  var BUILD_VERSION = "2.104.37";
+  var PKG_VERSION = "2.83.1";
+  var BUILD_VERSION = "2.105.2";
 
   /******************************************************************************
   Copyright (c) Microsoft Corporation.
@@ -1894,7 +1894,7 @@
           this.svg.style("display", this.hidden() ? "none" : null);
           var overlap = this.calcOverflow(element);
           var lowerPos = this.isHorizontal() ? overlap.left : this.height() - overlap.top - overlap.bottom;
-          var upperPos = this.isHorizontal() ? this.width() - overlap.right : 0;
+          var upperPos = this.isHorizontal() ? this.width() - overlap.right - this.padding() : 0 + this.padding();
           this.range(this.reverse() ? [upperPos, lowerPos] : [lowerPos, upperPos]);
           var context = this;
           function doPosition(element) {
@@ -2022,6 +2022,7 @@
   Axis.prototype.publish("ordinalPaddingInner", 0.1, "number", "Determines the ratio of the range that is reserved for blank space between band (0->1)", null, { disable: function (w) { return w.type() !== "ordinal"; } });
   Axis.prototype.publish("ordinalPaddingOuter", 0.1, "number", "Determines the ratio of the range that is reserved for blank space before the first band and after the last band (0->1)", null, { disable: function (w) { return w.type() !== "ordinal"; } });
   Axis.prototype.publish("ordinalMappings", null, "object", "Alternative label mappings (icons)", null, { optional: true });
+  Axis.prototype.publish("padding", 0, "number", "Padding space at top of axis (pixels)", null, { optional: true });
 
   var css_248z$b = ".chart_XYAxis .axis{fill:#000}.chart_XYAxis .axis,.chart_XYAxis .tick>text{font:10px sans-serif}.chart_XYAxis .focus .chart_Axis.value .tick{visibility:hidden}.chart_XYAxis .axis line,.chart_XYAxis .axis path{fill:none;stroke:#000;shape-rendering:crispEdges}.chart_XYAxis .region{opacity:.33}.chart_XYAxis .brush rect.background{z-index:-999}.chart_XYAxis .brush .selection{stroke:#4682b4;stroke-opacity:1;stroke-width:1px;fill:#4682b4;fill-opacity:.125;shape-rendering:crispEdges}.chart_XYAxis .brush path.handle--custom{fill:#eee;stroke:#666}";
   styleInject(css_248z$b);
@@ -2615,6 +2616,8 @@
   XYAxis.prototype.publishProxy("yAxisHidden", "valueAxis", "hidden");
   XYAxis.prototype.publish("regions", [], "array", "Regions");
   XYAxis.prototype.publish("layers", [], "widgetArray", "Layers", null, { render: false });
+  XYAxis.prototype.publishProxy("xAxisPadding", "domainAxis", "padding");
+  XYAxis.prototype.publishProxy("yAxisPadding", "valueAxis", "padding");
 
   var css_248z$a = ".chart_Scatter .area,.chart_Scatter .line,.chart_Scatter .pointShape{pointer-events:none}.chart_Scatter .point .pointSelection{fill:none;stroke:none;pointer-events:all}.chart_Scatter .point .pointSelection.selected{fill:none;stroke:red}";
   styleInject(css_248z$a);
@@ -2934,6 +2937,7 @@
       function Column() {
           var _this = _super.call(this) || this;
           _this.textLocal = common.local();
+          _this.stackedTextLocal = common.local();
           api.INDChart.call(_this);
           api.ITooltip.call(_this);
           _this._selection.skipBringToTop(true);
@@ -2995,6 +2999,7 @@
           if (this.useClonedPalette()) {
               this._palette = this._palette.cloneNotExists(this.paletteID() + "_" + this.id());
           }
+          var formatPct = common.format(context.showValueAsPercentFormat());
           var dataLen = 10;
           var offset = 0;
           switch (host.xAxisType()) {
@@ -3014,30 +3019,26 @@
               .rangeRound(isHorizontal ? [0, dataLen] : [dataLen, 0])
               .paddingInner(this.xAxisSeriesPaddingInner())
               .paddingOuter(0);
-          var rowData = this.adjustedData(host);
           var domainSums = [];
           var seriesSums = [];
           var columnLength = this.columns().length;
-          if (this.showValue()) {
-              switch (this.showValueAsPercent()) {
-                  case "series":
-                      rowData.forEach(function (row) {
-                          row.filter(function (_, idx) { return idx > 0 && idx < columnLength; }).forEach(function (col, idx) {
-                              if (seriesSums[idx + 1] === undefined) {
-                                  seriesSums[idx + 1] = 0;
-                              }
-                              seriesSums[idx + 1] += col;
-                          });
-                      });
-                      break;
-                  case "domain":
-                      domainSums = rowData.map(function (row) {
-                          return row.filter(function (cell, idx) { return idx > 0 && idx < columnLength; }).reduce(function (sum, cell) {
-                              return sum + cell;
-                          }, 0);
-                      });
-                      break;
-              }
+          var rowData = this.data();
+          if (this.showValue() && this.showValueAsPercent() === "series") {
+              rowData.forEach(function (row) {
+                  row.filter(function (_, idx) { return idx > 0 && idx < columnLength; }).forEach(function (col, idx) {
+                      if (seriesSums[idx + 1] === undefined) {
+                          seriesSums[idx + 1] = 0;
+                      }
+                      seriesSums[idx + 1] += col;
+                  });
+              });
+          }
+          if (this.showDomainTotal() || (this.showValue() && this.showValueAsPercent() === "domain")) {
+              domainSums = rowData.map(function (row) {
+                  return row.filter(function (cell, idx) { return idx > 0 && idx < columnLength; }).reduce(function (sum, cell) {
+                      return sum + cell;
+                  }, 0);
+              });
           }
           var column = element.selectAll(".dataRow")
               .data(this.adjustedData(host));
@@ -3099,11 +3100,11 @@
                       switch (context.showValueAsPercent()) {
                           case "series":
                               var seriesSum = typeof dm.sum !== "undefined" ? dm.sum : seriesSums[d.idx];
-                              valueText = common.format(context.showValueAsPercentFormat())(valueText / seriesSum);
+                              valueText = formatPct(valueText / seriesSum);
                               break;
                           case "domain":
-                              var domainSum = typeof dm.sum !== "undefined" ? dm.sum : domainSums[d.idx];
-                              valueText = common.format(context.showValueAsPercentFormat())(valueText / domainSum);
+                              var domainSum = typeof dm.sum !== "undefined" ? dm.sum : domainSums[dataRowIdx];
+                              valueText = formatPct(valueText / domainSum);
                               break;
                           case null:
                           default:
@@ -3316,7 +3317,8 @@
                       var textColor = isOutside ? null : context.textColor(d.row, d.column, d.value, d.origRow);
                       //  Prevent overlapping labels on stacked columns
                       var columns = context.columns();
-                      var hideValue = isOutside && context.yAxisStacked() && columns.indexOf(d.column) !== columns.length - 1;
+                      var hideValue = (context.yAxisStacked() && noRoomInside) ||
+                          (isOutside && context.yAxisStacked() && columns.indexOf(d.column) !== columns.length - 1);
                       context.textLocal.get(this)
                           .pos(pos)
                           .anchor(valueAnchor)
@@ -3336,6 +3338,55 @@
               columnGRect.exit().transition().duration(duration)
                   .style("opacity", 0)
                   .remove();
+              var value4pos = host.yAxisStacked() ? domainSums[dataRowIdx] : Math.max.apply(Math, dataRow.filter(function (_, idx) { return idx > 0 && idx < columnLength; }));
+              var stackedTotalText = element.selectAll(".stackedTotalText").data(context.showDomainTotal() ? [domainSums[dataRowIdx]] : []);
+              var stackedTotalTextEnter = stackedTotalText.enter().append("g")
+                  .attr("class", "stackedTotalText")
+                  .each(function (d) {
+                  context.stackedTextLocal.set(this, new common.Text().target(this).colorStroke_default("transparent"));
+              });
+              stackedTotalTextEnter.merge(stackedTotalText)
+                  .each(function (d) {
+                  var pos = { x: 0, y: 0 };
+                  var domainPos = host.dataPos(dataRow[0]);
+                  var valuePos = host.valuePos(value4pos);
+                  var valueFontFamily = context.valueFontFamily();
+                  var valueFontSize = context.valueFontSize();
+                  var textSize = context.textSize(d, valueFontFamily, valueFontSize);
+                  var isPositive = parseFloat(d) >= 0;
+                  var valueAnchor = "middle";
+                  if (isHorizontal) {
+                      pos.x = domainPos;
+                      if (isPositive) {
+                          pos.y = valuePos - textSize.height / 2;
+                      }
+                      else {
+                          pos.y = valuePos + textSize.height / 2;
+                      }
+                  }
+                  else {
+                      valueAnchor = "start";
+                      pos.y = domainPos;
+                      if (isPositive) {
+                          pos.x = valuePos + textSize.width / 2;
+                      }
+                      else {
+                          pos.x = valuePos - textSize.width / 2;
+                      }
+                  }
+                  context.stackedTextLocal.get(this)
+                      .pos(pos)
+                      .anchor(valueAnchor)
+                      .fontFamily(valueFontFamily)
+                      .fontSize(valueFontSize)
+                      .text(d)
+                      .render();
+              });
+              stackedTotalText.exit()
+                  .each(function (d) {
+                  context.textLocal.get(this).target(null);
+              })
+                  .remove();
           });
           column.exit().transition().duration(duration)
               .remove();
@@ -3422,6 +3473,7 @@
   Column.prototype.publish("showValueFormat", ",", "string", "D3 Format for Value", null, { disable: function (w) { return !w.showValue() || !!w.showValueAsPercent(); } });
   Column.prototype.publish("showValueAsPercent", null, "set", "If showValue is true, optionally show value as a percentage by Series or Domain", [null, "series", "domain"], { disable: function (w) { return !w.showValue(); }, optional: true });
   Column.prototype.publish("showValueAsPercentFormat", ".0%", "string", "D3 Format for %", null, { disable: function (w) { return !w.showValue() || !w.showValueAsPercent(); } });
+  Column.prototype.publish("showDomainTotal", false, "boolean", "Show Total Value for Stacked Columns", null);
   Column.prototype.publish("valueCentered", false, "boolean", "Show Value in center of column");
   Column.prototype.publish("valueAnchor", "middle", "set", "text-anchor for shown value text", ["start", "middle", "end"]);
   Column.prototype.publish("xAxisSeriesPaddingInner", 0, "number", "Determines the ratio of the range that is reserved for blank space between band (0->1)");