@carbon/charts-vue 0.54.2 → 0.54.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/charts-vue.umd.js CHANGED
@@ -9722,7 +9722,7 @@ var model_ChartModel = /** @class */ (function () {
9722
9722
  };
9723
9723
  ChartModel.prototype.getStackKeys = function (_a) {
9724
9724
  var _this = this;
9725
- var _b = _a.bins, bins = _b === void 0 ? null : _b, _c = _a.groups, groups = _c === void 0 ? null : _c;
9725
+ var _b = _a === void 0 ? { bins: null, groups: null } : _a, _c = _b.bins, bins = _c === void 0 ? null : _c, _d = _b.groups, groups = _d === void 0 ? null : _d;
9726
9726
  var options = this.getOptions();
9727
9727
  var displayData = this.getDisplayData(groups);
9728
9728
  var stackKeys;
@@ -24377,15 +24377,21 @@ var tooltip_axis_AxisChartsTooltip = /** @class */ (function (_super) {
24377
24377
  },
24378
24378
  ];
24379
24379
  items = items.concat(data
24380
- .map(function (datum) { return ({
24381
- label: datum[groupMapsTo],
24382
- value: datum[cartesianScales.getRangeIdentifier(datum)],
24383
- color: _this.model.getFillColor(datum[groupMapsTo]),
24384
- class: _this.model.getColorClassName({
24385
- classNameTypes: [ColorClassNameTypes.TOOLTIP],
24386
- dataGroupName: datum[groupMapsTo],
24387
- }),
24388
- }); })
24380
+ .map(function (datum) {
24381
+ // Format value if is array
24382
+ var value = datum[cartesianScales.getRangeIdentifier(datum)];
24383
+ return {
24384
+ label: datum[groupMapsTo],
24385
+ value: Array.isArray(value) && value.length === 2
24386
+ ? value[0] + " - " + value[1]
24387
+ : value,
24388
+ color: _this.model.getFillColor(datum[groupMapsTo]),
24389
+ class: _this.model.getColorClassName({
24390
+ classNameTypes: [ColorClassNameTypes.TOOLTIP],
24391
+ dataGroupName: datum[groupMapsTo],
24392
+ }),
24393
+ };
24394
+ })
24389
24395
  .sort(function (a, b) { return b.value - a.value; }));
24390
24396
  if (!dualAxes &&
24391
24397
  tools_Tools.getProperty(options, 'tooltip', 'showTotal') === true) {
@@ -25098,6 +25104,7 @@ var area_Area = /** @class */ (function (_super) {
25098
25104
  var _this = this;
25099
25105
  if (animate === void 0) { animate = true; }
25100
25106
  var svg = this.getComponentContainer({ withinChartClip: true });
25107
+ var options = this.getOptions();
25101
25108
  var domain = [0, 0];
25102
25109
  var cartesianScales = this.services.cartesianScales;
25103
25110
  var orientation = cartesianScales.getOrientation();
@@ -25113,15 +25120,26 @@ var area_Area = /** @class */ (function (_super) {
25113
25120
  });
25114
25121
  // Update the bound data on area groups
25115
25122
  var groupedData = this.model.getGroupedData(this.configs.groups);
25116
- var bounds = tools_Tools.getProperty(this.getOptions(), 'bounds');
25123
+ var bounds = tools_Tools.getProperty(options, 'bounds');
25117
25124
  var boundsEnabled = bounds && groupedData && groupedData.length === 1;
25118
25125
  if (!boundsEnabled && bounds) {
25119
25126
  console.warn("Bounds can only be shown when having 1 single datagroup, you've supplied " + groupedData.length); // eslint-disable-line no-console
25120
25127
  }
25128
+ var upperBoundRangeValue = 0;
25129
+ // If includeZero is enabled, we want to replace upperBoundRange from 0 to domain value
25130
+ var includeZeroInRangeValue = function (position, domain) {
25131
+ if (tools_Tools.getProperty(options, 'axes', position, 'includeZero') ===
25132
+ false) {
25133
+ // Replace upperBoundRangeValue if domain is positive
25134
+ if (domain[0] > 0 && domain[1] > 0) {
25135
+ upperBoundRangeValue = domain[0];
25136
+ }
25137
+ }
25138
+ };
25121
25139
  var upperBound = function (d, i) {
25122
25140
  return boundsEnabled
25123
25141
  ? cartesianScales.getBoundedScaledValues(d, i)[0]
25124
- : cartesianScales.getRangeValue(0);
25142
+ : cartesianScales.getRangeValue(upperBoundRangeValue);
25125
25143
  };
25126
25144
  var lowerBound = function (d, i) {
25127
25145
  return boundsEnabled
@@ -25129,21 +25147,23 @@ var area_Area = /** @class */ (function (_super) {
25129
25147
  : cartesianScales.getRangeValue(d, i);
25130
25148
  };
25131
25149
  if (orientation === CartesianOrientations.VERTICAL) {
25132
- domain = this.services.cartesianScales.getMainYScale().domain();
25150
+ domain = cartesianScales.getMainYScale().domain();
25151
+ includeZeroInRangeValue(cartesianScales.getMainYAxisPosition(), domain);
25133
25152
  areaGenerator
25134
25153
  .x(function (d, i) { return cartesianScales.getDomainValue(d, i); })
25135
25154
  .y0(function (d, i) { return upperBound(d, i); })
25136
25155
  .y1(function (d, i) { return lowerBound(d, i); });
25137
25156
  }
25138
25157
  else {
25139
- domain = this.services.cartesianScales.getMainXScale().domain();
25158
+ domain = cartesianScales.getMainXScale().domain();
25159
+ includeZeroInRangeValue(cartesianScales.getMainXAxisPosition(), domain);
25140
25160
  areaGenerator
25141
25161
  .x0(function (d, i) { return upperBound(d, i); })
25142
25162
  .x1(function (d, i) { return lowerBound(d, i); })
25143
25163
  .y(function (d, i) { return cartesianScales.getDomainValue(d, i); });
25144
25164
  }
25145
25165
  // Is gradient enabled or not
25146
- var isGradientEnabled = tools_Tools.getProperty(this.getOptions(), 'color', 'gradient', 'enabled');
25166
+ var isGradientEnabled = tools_Tools.getProperty(options, 'color', 'gradient', 'enabled');
25147
25167
  // Should gradient style be applicable
25148
25168
  var isGradientAllowed = groupedData && groupedData.length === 1 && isGradientEnabled;
25149
25169
  if (groupedData.length > 1 && isGradientEnabled) {
@@ -25991,6 +26011,7 @@ var bar_stacked_extends = (undefined && undefined.__extends) || (function () {
25991
26011
 
25992
26012
 
25993
26013
 
26014
+
25994
26015
  // D3 Imports
25995
26016
 
25996
26017
  var bar_stacked_StackedBar = /** @class */ (function (_super) {
@@ -26222,6 +26243,21 @@ var bar_stacked_StackedBar = /** @class */ (function (_super) {
26222
26243
  });
26223
26244
  });
26224
26245
  };
26246
+ StackedBar.prototype.getBarWidth = function () {
26247
+ var options = this.getOptions();
26248
+ if (tools_Tools.getProperty(options, "bars", "width")) {
26249
+ return options.bars.width;
26250
+ }
26251
+ var mainXScale = this.services.cartesianScales.getMainXScale();
26252
+ var chartWidth = dom_utils_DOMUtils.getSVGElementSize(this.parent, {
26253
+ useAttrs: true,
26254
+ }).width;
26255
+ var numberOfDomainValues = this.model.getStackKeys().length;
26256
+ if (!mainXScale.step) {
26257
+ return Math.min(options.bars.maxWidth, (chartWidth * 0.25) / numberOfDomainValues);
26258
+ }
26259
+ return Math.min(options.bars.maxWidth, mainXScale.step() / 2);
26260
+ };
26225
26261
  StackedBar.prototype.destroy = function () {
26226
26262
  // Remove event listeners
26227
26263
  this.parent
@@ -32571,6 +32607,13 @@ var radar_Radar = /** @class */ (function (_super) {
32571
32607
  })
32572
32608
  .attr('y', function (key) {
32573
32609
  return polarToCartesianCoords(xScale(key), yScale.range()[1] + xLabelPadding, c).y;
32610
+ })
32611
+ .end()
32612
+ .finally(function () {
32613
+ // Align chart horizontally after x-axies has finished rendering
32614
+ var alignment = tools_Tools.getProperty(options, 'radar', 'alignment');
32615
+ var alignmentXOffset = _this.getAlignmentXOffset(alignment, svg, _this.getParent());
32616
+ svg.attr('x', alignmentXOffset);
32574
32617
  });
32575
32618
  });
32576
32619
  }, function (exit) {
@@ -32791,9 +32834,6 @@ var radar_Radar = /** @class */ (function (_super) {
32791
32834
  .remove();
32792
32835
  });
32793
32836
  });
32794
- var alignment = tools_Tools.getProperty(options, 'radar', 'alignment');
32795
- var alignmentXOffset = this.getAlignmentXOffset(alignment, svg, this.getParent());
32796
- svg.attr('x', alignmentXOffset);
32797
32837
  // Add event listeners
32798
32838
  this.addEventListeners();
32799
32839
  };
@@ -33595,8 +33635,8 @@ var circle_pack_CirclePack = /** @class */ (function (_super) {
33595
33635
  .on('click', function (event, datum) {
33596
33636
  var hoveredElement = src_select(this);
33597
33637
  var disabled = hoveredElement.classed('non-focal');
33598
- var zoomedIn = tools_Tools.getProperty(self.getOptions(), 'canvasZoom', 'enabled') && self.model.getHierarchyLevel() > 2;
33599
- if (zoomedIn) {
33638
+ var canvasZoomEnabled = tools_Tools.getProperty(self.model.getOptions(), 'canvasZoom', 'enabled');
33639
+ if (canvasZoomEnabled && self.model.getHierarchyLevel() > 2) {
33600
33640
  var canvasSelection = self.parent.selectAll('circle.node');
33601
33641
  var chartSvg = src_select(self.services.domUtils.getMainContainer());
33602
33642
  chartSvg.classed('zoomed-in', false);
@@ -33605,7 +33645,10 @@ var circle_pack_CirclePack = /** @class */ (function (_super) {
33605
33645
  self.services.canvasZoom.zoomOut(canvasSelection, canvasZoomSettings);
33606
33646
  }
33607
33647
  // zoom if chart has zoom enabled and if its a depth 2 circle that has children
33608
- else if (datum.depth === 2 && datum.children && !disabled) {
33648
+ else if (datum.depth === 2 &&
33649
+ datum.children &&
33650
+ !disabled &&
33651
+ canvasZoomEnabled) {
33609
33652
  var canvasSelection = self.parent.selectAll('circle.node');
33610
33653
  var chartSvg = src_select(self.services.domUtils.getMainContainer());
33611
33654
  chartSvg.classed('zoomed-in', true);