@d3plus/core 3.0.15 → 3.1.0

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.
Files changed (167) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +88482 -2998
  3. package/es/index.js +1 -1
  4. package/es/src/charts/AreaPlot.js +1 -3
  5. package/es/src/charts/BarChart.js +1 -3
  6. package/es/src/charts/BoxWhisker.js +2 -4
  7. package/es/src/charts/BumpChart.js +4 -5
  8. package/es/src/charts/Donut.js +1 -3
  9. package/es/src/charts/Geomap.js +47 -88
  10. package/es/src/charts/LinePlot.js +1 -3
  11. package/es/src/charts/Matrix.js +27 -46
  12. package/es/src/charts/Network.js +87 -81
  13. package/es/src/charts/Pack.js +21 -34
  14. package/es/src/charts/Pie.js +12 -24
  15. package/es/src/charts/Plot.js +226 -321
  16. package/es/src/charts/Priestley.js +18 -36
  17. package/es/src/charts/Radar.js +100 -47
  18. package/es/src/charts/RadialMatrix.js +35 -47
  19. package/es/src/charts/Rings.js +99 -90
  20. package/es/src/charts/Sankey.js +85 -75
  21. package/es/src/charts/StackedArea.js +1 -3
  22. package/es/src/charts/Tree.js +27 -28
  23. package/es/src/charts/Treemap.js +117 -71
  24. package/es/src/charts/Viz.js +297 -493
  25. package/es/src/charts/drawSteps/drawAttribution.js +1 -1
  26. package/es/src/charts/drawSteps/drawBack.js +1 -2
  27. package/es/src/charts/drawSteps/drawColorScale.js +1 -2
  28. package/es/src/charts/drawSteps/drawLegend.js +8 -10
  29. package/es/src/charts/drawSteps/drawSubtitle.js +1 -3
  30. package/es/src/charts/drawSteps/drawTimeline.js +12 -9
  31. package/es/src/charts/drawSteps/drawTitle.js +1 -3
  32. package/es/src/charts/drawSteps/drawTotal.js +1 -3
  33. package/es/src/charts/drawSteps/zoomControls.js +19 -21
  34. package/es/src/charts/events/click.legend.js +2 -3
  35. package/es/src/charts/events/click.shape.js +2 -4
  36. package/es/src/charts/events/mouseenter.js +7 -8
  37. package/es/src/charts/events/mouseleave.js +1 -3
  38. package/es/src/charts/events/mousemove.legend.js +3 -4
  39. package/es/src/charts/events/mousemove.shape.js +2 -4
  40. package/es/src/charts/events/touchstart.body.js +1 -1
  41. package/es/src/charts/helpers/matrixData.js +11 -4
  42. package/es/src/charts/helpers/tileAttributions.js +2 -1
  43. package/es/src/charts/plotBuffers/Bar.js +55 -12
  44. package/es/src/charts/plotBuffers/Box.js +55 -12
  45. package/es/src/charts/plotBuffers/Circle.js +9 -11
  46. package/es/src/charts/plotBuffers/Line.js +4 -6
  47. package/es/src/charts/plotBuffers/Rect.js +10 -12
  48. package/es/src/charts/plotBuffers/discreteBuffer.js +4 -2
  49. package/es/src/charts/plotBuffers/numericBuffer.js +7 -6
  50. package/es/src/components/Axis.js +298 -426
  51. package/es/src/components/AxisBottom.js +1 -3
  52. package/es/src/components/AxisLeft.js +1 -3
  53. package/es/src/components/AxisRight.js +1 -3
  54. package/es/src/components/AxisTop.js +1 -3
  55. package/es/src/components/ColorScale.js +80 -197
  56. package/es/src/components/Legend.js +82 -135
  57. package/es/src/components/Message.js +27 -19
  58. package/es/src/components/TextBox.js +106 -262
  59. package/es/src/components/Timeline.js +88 -155
  60. package/es/src/components/Tooltip.js +301 -330
  61. package/es/src/shapes/Area.js +95 -74
  62. package/es/src/shapes/Bar.js +46 -86
  63. package/es/src/shapes/Box.js +104 -118
  64. package/es/src/shapes/Circle.js +29 -30
  65. package/es/src/shapes/Image.js +44 -102
  66. package/es/src/shapes/Line.js +74 -40
  67. package/es/src/shapes/Path.js +23 -25
  68. package/es/src/shapes/Rect.js +29 -41
  69. package/es/src/shapes/Shape.js +152 -369
  70. package/es/src/shapes/Whisker.js +89 -90
  71. package/es/src/utils/AccessorFn.js +4 -0
  72. package/es/src/utils/BaseClass.js +53 -82
  73. package/es/src/utils/D3plusConfig.js +1 -0
  74. package/es/src/utils/RESET.js +2 -4
  75. package/es/src/utils/accessor.js +4 -5
  76. package/es/src/utils/configPrep.js +13 -12
  77. package/es/src/utils/constant.js +2 -3
  78. package/es/src/utils/getProp.js +4 -4
  79. package/es/src/utils/index.js +0 -1
  80. package/package.json +29 -22
  81. package/types/index.d.ts +5 -0
  82. package/types/src/charts/AreaPlot.d.ts +16 -0
  83. package/types/src/charts/BarChart.d.ts +16 -0
  84. package/types/src/charts/BoxWhisker.d.ts +11 -0
  85. package/types/src/charts/BumpChart.d.ts +36 -0
  86. package/types/src/charts/Donut.d.ts +11 -0
  87. package/types/src/charts/Geomap.d.ts +120 -0
  88. package/types/src/charts/LinePlot.d.ts +15 -0
  89. package/types/src/charts/Matrix.d.ts +74 -0
  90. package/types/src/charts/Network.d.ts +78 -0
  91. package/types/src/charts/Pack.d.ts +47 -0
  92. package/types/src/charts/Pie.d.ts +44 -0
  93. package/types/src/charts/Plot.d.ts +199 -0
  94. package/types/src/charts/Priestley.d.ts +37 -0
  95. package/types/src/charts/Radar.d.ts +38 -0
  96. package/types/src/charts/RadialMatrix.d.ts +78 -0
  97. package/types/src/charts/Rings.d.ts +74 -0
  98. package/types/src/charts/Sankey.d.ts +81 -0
  99. package/types/src/charts/StackedArea.d.ts +14 -0
  100. package/types/src/charts/Tree.d.ts +33 -0
  101. package/types/src/charts/Treemap.d.ts +51 -0
  102. package/types/src/charts/Viz.d.ts +402 -0
  103. package/types/src/charts/drawSteps/drawAttribution.d.ts +7 -0
  104. package/types/src/charts/drawSteps/drawBack.d.ts +6 -0
  105. package/types/src/charts/drawSteps/drawColorScale.d.ts +6 -0
  106. package/types/src/charts/drawSteps/drawLegend.d.ts +12 -0
  107. package/types/src/charts/drawSteps/drawSubtitle.d.ts +7 -0
  108. package/types/src/charts/drawSteps/drawTimeline.d.ts +7 -0
  109. package/types/src/charts/drawSteps/drawTitle.d.ts +7 -0
  110. package/types/src/charts/drawSteps/drawTotal.d.ts +7 -0
  111. package/types/src/charts/drawSteps/zoomControls.d.ts +7 -0
  112. package/types/src/charts/events/click.legend.d.ts +8 -0
  113. package/types/src/charts/events/click.shape.d.ts +8 -0
  114. package/types/src/charts/events/mouseenter.d.ts +8 -0
  115. package/types/src/charts/events/mouseleave.d.ts +8 -0
  116. package/types/src/charts/events/mousemove.legend.d.ts +9 -0
  117. package/types/src/charts/events/mousemove.shape.d.ts +9 -0
  118. package/types/src/charts/events/touchstart.body.d.ts +7 -0
  119. package/types/src/charts/helpers/matrixData.d.ts +11 -0
  120. package/types/src/charts/helpers/tileAttributions.d.ts +6 -0
  121. package/types/src/charts/index.d.ts +21 -0
  122. package/types/src/charts/plotBuffers/Bar.d.ts +16 -0
  123. package/types/src/charts/plotBuffers/Box.d.ts +16 -0
  124. package/types/src/charts/plotBuffers/Circle.d.ts +20 -0
  125. package/types/src/charts/plotBuffers/Line.d.ts +16 -0
  126. package/types/src/charts/plotBuffers/Rect.d.ts +19 -0
  127. package/types/src/charts/plotBuffers/discreteBuffer.d.ts +7 -0
  128. package/types/src/charts/plotBuffers/numericBuffer.d.ts +5 -0
  129. package/types/src/components/Axis.d.ts +309 -0
  130. package/types/src/components/AxisBottom.d.ts +11 -0
  131. package/types/src/components/AxisLeft.d.ts +11 -0
  132. package/types/src/components/AxisRight.d.ts +11 -0
  133. package/types/src/components/AxisTop.d.ts +11 -0
  134. package/types/src/components/ColorScale.d.ts +208 -0
  135. package/types/src/components/Legend.d.ts +157 -0
  136. package/types/src/components/Message.d.ts +40 -0
  137. package/types/src/components/TextBox.d.ts +278 -0
  138. package/types/src/components/Timeline.d.ts +157 -0
  139. package/types/src/components/Tooltip.d.ts +297 -0
  140. package/types/src/components/index.d.ts +11 -0
  141. package/types/src/shapes/Area.d.ts +81 -0
  142. package/types/src/shapes/Bar.d.ts +104 -0
  143. package/types/src/shapes/Box.d.ts +121 -0
  144. package/types/src/shapes/Circle.d.ts +44 -0
  145. package/types/src/shapes/Image.d.ts +124 -0
  146. package/types/src/shapes/Line.d.ts +48 -0
  147. package/types/src/shapes/Path.d.ts +38 -0
  148. package/types/src/shapes/Rect.d.ts +54 -0
  149. package/types/src/shapes/Shape.d.ts +378 -0
  150. package/types/src/shapes/Whisker.d.ts +96 -0
  151. package/types/src/shapes/index.d.ts +10 -0
  152. package/types/src/utils/AccessorFn.d.ts +6 -0
  153. package/types/src/utils/BaseClass.d.ts +76 -0
  154. package/types/src/utils/D3plusConfig.d.ts +164 -0
  155. package/types/src/utils/RESET.d.ts +3 -0
  156. package/types/src/utils/accessor.d.ts +13 -0
  157. package/types/src/utils/configPrep.d.ts +28 -0
  158. package/types/src/utils/constant.d.ts +11 -0
  159. package/types/src/utils/getProp.d.ts +9 -0
  160. package/types/src/utils/index.d.ts +8 -0
  161. package/umd/d3plus-core.full.js +20134 -18708
  162. package/umd/d3plus-core.full.js.map +1 -1
  163. package/umd/d3plus-core.full.min.js +2922 -5396
  164. package/umd/d3plus-core.js +1927 -4081
  165. package/umd/d3plus-core.js.map +1 -1
  166. package/umd/d3plus-core.min.js +1607 -3939
  167. package/es/src/utils/uuid.js +0 -13
@@ -71,7 +71,5 @@ var AxisBottom = /*#__PURE__*/ function(Axis) {
71
71
  return AxisBottom;
72
72
  }(Axis);
73
73
  /**
74
- @class AxisBottom
75
- @extends Axis
76
- @desc Shorthand method for creating an axis where the ticks are drawn below the horizontal domain path. Extends all functionality of the base [Axis](#Axis) class.
74
+ Shorthand method for creating an axis where the ticks are drawn below the horizontal domain path. Extends all functionality of the base [Axis](#Axis) class.
77
75
  */ export { AxisBottom as default };
@@ -71,7 +71,5 @@ var AxisLeft = /*#__PURE__*/ function(Axis) {
71
71
  return AxisLeft;
72
72
  }(Axis);
73
73
  /**
74
- @class AxisLeft
75
- @extends Axis
76
- @desc Shorthand method for creating an axis where the ticks are drawn to the left of the vertical domain path. Extends all functionality of the base [Axis](#Axis) class.
74
+ Shorthand method for creating an axis where the ticks are drawn to the left of the vertical domain path. Extends all functionality of the base [Axis](#Axis) class.
77
75
  */ export { AxisLeft as default };
@@ -71,7 +71,5 @@ var AxisRight = /*#__PURE__*/ function(Axis) {
71
71
  return AxisRight;
72
72
  }(Axis);
73
73
  /**
74
- @class AxisRight
75
- @extends Axis
76
- @desc Shorthand method for creating an axis where the ticks are drawn to the right of the vertical domain path. Extends all functionality of the base [Axis](#Axis) class.
74
+ Shorthand method for creating an axis where the ticks are drawn to the right of the vertical domain path. Extends all functionality of the base [Axis](#Axis) class.
77
75
  */ export { AxisRight as default };
@@ -71,7 +71,5 @@ var AxisTop = /*#__PURE__*/ function(Axis) {
71
71
  return AxisTop;
72
72
  }(Axis);
73
73
  /**
74
- @class AxisTop
75
- @extends Axis
76
- @desc Shorthand method for creating an axis where the ticks are drawn above the vertical domain path. Extends all functionality of the base [Axis](#Axis) class.
74
+ Shorthand method for creating an axis where the ticks are drawn above the vertical domain path. Extends all functionality of the base [Axis](#Axis) class.
77
75
  */ export { AxisTop as default };
@@ -60,6 +60,7 @@ function _inherits(subClass, superClass) {
60
60
  if (superClass) _set_prototype_of(subClass, superClass);
61
61
  }
62
62
  function _instanceof(left, right) {
63
+ "@swc/helpers - instanceof";
63
64
  if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
64
65
  return !!right[Symbol.hasInstance](left);
65
66
  } else {
@@ -96,9 +97,9 @@ import { interpolateRgb } from "d3-interpolate";
96
97
  import { scaleLinear, scaleThreshold } from "d3-scale";
97
98
  import { select } from "d3-selection";
98
99
  import { transition } from "d3-transition";
99
- import { colorDefaults, colorLighter } from "@d3plus/color";
100
+ import { colorContrast, colorDefaults, colorLighter } from "@d3plus/color";
100
101
  import { unique } from "@d3plus/data";
101
- import { assign, elem, textWidth } from "@d3plus/dom";
102
+ import { assign, backgroundColor, elem, textWidth } from "@d3plus/dom";
102
103
  import { formatAbbreviate } from "@d3plus/format";
103
104
  import { ckmeans } from "@d3plus/math";
104
105
  import { Axis, TextBox } from "../components/index.js";
@@ -111,7 +112,8 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
111
112
  function ColorScale() {
112
113
  _class_call_check(this, ColorScale);
113
114
  var _this;
114
- _this = _call_super(this, ColorScale);
115
+ _this = _call_super(this, ColorScale), _define_property(_this, "_select", void 0), _define_property(_this, "_axisClass", void 0), _define_property(_this, "_axisConfig", void 0), _define_property(_this, "_axisTest", void 0), _define_property(_this, "_align", void 0), _define_property(_this, "_buckets", void 0), _define_property(_this, "_bucketAxis", void 0), _define_property(_this, "_bucketFormat", void 0), _define_property(_this, "_bucketJoiner", void 0), _define_property(_this, "_centered", void 0), _define_property(_this, "_color", void 0), _define_property(_this, "_colorMax", void 0), _define_property(_this, "_colorMid", void 0), _define_property(_this, "_colorMin", void 0), // eslint-disable-next-line @typescript-eslint/no-explicit-any
116
+ _define_property(_this, "_colorScale", void 0), _define_property(_this, "_data", void 0), _define_property(_this, "_domain", void 0), _define_property(_this, "_duration", void 0), _define_property(_this, "_group", void 0), _define_property(_this, "_height", void 0), _define_property(_this, "_labelClass", void 0), _define_property(_this, "_labelConfig", void 0), _define_property(_this, "_labelMin", void 0), _define_property(_this, "_labelMax", void 0), _define_property(_this, "_legendClass", void 0), _define_property(_this, "_legendConfig", void 0), _define_property(_this, "_midpoint", void 0), _define_property(_this, "_orient", void 0), _define_property(_this, "_outerBounds", void 0), _define_property(_this, "_padding", void 0), _define_property(_this, "_rectClass", void 0), _define_property(_this, "_rectConfig", void 0), _define_property(_this, "_scale", void 0), _define_property(_this, "_size", void 0), _define_property(_this, "_value", void 0), _define_property(_this, "_width", void 0);
115
117
  _this._axisClass = new Axis();
116
118
  _this._axisConfig = {
117
119
  gridSize: 0
@@ -166,7 +168,10 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
166
168
  _this._height = 200;
167
169
  _this._labelClass = new TextBox();
168
170
  _this._labelConfig = {
169
- fontColor: colorDefaults.dark,
171
+ fontColor: function fontColor() {
172
+ var bg = _this._select ? backgroundColor(_this._select.node()) : "rgb(255, 255, 255)";
173
+ return colorContrast(bg);
174
+ },
170
175
  fontSize: 12
171
176
  };
172
177
  _this._legendClass = new Legend();
@@ -199,11 +204,9 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
199
204
  _create_class(ColorScale, [
200
205
  {
201
206
  /**
202
- @memberof ColorScale
203
- @desc Renders the current ColorScale to the page. If a *callback* is specified, it will be called once the ColorScale is done drawing.
204
- @param {Function} [*callback* = undefined]
205
- @chainable
206
- */ key: "render",
207
+ Renders the current ColorScale to the page.
208
+ @param callback Optional callback invoked after rendering completes.
209
+ */ key: "render",
207
210
  value: function render(callback) {
208
211
  var _this = this;
209
212
  if (this._select === void 0) this.select(select("body").append("svg").attr("width", "".concat(this._width, "px")).attr("height", "".concat(this._height, "px")).node());
@@ -229,6 +232,7 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
229
232
  _instanceof(this._buckets, Array) ? this._buckets.length : this._buckets,
230
233
  diverging && this._scale !== "jenks" ? 2 * Math.floor(unique(allValues).length / 2) - 1 : unique(allValues).length
231
234
  ]);
235
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
232
236
  var colors = diverging && (!this._color || _instanceof(this._color, Array) && !this._color.includes(this._colorMid)) ? undefined : this._color, labels, ticks;
233
237
  if (colors && !_instanceof(colors, Array)) {
234
238
  colors = range(0, numBuckets, 1).map(function(i) {
@@ -292,13 +296,13 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
292
296
  var positives1 = ticks.slice(0, buckets).filter(function(d) {
293
297
  return d > _this._midpoint;
294
298
  });
295
- var negativeColors = negatives1.map(function(d, i) {
299
+ var negativeColors = negatives1.map(function(_d, i) {
296
300
  return !i ? colors[0] : colorLighter(colors[0], i / negatives1.length);
297
301
  });
298
302
  var spanningColors = spanning.map(function() {
299
303
  return colors[1];
300
304
  });
301
- var positiveColors = positives1.map(function(d, i) {
305
+ var positiveColors = positives1.map(function(_d, i) {
302
306
  return i === positives1.length - 1 ? colors[2] : colorLighter(colors[2], 1 - (i + 1) / positives1.length);
303
307
  });
304
308
  colors = negativeColors.concat(spanningColors).concat(positiveColors);
@@ -317,6 +321,7 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
317
321
  var buckets1 = _instanceof(this._buckets, Array) ? this._buckets : undefined;
318
322
  if (diverging && !colors) {
319
323
  var half1 = Math.floor(numBuckets / 2);
324
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
320
325
  var negativeColorScale = interpolateRgb.gamma(2.2)(this._colorMin, this._colorMid);
321
326
  var negativeColors1 = range(0, half1, 1).map(function(i) {
322
327
  return negativeColorScale(i / half1);
@@ -326,6 +331,7 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
326
331
  ] : []).map(function() {
327
332
  return _this._colorMid;
328
333
  });
334
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
329
335
  var positiveColorScale = interpolateRgb.gamma(2.2)(this._colorMax, this._colorMid);
330
336
  var positiveColors1 = range(0, half1, 1).map(function(i) {
331
337
  return positiveColorScale(i / half1);
@@ -410,7 +416,9 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
410
416
  }
411
417
  if (buckets1.includes(0)) buckets1[buckets1.indexOf(0)] = 1;
412
418
  }
413
- this._colorScale = (this._scale === "buckets" || this._scale === "quantile" ? scaleThreshold : scaleLinear)().domain(buckets1).range(colors);
419
+ var scaleFn = this._scale === "buckets" || this._scale === "quantile" ? scaleThreshold : scaleLinear;
420
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
421
+ this._colorScale = scaleFn().domain(buckets1).range(colors);
414
422
  }
415
423
  if (this._colorScale.clamp) this._colorScale.clamp(true);
416
424
  var gradient = this._bucketAxis || ![
@@ -455,6 +463,7 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
455
463
  var ten = Math.pow(10, pow);
456
464
  axisDomain[axisDomain.length - 1] = last + ten;
457
465
  }
466
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
458
467
  var axisConfig = assign({
459
468
  domain: horizontal ? axisDomain : axisDomain.slice().reverse(),
460
469
  duration: this._duration,
@@ -466,20 +475,28 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
466
475
  ticks: ticks,
467
476
  width: this._width
468
477
  }, this._axisConfig);
478
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
469
479
  var labelConfig = assign({
480
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
470
481
  height: this["_".concat(height)] / 2,
482
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
471
483
  width: this["_".concat(width)] / 2
472
484
  }, this._labelConfig);
473
485
  this._labelClass.config(labelConfig);
474
486
  var labelData = [];
475
487
  if (horizontal && this._labelMin) {
488
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
476
489
  var labelCSS = {
490
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
477
491
  "font-family": this._labelClass.fontFamily()(this._labelMin),
492
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
478
493
  "font-size": this._labelClass.fontSize()(this._labelMin),
494
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
479
495
  "font-weight": this._labelClass.fontWeight()(this._labelMin)
480
496
  };
481
497
  if (_instanceof(labelCSS["font-family"], Array)) labelCSS["font-family"] = labelCSS["font-family"][0];
482
498
  var labelMinWidth = textWidth(this._labelMin, labelCSS);
499
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
483
500
  if (labelMinWidth && labelMinWidth < this["_".concat(width)] / 2) {
484
501
  labelData.push(this._labelMin);
485
502
  labelMinWidth += this._padding;
@@ -488,13 +505,18 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
488
505
  }
489
506
  }
490
507
  if (horizontal && this._labelMax) {
508
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
491
509
  var labelCSS1 = {
510
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
492
511
  "font-family": this._labelClass.fontFamily()(this._labelMax),
512
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
493
513
  "font-size": this._labelClass.fontSize()(this._labelMax),
514
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
494
515
  "font-weight": this._labelClass.fontWeight()(this._labelMax)
495
516
  };
496
517
  if (_instanceof(labelCSS1["font-family"], Array)) labelCSS1["font-family"] = labelCSS1["font-family"][0];
497
518
  var labelMaxWidth = textWidth(this._labelMax, labelCSS1);
519
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
498
520
  if (labelMaxWidth && labelMaxWidth < this["_".concat(width)] / 2) {
499
521
  labelData.push(this._labelMax);
500
522
  labelMaxWidth += this._padding;
@@ -509,12 +531,15 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
509
531
  parent: this._group
510
532
  }).node()).config(axisConfig).duration(0).render();
511
533
  var axisBounds = this._axisTest.outerBounds();
534
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
512
535
  this._outerBounds[width] = this["_".concat(width)] - this._padding * 2;
513
536
  this._outerBounds[height] = axisBounds[height] + this._size;
514
537
  this._outerBounds[x] = this._padding;
515
538
  this._outerBounds[y] = this._padding;
516
- if (this._align === "middle") this._outerBounds[y] = (this["_".concat(height)] - this._outerBounds[height]) / 2;
517
- else if (this._align === "end") this._outerBounds[y] = this["_".concat(height)] - this._padding - this._outerBounds[height];
539
+ if (this._align === "middle") this._outerBounds[y] = // eslint-disable-next-line @typescript-eslint/no-explicit-any
540
+ (this["_".concat(height)] - this._outerBounds[height]) / 2;
541
+ else if (this._align === "end") this._outerBounds[y] = // eslint-disable-next-line @typescript-eslint/no-explicit-any
542
+ this["_".concat(height)] - this._padding - this._outerBounds[height];
518
543
  var axisGroupOffset = this._outerBounds[y] + ([
519
544
  "bottom",
520
545
  "right"
@@ -531,6 +556,7 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
531
556
  })).node()).config(axisConfig).align("start").render();
532
557
  var axisScale = this._axisTest._getPosition.bind(this._axisTest);
533
558
  var scaleRange = this._axisTest._getRange();
559
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
534
560
  var defs = this._group.selectAll("defs").data([
535
561
  0
536
562
  ]);
@@ -547,14 +573,15 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
547
573
  100,
548
574
  0
549
575
  ]);
550
- stops.enter().append("stop").merge(stops).attr("offset", function(d, i) {
576
+ stops.enter().append("stop").merge(stops).attr("offset", function(_d, i) {
551
577
  return "".concat(i <= scaleDomain.length - 1 ? offsetScale(axisScale(scaleDomain[i])) : 100, "%");
552
578
  }).attr("stop-color", String);
553
- /** determines the width of buckets */ var bucketWidth = function(d, i) {
579
+ /** determines the width of buckets*/ var bucketWidth = function bucketWidth(d, i) {
554
580
  var next = ticks[i + 1] || axisDomain[axisDomain.length - 1];
555
581
  return Math.abs(axisScale(next) - axisScale(d));
556
582
  };
557
583
  var _obj;
584
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
558
585
  var rectConfig = assign((_obj = {
559
586
  duration: this._duration,
560
587
  fill: ticks ? function(d) {
@@ -569,14 +596,17 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
569
596
  "top",
570
597
  "left"
571
598
  ].includes(this._orient) ? axisBounds[height] : 0) + this._size / 2 + offsets[y]), _define_property(_obj, width, ticks ? bucketWidth : scaleRange[1] - scaleRange[0]), _define_property(_obj, height, this._size), _obj), this._rectConfig);
572
- this._rectClass.data(ticks || [
599
+ this._rectClass// eslint-disable-next-line @typescript-eslint/no-explicit-any
600
+ .data(ticks || [
573
601
  0
574
- ]).id(function(d, i) {
602
+ ])// eslint-disable-next-line @typescript-eslint/no-explicit-any
603
+ .id(function(_d, i) {
575
604
  return i;
576
605
  }).select(rectGroup.node()).config(rectConfig).render();
577
606
  labelConfig.height = this._outerBounds[height];
578
607
  labelConfig.width = this._outerBounds[width];
579
- this._labelClass.config(labelConfig).data(labelData).select(labelGroup.node()).x(function(d) {
608
+ this._labelClass.config(labelConfig)// eslint-disable-next-line @typescript-eslint/no-explicit-any
609
+ .data(labelData).select(labelGroup.node()).x(function(d) {
580
610
  return d === _this._labelMax ? rectConfig.x + rectConfig.width / 2 + _this._padding : _this._outerBounds.x;
581
611
  }).y(function(d) {
582
612
  return rectConfig.y - _this._labelClass.fontSize()(d) / 2;
@@ -626,324 +656,179 @@ var ColorScale = /*#__PURE__*/ function(BaseClass) {
626
656
  }
627
657
  },
628
658
  {
629
- /**
630
- @memberof ColorScale
631
- @desc The [ColorScale](http://d3plus.org/docs/#ColorScale) is constructed by combining an [Axis](http://d3plus.org/docs/#Axis) for the ticks/labels and a [Rect](http://d3plus.org/docs/#Rect) for the actual color box (or multiple boxes, as in a jenks scale). Because of this, there are separate configs for the [Axis](http://d3plus.org/docs/#Axis) class used to display the text ([axisConfig](http://d3plus.org/docs/#ColorScale.axisConfig)) and the [Rect](http://d3plus.org/docs/#Rect) class used to draw the color breaks ([rectConfig](http://d3plus.org/docs/#ColorScale.rectConfig)). This method acts as a pass-through to the config method of the [Axis](http://d3plus.org/docs/#Axis). An example usage of this method can be seen [here](http://d3plus.org/examples/d3plus-legend/colorScale-dark/).
632
- @param {Object} [*value*]
633
- @chainable
634
- */ key: "axisConfig",
659
+ key: "axisConfig",
635
660
  value: function axisConfig(_) {
636
661
  return arguments.length ? (this._axisConfig = assign(this._axisConfig, _), this) : this._axisConfig;
637
662
  }
638
663
  },
639
664
  {
640
- /**
641
- @memberof ColorScale
642
- @desc If *value* is specified, sets the horizontal alignment to the specified value and returns the current class instance. If *value* is not specified, returns the current horizontal alignment.
643
- @param {String} [*value* = "center"] Supports `"left"` and `"center"` and `"right"`.
644
- @chainable
645
- */ key: "align",
665
+ key: "align",
646
666
  value: function align(_) {
647
667
  return arguments.length ? (this._align = _, this) : this._align;
648
668
  }
649
669
  },
650
670
  {
651
- /**
652
- @memberof ColorScale
653
- @desc The number of discrete buckets to create in a bucketed color scale. Will be overridden by any custom Array of colors passed to the `color` method. Optionally, users can supply an Array of values used to separate buckets, such as `[0, 10, 25, 50, 90]` for a percentage scale. This value would create 4 buckets, with each value representing the break point between each bucket (so 5 values makes 4 buckets).
654
- @param {Number|Array} [*value* = 5]
655
- @chainable
656
- */ key: "buckets",
671
+ key: "buckets",
657
672
  value: function buckets(_) {
658
673
  return arguments.length ? (this._buckets = _, this) : this._buckets;
659
674
  }
660
675
  },
661
676
  {
662
- /**
663
- @memberof ColorScale
664
- @desc Determines whether or not to use an Axis to display bucket scales (both "buckets" and "jenks"). When set to `false`, bucketed scales will use the `Legend` class to display squares for each range of data. When set to `true`, bucketed scales will be displayed on an `Axis`, similar to "linear" scales.
665
- @param {Boolean} [*value* = false]
666
- @chainable
667
- */ key: "bucketAxis",
677
+ key: "bucketAxis",
668
678
  value: function bucketAxis(_) {
669
679
  return arguments.length ? (this._bucketAxis = _, this) : this._bucketAxis;
670
680
  }
671
681
  },
672
682
  {
673
- /**
674
- @memberof ColorScale
675
- @desc A function for formatting the labels associated to each bucket in a bucket-type scale ("jenks", "quantile", etc). The function is passed four arguments: the start value of the current bucket, it's index in the full Array of buckets, the full Array of buckets, and an Array of every value present in the data used to construct the buckets. Keep in mind that the end value for the bucket is not actually the next bucket in the list, but includes every value up until that next bucket value (less than, but not equal to). By default, d3plus will make the end value slightly less than it's current value, so that it does not overlap with the start label for the next bucket.
676
- @param {Function} [*value*]
677
- @chainable
678
- */ key: "bucketFormat",
683
+ key: "bucketFormat",
679
684
  value: function bucketFormat(_) {
680
685
  return arguments.length ? (this._bucketFormat = _, this) : this._bucketFormat;
681
686
  }
682
687
  },
683
688
  {
684
- /**
685
- @memberof ColorScale
686
- @desc A function that receives the minimum and maximum values of a bucket, and is expected to return the full label.
687
- @param {Function} [*value*]
688
- @chainable
689
- */ key: "bucketJoiner",
689
+ key: "bucketJoiner",
690
690
  value: function bucketJoiner(_) {
691
691
  return arguments.length ? (this._bucketJoiner = _, this) : this._bucketJoiner;
692
692
  }
693
693
  },
694
694
  {
695
- /**
696
- @memberof ColorScale
697
- @desc Determines whether or not to display a midpoint centered Axis. Does not apply to quantile scales.
698
- @param {Boolean} [*value* = false]
699
- @chainable
700
- */ key: "centered",
695
+ key: "centered",
701
696
  value: function centered(_) {
702
697
  return arguments.length ? (this._centered = _, this) : this._centered;
703
698
  }
704
699
  },
705
700
  {
706
- /**
707
- @memberof ColorScale
708
- @desc Overrides the default internal logic of `colorMin`, `colorMid`, and `colorMax` to only use just this specified color. If a single color is given as a String, then the scale is interpolated by lightening that color. Otherwise, the function expects an Array of color values to be used in order for the scale.
709
- @param {String|Array} [*value*]
710
- @chainable
711
- */ key: "color",
701
+ key: "color",
712
702
  value: function color(_) {
713
703
  return arguments.length ? (this._color = _, this) : this._color;
714
704
  }
715
705
  },
716
706
  {
717
- /**
718
- @memberof ColorScale
719
- @desc Defines the color to be used for numbers greater than the value of the `midpoint` on the scale (defaults to `0`). Colors in between this value and the value of `colorMid` will be interpolated, unless a custom Array of colors has been specified using the `color` method.
720
- @param {String} [*value* = "#0C8040"]
721
- @chainable
722
- */ key: "colorMax",
707
+ key: "colorMax",
723
708
  value: function colorMax(_) {
724
709
  return arguments.length ? (this._colorMax = _, this) : this._colorMax;
725
710
  }
726
711
  },
727
712
  {
728
- /**
729
- @memberof ColorScale
730
- @desc Defines the color to be used for the midpoint of a diverging scale, based on the current value of the `midpoint` method (defaults to `0`). Colors in between this value and the values of `colorMin` and `colorMax` will be interpolated, unless a custom Array of colors has been specified using the `color` method.
731
- @param {String} [*value* = "#f7f7f7"]
732
- @chainable
733
- */ key: "colorMid",
713
+ key: "colorMid",
734
714
  value: function colorMid(_) {
735
715
  return arguments.length ? (this._colorMid = _, this) : this._colorMid;
736
716
  }
737
717
  },
738
718
  {
739
- /**
740
- @memberof ColorScale
741
- @desc Defines the color to be used for numbers less than the value of the `midpoint` on the scale (defaults to `0`). Colors in between this value and the value of `colorMid` will be interpolated, unless a custom Array of colors has been specified using the `color` method.
742
- @param {String} [*value* = "#b22200"]
743
- @chainable
744
- */ key: "colorMin",
719
+ key: "colorMin",
745
720
  value: function colorMin(_) {
746
721
  return arguments.length ? (this._colorMin = _, this) : this._colorMin;
747
722
  }
748
723
  },
749
724
  {
750
- /**
751
- @memberof ColorScale
752
- @desc If *data* is specified, sets the data array to the specified array and returns the current class instance. If *data* is not specified, returns the current data array. A shape key will be drawn for each object in the array.
753
- @param {Array} [*data* = []]
754
- @chainable
755
- */ key: "data",
725
+ key: "data",
756
726
  value: function data(_) {
757
727
  return arguments.length ? (this._data = _, this) : this._data;
758
728
  }
759
729
  },
760
730
  {
761
- /**
762
- @memberof ColorScale
763
- @desc In a linear scale, this Array of 2 values defines the min and max values used in the color scale. Any values outside of this range will be mapped to the nearest color value.
764
- @param {Array} [*value*]
765
- @chainable
766
- */ key: "domain",
731
+ key: "domain",
767
732
  value: function domain(_) {
768
733
  return arguments.length ? (this._domain = _, this) : this._domain;
769
734
  }
770
735
  },
771
736
  {
772
- /**
773
- @memberof ColorScale
774
- @desc If *value* is specified, sets the transition duration of the ColorScale and returns the current class instance. If *value* is not specified, returns the current duration.
775
- @param {Number} [*value* = 600]
776
- @chainable
777
- */ key: "duration",
737
+ key: "duration",
778
738
  value: function duration(_) {
779
739
  return arguments.length ? (this._duration = _, this) : this._duration;
780
740
  }
781
741
  },
782
742
  {
783
- /**
784
- @memberof ColorScale
785
- @desc If *value* is specified, sets the overall height of the ColorScale and returns the current class instance. If *value* is not specified, returns the current height value.
786
- @param {Number} [*value* = 100]
787
- @chainable
788
- */ key: "height",
743
+ key: "height",
789
744
  value: function height(_) {
790
745
  return arguments.length ? (this._height = _, this) : this._height;
791
746
  }
792
747
  },
793
748
  {
794
- /**
795
- @memberof ColorScale
796
- @desc A pass-through for the [TextBox](http://d3plus.org/docs/#TextBox) class used to style the labelMin and labelMax text.
797
- @param {Object} [*value*]
798
- @chainable
799
- */ key: "labelConfig",
749
+ key: "labelConfig",
800
750
  value: function labelConfig(_) {
801
751
  return arguments.length ? (this._labelConfig = assign(this._labelConfig, _), this) : this._labelConfig;
802
752
  }
803
753
  },
804
754
  {
805
- /**
806
- @memberof ColorScale
807
- @desc Defines a text label to be displayed off of the end of the minimum point in the scale (currently only available in horizontal orientation).
808
- @param {String} [*value*]
809
- @chainable
810
- */ key: "labelMin",
755
+ key: "labelMin",
811
756
  value: function labelMin(_) {
812
757
  return arguments.length ? (this._labelMin = _, this) : this._labelMin;
813
758
  }
814
759
  },
815
760
  {
816
- /**
817
- @memberof ColorScale
818
- @desc Defines a text label to be displayed off of the end of the maximum point in the scale (currently only available in horizontal orientation).
819
- @param {String} [*value*]
820
- @chainable
821
- */ key: "labelMax",
761
+ key: "labelMax",
822
762
  value: function labelMax(_) {
823
763
  return arguments.length ? (this._labelMax = _, this) : this._labelMax;
824
764
  }
825
765
  },
826
766
  {
827
- /**
828
- @memberof ColorScale
829
- @desc The [ColorScale](http://d3plus.org/docs/#ColorScale) is constructed by combining an [Axis](http://d3plus.org/docs/#Axis) for the ticks/labels and a [Rect](http://d3plus.org/docs/#Rect) for the actual color box (or multiple boxes, as in a jenks scale). Because of this, there are separate configs for the [Axis](http://d3plus.org/docs/#Axis) class used to display the text ([axisConfig](http://d3plus.org/docs/#ColorScale.axisConfig)) and the [Rect](http://d3plus.org/docs/#Rect) class used to draw the color breaks ([rectConfig](http://d3plus.org/docs/#ColorScale.rectConfig)). This method acts as a pass-through to the config method of the [Axis](http://d3plus.org/docs/#Axis). An example usage of this method can be seen [here](http://d3plus.org/examples/d3plus-legend/colorScale-dark/).
830
- @param {Object} [*value*]
831
- @chainable
832
- */ key: "legendConfig",
767
+ key: "legendConfig",
833
768
  value: function legendConfig(_) {
834
769
  return arguments.length ? (this._legendConfig = assign(this._legendConfig, _), this) : this._legendConfig;
835
770
  }
836
771
  },
837
772
  {
838
- /**
839
- @memberof ColorScale
840
- @desc The number value to be used as the anchor for `colorMid`, and defines the center point of the diverging color scale.
841
- @param {Number} [*value* = 0]
842
- @chainable
843
- */ key: "midpoint",
773
+ key: "midpoint",
844
774
  value: function midpoint(_) {
845
775
  return arguments.length ? (this._midpoint = _, this) : this._midpoint;
846
776
  }
847
777
  },
848
778
  {
849
- /**
850
- @memberof ColorScale
851
- @desc Sets the flow of the items inside the ColorScale. If no value is passed, the current flow will be returned.
852
- @param {String} [*value* = "bottom"]
853
- @chainable
854
- */ key: "orient",
779
+ key: "orient",
855
780
  value: function orient(_) {
856
781
  return arguments.length ? (this._orient = _, this) : this._orient;
857
782
  }
858
783
  },
859
784
  {
860
785
  /**
861
- @memberof ColorScale
862
- @desc If called after the elements have been drawn to DOM, will returns the outer bounds of the ColorScale content.
786
+ Returns the outer bounds of the ColorScale content. Must be called after rendering.
863
787
  @example
864
788
  {"width": 180, "height": 24, "x": 10, "y": 20}
865
- */ key: "outerBounds",
789
+ */ key: "outerBounds",
866
790
  value: function outerBounds() {
867
791
  return this._outerBounds;
868
792
  }
869
793
  },
870
794
  {
871
- /**
872
- @memberof ColorScale
873
- @desc If *value* is specified, sets the padding between each key to the specified number and returns the current class instance. If *value* is not specified, returns the current padding value.
874
- @param {Number} [*value* = 10]
875
- @chainable
876
- */ key: "padding",
795
+ key: "padding",
877
796
  value: function padding(_) {
878
797
  return arguments.length ? (this._padding = _, this) : this._padding;
879
798
  }
880
799
  },
881
800
  {
882
- /**
883
- @memberof ColorScale
884
- @desc The [ColorScale](http://d3plus.org/docs/#ColorScale) is constructed by combining an [Axis](http://d3plus.org/docs/#Axis) for the ticks/labels and a [Rect](http://d3plus.org/docs/#Rect) for the actual color box (or multiple boxes, as in a jenks scale). Because of this, there are separate configs for the [Axis](http://d3plus.org/docs/#Axis) class used to display the text ([axisConfig](http://d3plus.org/docs/#ColorScale.axisConfig)) and the [Rect](http://d3plus.org/docs/#Rect) class used to draw the color breaks ([rectConfig](http://d3plus.org/docs/#ColorScale.rectConfig)). This method acts as a pass-through to the config method of the [Rect](http://d3plus.org/docs/#Rect). An example usage of this method can be seen [here](http://d3plus.org/examples/d3plus-legend/colorScale-dark/).
885
- @param {Object} [*value*]
886
- @chainable
887
- */ key: "rectConfig",
801
+ key: "rectConfig",
888
802
  value: function rectConfig(_) {
889
803
  return arguments.length ? (this._rectConfig = assign(this._rectConfig, _), this) : this._rectConfig;
890
804
  }
891
805
  },
892
806
  {
893
- /**
894
- @memberof ColorScale
895
- @desc If *value* is specified, sets the scale of the ColorScale and returns the current class instance. If *value* is not specified, returns the current scale value.
896
- @param {String} [*value* = "linear"] Can either be "linear", "jenks", or "buckets".
897
- @chainable
898
- */ key: "scale",
807
+ key: "scale",
899
808
  value: function scale(_) {
900
809
  return arguments.length ? (this._scale = _, this) : this._scale;
901
810
  }
902
811
  },
903
812
  {
904
- /**
905
- @memberof ColorScale
906
- @desc If *selector* is specified, sets the SVG container element to the specified d3 selector or DOM element and returns the current class instance. If *selector* is not specified, returns the current SVG container element.
907
- @param {String|HTMLElement} [*selector* = d3.select("body").append("svg")]
908
- @chainable
909
- */ key: "select",
813
+ key: "select",
910
814
  value: function select1(_) {
911
815
  return arguments.length ? (this._select = select(_), this) : this._select;
912
816
  }
913
817
  },
914
818
  {
915
- /**
916
- @memberof ColorScale
917
- @desc The height of horizontal color scales, and width when positioned vertical.
918
- @param {Number} [*value* = 10]
919
- @chainable
920
- */ key: "size",
819
+ key: "size",
921
820
  value: function size(_) {
922
821
  return arguments.length ? (this._size = _, this) : this._size;
923
822
  }
924
823
  },
925
824
  {
926
- /**
927
- @memberof ColorScale
928
- @desc If *value* is specified, sets the value accessor to the specified function or string and returns the current class instance. If *value* is not specified, returns the current value accessor.
929
- @param {Function|String} [*value*]
930
- @chainable
931
- @example
932
- function value(d) {
933
- return d.value;
934
- }
935
- */ key: "value",
825
+ key: "value",
936
826
  value: function value(_) {
937
827
  return arguments.length ? (this._value = typeof _ === "function" ? _ : constant(_), this) : this._value;
938
828
  }
939
829
  },
940
830
  {
941
- /**
942
- @memberof ColorScale
943
- @desc If *value* is specified, sets the overall width of the ColorScale and returns the current class instance. If *value* is not specified, returns the current width value.
944
- @param {Number} [*value* = 400]
945
- @chainable
946
- */ key: "width",
831
+ key: "width",
947
832
  value: function width(_) {
948
833
  return arguments.length ? (this._width = _, this) : this._width;
949
834
  }
@@ -952,7 +837,5 @@ function value(d) {
952
837
  return ColorScale;
953
838
  }(BaseClass);
954
839
  /**
955
- @class ColorScale
956
- @extends BaseClass
957
- @desc Creates an SVG scale based on an array of data. If *data* is specified, immediately draws based on the specified array and returns the current class instance. If *data* is not specified on instantiation, it can be passed/updated after instantiation using the [data](#shape.data) method.
840
+ Creates an SVG color scale based on an array of data.
958
841
  */ export { ColorScale as default };