@carbon/charts 0.30.24 → 0.30.25
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/CHANGELOG.md +330 -1052
- package/README.md +3 -0
- package/axis-chart.js +8 -14
- package/axis-chart.js.map +1 -1
- package/build/demo/{data/create-codesandbox.d.ts → create-codesandbox.d.ts} +16 -13
- package/build/demo/data/bar.d.ts +1 -1
- package/build/demo/data/line.d.ts +1 -1
- package/build/src/interfaces/axis-scales.d.ts +11 -11
- package/build/src/interfaces/charts.d.ts +1 -0
- package/bundle.js +1 -1
- package/chart.js +15 -24
- package/chart.js.map +1 -1
- package/charts/bar-grouped.js +3 -1
- package/charts/bar-grouped.js.map +1 -1
- package/charts/bar-simple.js +3 -1
- package/charts/bar-simple.js.map +1 -1
- package/charts/bar-stacked.js +3 -1
- package/charts/bar-stacked.js.map +1 -1
- package/charts/bubble.js +3 -1
- package/charts/bubble.js.map +1 -1
- package/charts/donut.js +3 -1
- package/charts/donut.js.map +1 -1
- package/charts/line.js +3 -1
- package/charts/line.js.map +1 -1
- package/charts/pie.js +3 -1
- package/charts/pie.js.map +1 -1
- package/charts/radar.js +1 -3
- package/charts/radar.js.map +1 -1
- package/charts/scatter.js +3 -1
- package/charts/scatter.js.map +1 -1
- package/components/axes/axis.js +72 -33
- package/components/axes/axis.js.map +1 -1
- package/components/axes/grid.js +23 -18
- package/components/axes/grid.js.map +1 -1
- package/components/axes/ruler.js +7 -5
- package/components/axes/ruler.js.map +1 -1
- package/components/axes/two-dimensional-axes.js +5 -2
- package/components/axes/two-dimensional-axes.js.map +1 -1
- package/components/axes/zero-line.js +2 -1
- package/components/axes/zero-line.js.map +1 -1
- package/components/component.js +2 -4
- package/components/component.js.map +1 -1
- package/components/essentials/legend.js +46 -23
- package/components/essentials/legend.js.map +1 -1
- package/components/essentials/threshold.js +11 -5
- package/components/essentials/threshold.js.map +1 -1
- package/components/essentials/title.js +6 -4
- package/components/essentials/title.js.map +1 -1
- package/components/essentials/tooltip-bar.js +39 -20
- package/components/essentials/tooltip-bar.js.map +1 -1
- package/components/essentials/tooltip-pie.js +4 -3
- package/components/essentials/tooltip-pie.js.map +1 -1
- package/components/essentials/tooltip-radar.js +6 -3
- package/components/essentials/tooltip-radar.js.map +1 -1
- package/components/essentials/tooltip-scatter.js +3 -1
- package/components/essentials/tooltip-scatter.js.map +1 -1
- package/components/essentials/tooltip.js +35 -15
- package/components/essentials/tooltip.js.map +1 -1
- package/components/graphs/bar-grouped.js +46 -20
- package/components/graphs/bar-grouped.js.map +1 -1
- package/components/graphs/bar-simple.js +39 -19
- package/components/graphs/bar-simple.js.map +1 -1
- package/components/graphs/bar-stacked.js +50 -28
- package/components/graphs/bar-stacked.js.map +1 -1
- package/components/graphs/bar.js.map +1 -1
- package/components/graphs/bubble.js +22 -8
- package/components/graphs/bubble.js.map +1 -1
- package/components/graphs/donut.js +12 -4
- package/components/graphs/donut.js.map +1 -1
- package/components/graphs/line.js +14 -7
- package/components/graphs/line.js.map +1 -1
- package/components/graphs/pie.js +80 -44
- package/components/graphs/pie.js.map +1 -1
- package/components/graphs/radar.js +271 -140
- package/components/graphs/radar.js.map +1 -1
- package/components/graphs/scatter.js +54 -21
- package/components/graphs/scatter.js.map +1 -1
- package/components/graphs/skeleton.js +29 -14
- package/components/graphs/skeleton.js.map +1 -1
- package/components/layout/layout.js +38 -26
- package/components/layout/layout.js.map +1 -1
- package/components/layout/spacer.js +2 -1
- package/components/layout/spacer.js.map +1 -1
- package/configuration.js +15 -13
- package/configuration.js.map +1 -1
- package/demo/{data/create-codesandbox.d.ts → create-codesandbox.d.ts} +16 -13
- package/demo/{data/create-codesandbox.js → create-codesandbox.js} +24 -21
- package/demo/create-codesandbox.js.map +1 -0
- package/demo/data/bar.d.ts +1 -1
- package/demo/data/bar.js +1 -1
- package/demo/data/bar.js.map +1 -1
- package/demo/data/bubble.js +5 -3
- package/demo/data/bubble.js.map +1 -1
- package/demo/data/bundle.js +1 -1
- package/demo/data/index.js +12 -7
- package/demo/data/index.js.map +1 -1
- package/demo/data/line.d.ts +1 -1
- package/demo/data/line.js +2 -4
- package/demo/data/line.js.map +1 -1
- package/demo/data/radar.js.map +1 -1
- package/demo/data/time-series-axis.js +1 -3
- package/demo/data/time-series-axis.js.map +1 -1
- package/demo/styles.css +50 -18
- package/demo/styles.css.map +1 -1
- package/demo/styles.min.css +1 -1
- package/demo/styles.min.css.map +1 -1
- package/demo/tsconfig.tsbuildinfo +68 -68
- package/index.js.map +1 -1
- package/interfaces/axis-scales.d.ts +11 -11
- package/interfaces/axis-scales.js.map +1 -1
- package/interfaces/charts.d.ts +1 -0
- package/interfaces/charts.js.map +1 -1
- package/interfaces/components.js.map +1 -1
- package/interfaces/enums.js.map +1 -1
- package/model.js +27 -16
- package/model.js.map +1 -1
- package/package.json +4 -2
- package/polyfills.js +7 -2
- package/polyfills.js.map +1 -1
- package/services/angle-utils.js +34 -9
- package/services/angle-utils.js.map +1 -1
- package/services/colors.js.map +1 -1
- package/services/curves.js +4 -2
- package/services/curves.js.map +1 -1
- package/services/essentials/dom-utils.js +4 -3
- package/services/essentials/dom-utils.js.map +1 -1
- package/services/essentials/transitions.js +3 -4
- package/services/essentials/transitions.js.map +1 -1
- package/services/scales-cartesian.js +63 -23
- package/services/scales-cartesian.js.map +1 -1
- package/services/time-series.js +28 -12
- package/services/time-series.js.map +1 -1
- package/styles/components/_axis.scss +4 -0
- package/styles/components/_layout.scss +0 -1
- package/styles/components/_ruler.scss +5 -2
- package/styles/components/_skeleton.scss +2 -3
- package/styles/components/_threshold.scss +2 -2
- package/styles/components/_tooltip.scss +6 -5
- package/styles/graphs/_bubble.scss +1 -1
- package/styles/graphs/_radar.scss +4 -2
- package/styles/graphs/_scatter.scss +1 -1
- package/styles/mixins.scss +2 -2
- package/styles-g10.css +11 -4
- package/styles-g10.css.map +1 -1
- package/styles-g10.min.css +1 -1
- package/styles-g10.min.css.map +1 -1
- package/styles-g100.css +11 -4
- package/styles-g100.css.map +1 -1
- package/styles-g100.min.css +1 -1
- package/styles-g100.min.css.map +1 -1
- package/styles-g90.css +11 -4
- package/styles-g90.css.map +1 -1
- package/styles-g90.min.css +1 -1
- package/styles-g90.min.css.map +1 -1
- package/styles.css +11 -4
- package/styles.css.map +1 -1
- package/styles.min.css +1 -1
- package/styles.min.css.map +1 -1
- package/tools.js +19 -7
- package/tools.js.map +1 -1
- package/tsconfig.tsbuildinfo +56 -56
- package/demo/data/create-codesandbox.js.map +0 -1
|
@@ -60,7 +60,8 @@ var TwoDimensionalAxes = /** @class */ (function (_super) {
|
|
|
60
60
|
// Check the configs to know which axes need to be rendered
|
|
61
61
|
axisPositions.forEach(function (axisPositionKey) {
|
|
62
62
|
var axisPosition = AxisPositions[axisPositionKey];
|
|
63
|
-
if (_this.configs.axes[axisPosition] &&
|
|
63
|
+
if (_this.configs.axes[axisPosition] &&
|
|
64
|
+
!_this.children[axisPosition]) {
|
|
64
65
|
var axisComponent = new Axis(_this.model, _this.services, {
|
|
65
66
|
position: axisPosition,
|
|
66
67
|
axes: _this.configs.axes,
|
|
@@ -93,7 +94,9 @@ var TwoDimensionalAxes = /** @class */ (function (_super) {
|
|
|
93
94
|
offset = 0;
|
|
94
95
|
}
|
|
95
96
|
else {
|
|
96
|
-
offset = DOMUtils.getSVGElementSize(child.getTitleRef(), {
|
|
97
|
+
offset = DOMUtils.getSVGElementSize(child.getTitleRef(), {
|
|
98
|
+
useBBox: true
|
|
99
|
+
}).height;
|
|
97
100
|
}
|
|
98
101
|
switch (axisPosition) {
|
|
99
102
|
case AxisPositions.TOP:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"two-dimensional-axes.js","sourceRoot":"","sources":["two-dimensional-axes.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,aAAa,EAA2B,MAAM,kBAAkB,CAAC;AAC1E,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEpD;IAAwC,sCAAS;IAAjD;QAAA,
|
|
1
|
+
{"version":3,"file":"two-dimensional-axes.js","sourceRoot":"","sources":["two-dimensional-axes.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Component } from \"../component\";\nimport { AxisPositions, ScaleTypes, AxesOptions } from \"../../interfaces\";\nimport { Axis } from \"./axis\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { Threshold } from \"../essentials/threshold\";\n\nexport class TwoDimensionalAxes extends Component {\n\ttype = \"2D-axes\";\n\n\tchildren: any = {};\n\n\tthresholds: Threshold[] = [];\n\n\tmargins = {\n\t\ttop: 0,\n\t\tright: 0,\n\t\tbottom: 0,\n\t\tleft: 0\n\t};\n\n\trender(animate = false) {\n\t\tconst axes = {};\n\t\tconst axisPositions = Object.keys(AxisPositions);\n\t\tconst axesOptions = Tools.getProperty(this.model.getOptions(), \"axes\");\n\n\t\taxisPositions.forEach(axisPosition => {\n\t\t\tconst axisOptions = axesOptions[AxisPositions[axisPosition]];\n\t\t\tif (axisOptions) {\n\t\t\t\taxes[AxisPositions[axisPosition]] = true;\n\t\t\t}\n\t\t});\n\n\t\tthis.configs.axes = axes;\n\n\t\t// Check the configs to know which axes need to be rendered\n\t\taxisPositions.forEach(axisPositionKey => {\n\t\t\tconst axisPosition = AxisPositions[axisPositionKey];\n\t\t\tif (\n\t\t\t\tthis.configs.axes[axisPosition] &&\n\t\t\t\t!this.children[axisPosition]\n\t\t\t) {\n\t\t\t\tconst axisComponent = new Axis(this.model, this.services, {\n\t\t\t\t\tposition: axisPosition,\n\t\t\t\t\taxes: this.configs.axes,\n\t\t\t\t\tmargins: this.margins\n\t\t\t\t});\n\n\t\t\t\t// Set model, services & parent for the new axis component\n\t\t\t\taxisComponent.setModel(this.model);\n\t\t\t\taxisComponent.setServices(this.services);\n\t\t\t\taxisComponent.setParent(this.parent);\n\n\t\t\t\tthis.children[axisPosition] = axisComponent;\n\t\t\t}\n\t\t});\n\n\t\tObject.keys(this.children).forEach(childKey => {\n\t\t\tconst child = this.children[childKey];\n\t\t\tchild.render(animate);\n\t\t});\n\n\t\tconst margins = {} as any;\n\n\t\tObject.keys(this.children).forEach(childKey => {\n\t\t\tconst child = this.children[childKey];\n\t\t\tconst axisPosition = child.configs.position;\n\n\t\t\t// Grab the invisibly rendered axis' width & height, and set margins\n\t\t\t// Based off of that\n\t\t\t// We draw the invisible axis because of the async nature of d3 transitions\n\t\t\t// To be able to tell the final width & height of the axis when initiaing the transition\n\t\t\t// The invisible axis is updated instantly and without a transition\n\t\t\tconst invisibleAxisRef = child.getInvisibleAxisRef();\n\t\t\tconst {\n\t\t\t\twidth,\n\t\t\t\theight\n\t\t\t} = DOMUtils.getSVGElementSize(invisibleAxisRef, { useBBox: true });\n\n\t\t\tlet offset;\n\t\t\tif (child.getTitleRef().empty()) {\n\t\t\t\toffset = 0;\n\t\t\t} else {\n\t\t\t\toffset = DOMUtils.getSVGElementSize(child.getTitleRef(), {\n\t\t\t\t\tuseBBox: true\n\t\t\t\t}).height;\n\t\t\t}\n\n\t\t\tswitch (axisPosition) {\n\t\t\t\tcase AxisPositions.TOP:\n\t\t\t\t\tmargins.top = height + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.BOTTOM:\n\t\t\t\t\tmargins.bottom = height + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.LEFT:\n\t\t\t\t\tmargins.left = width + offset;\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.RIGHT:\n\t\t\t\t\tmargins.right = width + offset;\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\t// Add thresholds\n\t\t\tthis.addAxisThresholds(animate, axisPosition);\n\t\t});\n\n\t\t// If the new margins are different than the existing ones\n\t\tconst isNotEqual = Object.keys(margins).some(marginKey => {\n\t\t\treturn this.margins[marginKey] !== margins[marginKey];\n\t\t});\n\n\t\tif (isNotEqual) {\n\t\t\tthis.margins = Object.assign(this.margins, margins);\n\n\t\t\tObject.keys(this.children).forEach(childKey => {\n\t\t\t\tconst child = this.children[childKey];\n\t\t\t\tchild.margins = this.margins;\n\t\t\t});\n\n\t\t\tthis.render(true);\n\t\t}\n\t}\n\n\taddAxisThresholds(animate, axisPosition) {\n\t\tconst axesOptions = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"axes\",\n\t\t\taxisPosition\n\t\t);\n\t\tconst { thresholds } = axesOptions;\n\n\t\tif (thresholds) {\n\t\t\tthresholds.forEach((thresholdConfig, i) => {\n\t\t\t\tconst thresholdComponent = new Threshold(\n\t\t\t\t\tthis.model,\n\t\t\t\t\tthis.services,\n\t\t\t\t\t{ ...thresholdConfig, axisPosition, index: i }\n\t\t\t\t);\n\t\t\t\tthis.thresholds.push(thresholdComponent);\n\t\t\t});\n\n\t\t\tthis.thresholds.forEach(threshold => {\n\t\t\t\tthreshold.setParent(this.parent);\n\t\t\t\tthreshold.render(animate);\n\t\t\t});\n\t\t}\n\t}\n}\n"]}
|
|
@@ -24,7 +24,8 @@ var ZeroLine = /** @class */ (function (_super) {
|
|
|
24
24
|
}
|
|
25
25
|
ZeroLine.prototype.render = function (animate) {
|
|
26
26
|
var _a = this.services.cartesianScales.getRangeScale().domain(), minDomainValue = _a[0], maxDomainValue = _a[1];
|
|
27
|
-
var drawZeroLine = minDomainValue > 0 && maxDomainValue < 0 ||
|
|
27
|
+
var drawZeroLine = (minDomainValue > 0 && maxDomainValue < 0) ||
|
|
28
|
+
(minDomainValue < 0 && maxDomainValue > 0);
|
|
28
29
|
// show zero line only if is necessary
|
|
29
30
|
if (!drawZeroLine) {
|
|
30
31
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"zero-line.js","sourceRoot":"","sources":["zero-line.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC;IAA8B,4BAAS;IAAvC;QAAA,
|
|
1
|
+
{"version":3,"file":"zero-line.js","sourceRoot":"","sources":["zero-line.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AAEpC;IAA8B,4BAAS;IAAvC;QAAA,qEAsDC;QArDA,UAAI,GAAG,WAAW,CAAC;;IAqDpB,CAAC;IAnDA,yBAAM,GAAN,UAAO,OAAgB;QAChB,IAAA,2DAGoD,EAFzD,sBAAc,EACd,sBACyD,CAAC;QAC3D,IAAM,YAAY,GACjB,CAAC,cAAc,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC;YAC1C,CAAC,cAAc,GAAG,CAAC,IAAI,cAAc,GAAG,CAAC,CAAC,CAAC;QAE5C,sCAAsC;QACtC,IAAI,CAAC,YAAY,EAAE;YAClB,OAAO;SACP;QAED,qBAAqB;QACrB,IAAM,GAAG,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEnC,iCAAiC;QAC3B,IAAA,2DAAiE,EAAhE,UAAE,EAAE,UAA4D,CAAC;QACxE,IAAI,SAAS,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC;QAEtE,oEAAoE;QACpE,uEAAuE;QACvE,4DAA4D;QAC5D,IAAI,CAAC,SAAS,EAAE;YACf,IAAM,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,oBAAoB,EAAE,CAAC;YAC1E,IAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,kBAAkB,CAC7D,YAAY,CACZ,CAAC;YACF,SAAS,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC;SAC7B;QAED,IAAM,eAAe,GAAG,KAAK,CAAC,oCAAoC,CACjE;YACC,EAAE,IAAA;YACF,EAAE,IAAA;YACF,EAAE,EAAE,SAAS;YACb,EAAE,EAAE,SAAS;SACb,EACD,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,cAAc,EAAE,CAC9C,CAAC;QAEF,IAAM,IAAI,GAAG,QAAQ,CAAC,cAAc,CAAC,GAAG,EAAE,aAAa,CAAC,CAAC;QACzD,IAAI,CAAC,UAAU,CACd,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,aAAa,CAAC,kBAAkB,EAAE,OAAO,CAAC,CACpE;aACC,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC;aAC9B,IAAI,CAAC,IAAI,EAAE,eAAe,CAAC,EAAE,CAAC,CAAC;IAClC,CAAC;IACF,eAAC;AAAD,CAAC,AAtDD,CAA8B,SAAS,GAsDtC","sourcesContent":["// Internal Imports\nimport { Component } from \"../component\";\nimport { DOMUtils } from \"../../services\";\nimport { Tools } from \"../../tools\";\n\nexport class ZeroLine extends Component {\n\ttype = \"zero-line\";\n\n\trender(animate: boolean) {\n\t\tconst [\n\t\t\tminDomainValue,\n\t\t\tmaxDomainValue\n\t\t] = this.services.cartesianScales.getRangeScale().domain();\n\t\tconst drawZeroLine =\n\t\t\t(minDomainValue > 0 && maxDomainValue < 0) ||\n\t\t\t(minDomainValue < 0 && maxDomainValue > 0);\n\n\t\t// show zero line only if is necessary\n\t\tif (!drawZeroLine) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG();\n\n\t\t// Get x & y position of the line\n\t\tconst [x0, x1] = this.services.cartesianScales.getDomainScale().range();\n\t\tlet yPosition = +this.services.cartesianScales.getRangeValue(0) + 0.5;\n\n\t\t// if scale domain contains NaN, return the first value of the range\n\t\t// this is necessary for the zero line y position that otherwise is NaN\n\t\t// so on the top of the chart while we want it on the bottom\n\t\tif (!yPosition) {\n\t\t\tconst axisPosition = this.services.cartesianScales.getRangeAxisPosition();\n\t\t\tconst scale = this.services.cartesianScales.getScaleByPosition(\n\t\t\t\taxisPosition\n\t\t\t);\n\t\t\tyPosition = scale.range()[0];\n\t\t}\n\n\t\tconst lineCoordinates = Tools.flipSVGCoordinatesBasedOnOrientation(\n\t\t\t{\n\t\t\t\tx0,\n\t\t\t\tx1,\n\t\t\t\ty0: yPosition,\n\t\t\t\ty1: yPosition\n\t\t\t},\n\t\t\tthis.services.cartesianScales.getOrientation()\n\t\t);\n\n\t\tconst line = DOMUtils.appendOrSelect(svg, \"line.domain\");\n\t\tline.transition(\n\t\t\tthis.services.transitions.getTransition(\"zero-line-update\", animate)\n\t\t)\n\t\t\t.attr(\"y1\", lineCoordinates.y0)\n\t\t\t.attr(\"y2\", lineCoordinates.y1)\n\t\t\t.attr(\"x1\", lineCoordinates.x0)\n\t\t\t.attr(\"x2\", lineCoordinates.x1);\n\t}\n}\n"]}
|
package/components/component.js
CHANGED
|
@@ -17,14 +17,12 @@ var Component = /** @class */ (function () {
|
|
|
17
17
|
this.setParent(select(this.services.domUtils.getMainSVG()));
|
|
18
18
|
}
|
|
19
19
|
}
|
|
20
|
-
Component.prototype.init = function () {
|
|
21
|
-
};
|
|
20
|
+
Component.prototype.init = function () { };
|
|
22
21
|
Component.prototype.render = function (animate) {
|
|
23
22
|
if (animate === void 0) { animate = true; }
|
|
24
23
|
console.error("render() method is not implemented");
|
|
25
24
|
};
|
|
26
|
-
Component.prototype.destroy = function () {
|
|
27
|
-
};
|
|
25
|
+
Component.prototype.destroy = function () { };
|
|
28
26
|
// Used to pass down information to the components
|
|
29
27
|
Component.prototype.setModel = function (newObj) {
|
|
30
28
|
this.model = newObj;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component.js","sourceRoot":"","sources":["component.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,aAAa;AACb,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAEtC,yCAAyC;AACzC,OAAO,QAAQ,MAAM,0CAA0C,CAAC;
|
|
1
|
+
{"version":3,"file":"component.js","sourceRoot":"","sources":["component.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAEjC,aAAa;AACb,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAEtC,yCAAyC;AACzC,OAAO,QAAQ,MAAM,0CAA0C,CAAC;AAEhE;IAUC,mBAAY,KAAiB,EAAE,QAAa,EAAE,OAAa;QALjD,YAAO,GAAQ,EAAE,CAAC;QAM3B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAEzB,IAAI,OAAO,EAAE;YACZ,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;SACvB;QAED,oEAAoE;QACpE,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YACjB,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC;SAC5D;IACF,CAAC;IAED,wBAAI,GAAJ,cAAQ,CAAC;IAET,0BAAM,GAAN,UAAO,OAAc;QAAd,wBAAA,EAAA,cAAc;QACpB,OAAO,CAAC,KAAK,CAAC,oCAAoC,CAAC,CAAC;IACrD,CAAC;IAED,2BAAO,GAAP,cAAW,CAAC;IAEZ,kDAAkD;IAClD,4BAAQ,GAAR,UAAS,MAAM;QACd,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC;IACrB,CAAC;IAED,kDAAkD;IAClD,+BAAW,GAAX,UAAY,MAAM;QACjB,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC;IACxB,CAAC;IAED,6BAAS,GAAT,UAAU,MAAM;QACf,IAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC;QAC9B,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;QAErB,IAAI,SAAS,IAAI,SAAS,CAAC,IAAI,EAAE,KAAK,MAAM,CAAC,IAAI,EAAE,EAAE;YACpD,OAAO;SACP;QAED,IAAI,IAAI,CAAC,IAAI,EAAE;YACd,IAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CACpC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,EACvB,OAAO,EACP,QAAQ,CACR,CAAC;YACF,IAAI,CAAC,MAAM,CAAC,OAAO,CACf,QAAQ,CAAC,MAAM,UAAK,WAAW,UAAK,IAAI,CAAC,IAAM,EAClD,IAAI,CACJ,CAAC;YAEF,IAAI,SAAS,EAAE;gBACd,SAAS,CAAC,OAAO,CACb,QAAQ,CAAC,MAAM,UAAK,WAAW,UAAK,IAAI,CAAC,IAAM,EAClD,KAAK,CACL,CAAC;aACF;SACD;IACF,CAAC;IAED,6BAAS,GAAT;QACC,OAAO,IAAI,CAAC,MAAM,CAAC;IACpB,CAAC;IAED,mCAAe,GAAf;QACC,IAAI,IAAI,CAAC,IAAI,EAAE;YACd,IAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CACpC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,EACvB,OAAO,EACP,QAAQ,CACR,CAAC;YACF,OAAO,QAAQ,CAAC,cAAc,CAC7B,IAAI,CAAC,MAAM,EACX,OAAK,QAAQ,CAAC,MAAM,UAAK,WAAW,UAAK,IAAI,CAAC,IAAM,CACpD,CAAC;SACF;QAED,OAAO,IAAI,CAAC,MAAM,CAAC;IACpB,CAAC;IACF,gBAAC;AAAD,CAAC,AAzFD,IAyFC","sourcesContent":["// Internal Imports\nimport { ChartModel } from \"../model\";\nimport { DOMUtils } from \"../services\";\nimport { Tools } from \"../tools\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\n\nexport class Component {\n\tpublic type: string;\n\n\tprotected parent: any;\n\n\tprotected configs: any = {};\n\n\tprotected model: ChartModel;\n\tprotected services: any;\n\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tthis.model = model;\n\t\tthis.services = services;\n\n\t\tif (configs) {\n\t\t\tthis.configs = configs;\n\t\t}\n\n\t\t// Set parent element to shell SVG if no parent exists for component\n\t\tif (!this.parent) {\n\t\t\tthis.setParent(select(this.services.domUtils.getMainSVG()));\n\t\t}\n\t}\n\n\tinit() {}\n\n\trender(animate = true) {\n\t\tconsole.error(\"render() method is not implemented\");\n\t}\n\n\tdestroy() {}\n\n\t// Used to pass down information to the components\n\tsetModel(newObj) {\n\t\tthis.model = newObj;\n\t}\n\n\t// Used to pass down information to the components\n\tsetServices(newObj) {\n\t\tthis.services = newObj;\n\t}\n\n\tsetParent(parent) {\n\t\tconst oldParent = this.parent;\n\t\tthis.parent = parent;\n\n\t\tif (oldParent && oldParent.node() === parent.node()) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (this.type) {\n\t\t\tconst chartprefix = Tools.getProperty(\n\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\"style\",\n\t\t\t\t\"prefix\"\n\t\t\t);\n\t\t\tthis.parent.classed(\n\t\t\t\t`${settings.prefix}--${chartprefix}--${this.type}`,\n\t\t\t\ttrue\n\t\t\t);\n\n\t\t\tif (oldParent) {\n\t\t\t\toldParent.classed(\n\t\t\t\t\t`${settings.prefix}--${chartprefix}--${this.type}`,\n\t\t\t\t\tfalse\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t}\n\n\tgetParent() {\n\t\treturn this.parent;\n\t}\n\n\tgetContainerSVG() {\n\t\tif (this.type) {\n\t\t\tconst chartprefix = Tools.getProperty(\n\t\t\t\tthis.model.getOptions(),\n\t\t\t\t\"style\",\n\t\t\t\t\"prefix\"\n\t\t\t);\n\t\t\treturn DOMUtils.appendOrSelect(\n\t\t\t\tthis.parent,\n\t\t\t\t`g.${settings.prefix}--${chartprefix}--${this.type}`\n\t\t\t);\n\t\t}\n\n\t\treturn this.parent;\n\t}\n}\n"]}
|
|
@@ -28,15 +28,18 @@ var Legend = /** @class */ (function (_super) {
|
|
|
28
28
|
var _this = this;
|
|
29
29
|
var svg = this.getContainerSVG().attr("role", Roles.GRAPHICS_DOCUMENT);
|
|
30
30
|
var options = this.model.getOptions();
|
|
31
|
-
var legendItems = svg
|
|
31
|
+
var legendItems = svg
|
|
32
|
+
.selectAll("g.legend-item")
|
|
32
33
|
.data(this.model.getDataGroups(), function (dataGroup) { return dataGroup.name; });
|
|
33
34
|
// this.getLegendItemArray()
|
|
34
|
-
var addedLegendItems = legendItems
|
|
35
|
+
var addedLegendItems = legendItems
|
|
36
|
+
.enter()
|
|
35
37
|
.append("g")
|
|
36
38
|
.classed("legend-item", true);
|
|
37
39
|
// Configs
|
|
38
40
|
var checkboxRadius = options.legend.checkbox.radius;
|
|
39
|
-
addedLegendItems
|
|
41
|
+
addedLegendItems
|
|
42
|
+
.append("rect")
|
|
40
43
|
.classed("checkbox", true)
|
|
41
44
|
.merge(legendItems.select("rect.checkbox"))
|
|
42
45
|
.attr("width", checkboxRadius * 2)
|
|
@@ -44,17 +47,22 @@ var Legend = /** @class */ (function (_super) {
|
|
|
44
47
|
.attr("rx", 1)
|
|
45
48
|
.attr("ry", 1)
|
|
46
49
|
.style("fill", function (d) {
|
|
47
|
-
return d.status === options.legend.items.status.ACTIVE
|
|
48
|
-
|
|
50
|
+
return d.status === options.legend.items.status.ACTIVE
|
|
51
|
+
? _this.model.getStrokeColor(d.name)
|
|
52
|
+
: null;
|
|
53
|
+
})
|
|
54
|
+
.classed("active", function (d, i) {
|
|
49
55
|
return d.status === options.legend.items.status.ACTIVE;
|
|
50
56
|
});
|
|
51
|
-
addedLegendItems
|
|
57
|
+
addedLegendItems
|
|
58
|
+
.append("text")
|
|
52
59
|
.merge(legendItems.select("text"))
|
|
53
60
|
.html(function (d) { return d.name; })
|
|
54
61
|
.attr("alignment-baseline", "middle");
|
|
55
62
|
this.breakItemsIntoLines(addedLegendItems);
|
|
56
63
|
// Remove old elements as needed.
|
|
57
|
-
legendItems
|
|
64
|
+
legendItems
|
|
65
|
+
.exit()
|
|
58
66
|
.on("mouseover", null)
|
|
59
67
|
.on("click", null)
|
|
60
68
|
.on("mouseout", null)
|
|
@@ -74,7 +82,7 @@ var Legend = /** @class */ (function (_super) {
|
|
|
74
82
|
var legendItemsHorizontalSpacing = options.legend.items.horizontalSpace;
|
|
75
83
|
var legendItemsVerticalSpacing = options.legend.items.verticalSpace;
|
|
76
84
|
var legendTextYOffset = options.legend.items.textYOffset;
|
|
77
|
-
var spaceNeededForCheckbox =
|
|
85
|
+
var spaceNeededForCheckbox = checkboxRadius * 2 + options.legend.checkbox.spaceAfter;
|
|
78
86
|
// Check if there are disabled legend items
|
|
79
87
|
var DISABLED = options.legend.items.status.DISABLED;
|
|
80
88
|
var dataGroups = this.model.getDataGroups();
|
|
@@ -85,12 +93,16 @@ var Legend = /** @class */ (function (_super) {
|
|
|
85
93
|
var lineNumber = 0;
|
|
86
94
|
var itemIndexInLine = 0;
|
|
87
95
|
var lastYPosition;
|
|
88
|
-
addedLegendItems
|
|
96
|
+
addedLegendItems
|
|
97
|
+
.merge(svg.selectAll("g.legend-item"))
|
|
89
98
|
.each(function (d, i) {
|
|
90
99
|
var legendItem = select(this);
|
|
91
100
|
var previousLegendItem = select(svg.selectAll("g.legend-item").nodes()[i - 1]);
|
|
92
|
-
if (itemIndexInLine === 0 ||
|
|
93
|
-
|
|
101
|
+
if (itemIndexInLine === 0 ||
|
|
102
|
+
previousLegendItem.empty() ||
|
|
103
|
+
legendOrientation === LegendOrientations.VERTICAL) {
|
|
104
|
+
if (legendOrientation === LegendOrientations.VERTICAL &&
|
|
105
|
+
i !== 0) {
|
|
94
106
|
lineNumber++;
|
|
95
107
|
}
|
|
96
108
|
}
|
|
@@ -98,8 +110,15 @@ var Legend = /** @class */ (function (_super) {
|
|
|
98
110
|
var svgDimensions = DOMUtils.getSVGElementSize(self.parent, { useAttr: true });
|
|
99
111
|
var legendItemTextDimensions = DOMUtils.getSVGElementSize(select(this).select("text"), { useBBox: true });
|
|
100
112
|
var lastLegendItemTextDimensions = DOMUtils.getSVGElementSize(previousLegendItem.select("text"), { useBBox: true });
|
|
101
|
-
startingPoint =
|
|
102
|
-
|
|
113
|
+
startingPoint =
|
|
114
|
+
startingPoint +
|
|
115
|
+
lastLegendItemTextDimensions.width +
|
|
116
|
+
spaceNeededForCheckbox +
|
|
117
|
+
legendItemsHorizontalSpacing;
|
|
118
|
+
if (startingPoint +
|
|
119
|
+
spaceNeededForCheckbox +
|
|
120
|
+
legendItemTextDimensions.width >
|
|
121
|
+
svgDimensions.width) {
|
|
103
122
|
lineNumber++;
|
|
104
123
|
startingPoint = 0;
|
|
105
124
|
itemIndexInLine = 0;
|
|
@@ -108,28 +127,31 @@ var Legend = /** @class */ (function (_super) {
|
|
|
108
127
|
var yOffset = 0;
|
|
109
128
|
// Position checkbox
|
|
110
129
|
// TODO - Replace with layout component margins
|
|
111
|
-
legendItem
|
|
130
|
+
legendItem
|
|
131
|
+
.select("rect.checkbox")
|
|
112
132
|
.attr("x", startingPoint)
|
|
113
133
|
.attr("y", yOffset + lineNumber * legendItemsVerticalSpacing);
|
|
114
134
|
// Position text
|
|
115
135
|
// TODO - Replace with layout component margins
|
|
116
|
-
var yPosition = legendTextYOffset +
|
|
117
|
-
legendItem
|
|
136
|
+
var yPosition = legendTextYOffset + lineNumber * legendItemsVerticalSpacing;
|
|
137
|
+
legendItem
|
|
138
|
+
.select("text")
|
|
118
139
|
.attr("x", startingPoint + spaceNeededForCheckbox)
|
|
119
140
|
.attr("y", yOffset + yPosition);
|
|
120
141
|
lastYPosition = yPosition;
|
|
121
142
|
// Render checkbox check icon
|
|
122
|
-
if (hasDeactivatedItems &&
|
|
123
|
-
legendItem.
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
143
|
+
if (hasDeactivatedItems &&
|
|
144
|
+
legendItem.select("g.check").empty()) {
|
|
145
|
+
legendItem.append("g").classed("check", true).html("\n\t\t\t\t\t\t\t<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 32 32\" aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tstyle=\"will-change: transform;\">\n\t\t\t\t\t\t\t\t<path d=\"M13 21.2l-7.1-7.1-1.4 1.4 7.1 7.1L13 24 27.1 9.9l-1.4-1.5z\"></path>\n\t\t\t\t\t\t\t\t<title>Checkmark</title>\n\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t");
|
|
146
|
+
legendItem
|
|
147
|
+
.select("g.check svg")
|
|
127
148
|
.attr("width", checkboxRadius * 2 - 1)
|
|
128
149
|
.attr("height", checkboxRadius * 2 - 1)
|
|
129
150
|
.attr("x", parseFloat(legendItem.select("rect.checkbox").attr("x")) + 0.5)
|
|
130
151
|
.attr("y", parseFloat(legendItem.select("rect.checkbox").attr("y")) + 0.5);
|
|
131
152
|
}
|
|
132
|
-
else if (!hasDeactivatedItems &&
|
|
153
|
+
else if (!hasDeactivatedItems &&
|
|
154
|
+
!legendItem.select("g.check").empty()) {
|
|
133
155
|
legendItem.select("g.check").remove();
|
|
134
156
|
}
|
|
135
157
|
itemIndexInLine++;
|
|
@@ -147,7 +169,8 @@ var Legend = /** @class */ (function (_super) {
|
|
|
147
169
|
// Configs
|
|
148
170
|
var checkboxRadius = options.legend.checkbox.radius;
|
|
149
171
|
var hoveredItem = select(this);
|
|
150
|
-
hoveredItem
|
|
172
|
+
hoveredItem
|
|
173
|
+
.append("rect")
|
|
151
174
|
.classed("hover-stroke", true)
|
|
152
175
|
.attr("x", parseFloat(hoveredItem.select("rect.checkbox").attr("x")) - 2)
|
|
153
176
|
.attr("y", parseFloat(hoveredItem.select("rect.checkbox").attr("y")) - 2)
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"legend.js","sourceRoot":"","sources":["legend.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport * as Configuration from \"../../configuration\";\nimport { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport {\n\tLegendOrientations,\n\tRoles,\n\tEvents\n} from \"../../interfaces\";\nimport { DOMUtils } from \"../../services\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\n\nexport class Legend extends Component {\n\ttype = \"legend\";\n\n\trender() {\n\t\tconst svg = this.getContainerSVG().attr(\"role\", Roles.GRAPHICS_DOCUMENT);\n\t\tconst options = this.model.getOptions();\n\t\tconst legendItems = svg.selectAll(\"g.legend-item\")\n\t\t\t.data(this.model.getDataGroups(), dataGroup => dataGroup.name);\n\n\t\t\t// this.getLegendItemArray()\n\n\t\tconst addedLegendItems = legendItems.enter()\n\t\t\t.append(\"g\")\n\t\t\t.classed(\"legend-item\", true);\n\n\t\t// Configs\n\t\tconst checkboxRadius = options.legend.checkbox.radius;\n\n\t\taddedLegendItems.append(\"rect\")\n\t\t\t.classed(\"checkbox\", true)\n\t\t\t.merge(legendItems.select(\"rect.checkbox\"))\n\t\t\t.attr(\"width\", checkboxRadius * 2)\n\t\t\t.attr(\"height\", checkboxRadius * 2)\n\t\t\t.attr(\"rx\", 1)\n\t\t\t.attr(\"ry\", 1)\n\t\t\t.style(\"fill\", d => {\n\t\t\t\treturn d.status === options.legend.items.status.ACTIVE ? this.model.getStrokeColor(d.name) : null;\n\t\t\t}).classed(\"active\", function (d, i) {\n\t\t\t\treturn d.status === options.legend.items.status.ACTIVE;\n\t\t\t});\n\n\t\taddedLegendItems.append(\"text\")\n\t\t\t.merge(legendItems.select(\"text\"))\n\t\t\t.html(d => d.name)\n\t\t\t.attr(\"alignment-baseline\", \"middle\");\n\n\t\tthis.breakItemsIntoLines(addedLegendItems);\n\n\t\t// Remove old elements as needed.\n\t\tlegendItems.exit()\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"click\", null)\n\t\t\t.on(\"mouseout\", null)\n\t\t\t.remove();\n\n\t\tconst legendClickable = Tools.getProperty(this.model.getOptions(), \"legend\", \"clickable\");\n\t\tsvg.classed(\"clickable\", legendClickable);\n\n\t\tif (legendClickable && addedLegendItems.size() > 0) {\n\t\t\tthis.addEventListeners();\n\t\t}\n\t}\n\n\tbreakItemsIntoLines(addedLegendItems) {\n\t\tconst self = this;\n\t\tconst svg = this.getContainerSVG();\n\t\tconst options = this.model.getOptions();\n\n\t\t// Configs\n\t\tconst checkboxRadius = options.legend.checkbox.radius;\n\t\tconst legendItemsHorizontalSpacing = options.legend.items.horizontalSpace;\n\t\tconst legendItemsVerticalSpacing = options.legend.items.verticalSpace;\n\t\tconst legendTextYOffset = options.legend.items.textYOffset;\n\t\tconst spaceNeededForCheckbox = (checkboxRadius * 2) + options.legend.checkbox.spaceAfter;\n\n\t\t// Check if there are disabled legend items\n\t\tconst { DISABLED } = options.legend.items.status;\n\t\tconst dataGroups = this.model.getDataGroups();\n\t\tconst hasDeactivatedItems = dataGroups.some(dataGroup => dataGroup.status === DISABLED);\n\n\t\tconst legendOrientation = Tools.getProperty(options, \"legend\", \"orientation\");\n\n\t\t// Keep track of line numbers and positions\n\t\tlet startingPoint = 0;\n\t\tlet lineNumber = 0;\n\t\tlet itemIndexInLine = 0;\n\t\tlet lastYPosition;\n\t\taddedLegendItems.merge(svg.selectAll(\"g.legend-item\"))\n\t\t\t.each(function (d, i) {\n\t\t\t\tconst legendItem = select(this);\n\t\t\t\tconst previousLegendItem = select(svg.selectAll(\"g.legend-item\").nodes()[i - 1]);\n\n\t\t\t\tif (itemIndexInLine === 0 || previousLegendItem.empty() || legendOrientation === LegendOrientations.VERTICAL) {\n\t\t\t\t\tif (legendOrientation === LegendOrientations.VERTICAL && i !== 0) {\n\t\t\t\t\t\tlineNumber++;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tconst svgDimensions = DOMUtils.getSVGElementSize(self.parent, { useAttr: true });\n\t\t\t\t\tconst legendItemTextDimensions = DOMUtils.getSVGElementSize(select(this).select(\"text\"), { useBBox: true });\n\t\t\t\t\tconst lastLegendItemTextDimensions = DOMUtils.getSVGElementSize(previousLegendItem.select(\"text\"), { useBBox: true });\n\t\t\t\t\tstartingPoint = startingPoint + lastLegendItemTextDimensions.width + spaceNeededForCheckbox + legendItemsHorizontalSpacing;\n\n\t\t\t\t\tif (startingPoint + spaceNeededForCheckbox + legendItemTextDimensions.width > svgDimensions.width) {\n\t\t\t\t\t\tlineNumber++;\n\t\t\t\t\t\tstartingPoint = 0;\n\t\t\t\t\t\titemIndexInLine = 0;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst yOffset = 0;\n\n\t\t\t\t// Position checkbox\n\t\t\t\t// TODO - Replace with layout component margins\n\t\t\t\tlegendItem.select(\"rect.checkbox\")\n\t\t\t\t\t.attr(\"x\", startingPoint)\n\t\t\t\t\t.attr(\"y\", yOffset + lineNumber * legendItemsVerticalSpacing);\n\n\t\t\t\t// Position text\n\t\t\t\t// TODO - Replace with layout component margins\n\t\t\t\tconst yPosition = legendTextYOffset + (lineNumber * legendItemsVerticalSpacing);\n\t\t\t\tlegendItem.select(\"text\")\n\t\t\t\t\t.attr(\"x\", startingPoint + spaceNeededForCheckbox)\n\t\t\t\t\t.attr(\"y\", yOffset + yPosition);\n\n\t\t\t\tlastYPosition = yPosition;\n\n\t\t\t\t// Render checkbox check icon\n\t\t\t\tif (hasDeactivatedItems && legendItem.select(\"g.check\").empty()) {\n\t\t\t\t\tlegendItem.append(\"g\")\n\t\t\t\t\t\t.classed(\"check\", true)\n\t\t\t\t\t\t.html(`\n\t\t\t\t\t\t\t<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 32 32\" aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tstyle=\"will-change: transform;\">\n\t\t\t\t\t\t\t\t<path d=\"M13 21.2l-7.1-7.1-1.4 1.4 7.1 7.1L13 24 27.1 9.9l-1.4-1.5z\"></path>\n\t\t\t\t\t\t\t\t<title>Checkmark</title>\n\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t`);\n\n\t\t\t\t\tlegendItem.select(\"g.check svg\")\n\t\t\t\t\t\t.attr(\"width\", checkboxRadius * 2 - 1)\n\t\t\t\t\t\t.attr(\"height\", checkboxRadius * 2 - 1)\n\t\t\t\t\t\t.attr(\"x\", parseFloat(legendItem.select(\"rect.checkbox\").attr(\"x\")) + 0.5)\n\t\t\t\t\t\t.attr(\"y\", parseFloat(legendItem.select(\"rect.checkbox\").attr(\"y\")) + 0.5);\n\n\t\t\t\t} else if (!hasDeactivatedItems && !legendItem.select(\"g.check\").empty()) {\n\t\t\t\t\tlegendItem.select(\"g.check\").remove();\n\t\t\t\t}\n\n\t\t\t\titemIndexInLine++;\n\t\t\t});\n\t}\n\n\taddEventListeners() {\n\t\tconst self = this;\n\t\tconst svg = this.getContainerSVG();\n\t\tconst options = this.model.getOptions();\n\n\t\tsvg.selectAll(\"g.legend-item\")\n\t\t\t.on(\"mouseover\", function () {\n\t\t\t\tself.services.events.dispatchEvent(Events.Legend.ITEM_HOVER, {\n\t\t\t\t\thoveredElement: select(this)\n\t\t\t\t});\n\n\t\t\t\t// Configs\n\t\t\t\tconst checkboxRadius = options.legend.checkbox.radius;\n\n\t\t\t\tconst hoveredItem = select(this);\n\t\t\t\thoveredItem.append(\"rect\")\n\t\t\t\t\t.classed(\"hover-stroke\", true)\n\t\t\t\t\t.attr(\"x\", parseFloat(hoveredItem.select(\"rect.checkbox\").attr(\"x\")) - 2)\n\t\t\t\t\t.attr(\"y\", parseFloat(hoveredItem.select(\"rect.checkbox\").attr(\"y\")) - 2)\n\t\t\t\t\t.attr(\"width\", checkboxRadius * 2 + 4)\n\t\t\t\t\t.attr(\"height\", checkboxRadius * 2 + 4)\n\t\t\t\t\t.attr(\"rx\", 3)\n\t\t\t\t\t.attr(\"ry\", 3)\n\t\t\t\t\t.lower();\n\t\t\t})\n\t\t\t.on(\"click\", function () {\n\t\t\t\tself.services.events.dispatchEvent(Events.Legend.ITEM_CLICK, {\n\t\t\t\t\tclickedElement: select(this)\n\t\t\t\t});\n\n\t\t\t\tconst clickedItem = select(this);\n\t\t\t\tconst clickedItemData = clickedItem.datum() as any;\n\n\t\t\t\tself.model.toggleDataLabel(clickedItemData.name);\n\t\t\t})\n\t\t\t.on(\"mouseout\", function () {\n\t\t\t\tconst hoveredItem = select(this);\n\t\t\t\thoveredItem.select(\"rect.hover-stroke\").remove();\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Legend.ITEM_MOUSEOUT, {\n\t\t\t\t\thoveredElement: hoveredItem\n\t\t\t\t});\n\t\t\t});\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"legend.js","sourceRoot":"","sources":["legend.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport * as Configuration from \"../../configuration\";\nimport { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { LegendOrientations, Roles, Events } from \"../../interfaces\";\nimport { DOMUtils } from \"../../services\";\n\n// D3 Imports\nimport { select } from \"d3-selection\";\n\nexport class Legend extends Component {\n\ttype = \"legend\";\n\n\trender() {\n\t\tconst svg = this.getContainerSVG().attr(\n\t\t\t\"role\",\n\t\t\tRoles.GRAPHICS_DOCUMENT\n\t\t);\n\t\tconst options = this.model.getOptions();\n\t\tconst legendItems = svg\n\t\t\t.selectAll(\"g.legend-item\")\n\t\t\t.data(this.model.getDataGroups(), dataGroup => dataGroup.name);\n\n\t\t// this.getLegendItemArray()\n\n\t\tconst addedLegendItems = legendItems\n\t\t\t.enter()\n\t\t\t.append(\"g\")\n\t\t\t.classed(\"legend-item\", true);\n\n\t\t// Configs\n\t\tconst checkboxRadius = options.legend.checkbox.radius;\n\n\t\taddedLegendItems\n\t\t\t.append(\"rect\")\n\t\t\t.classed(\"checkbox\", true)\n\t\t\t.merge(legendItems.select(\"rect.checkbox\"))\n\t\t\t.attr(\"width\", checkboxRadius * 2)\n\t\t\t.attr(\"height\", checkboxRadius * 2)\n\t\t\t.attr(\"rx\", 1)\n\t\t\t.attr(\"ry\", 1)\n\t\t\t.style(\"fill\", d => {\n\t\t\t\treturn d.status === options.legend.items.status.ACTIVE\n\t\t\t\t\t? this.model.getStrokeColor(d.name)\n\t\t\t\t\t: null;\n\t\t\t})\n\t\t\t.classed(\"active\", function(d, i) {\n\t\t\t\treturn d.status === options.legend.items.status.ACTIVE;\n\t\t\t});\n\n\t\taddedLegendItems\n\t\t\t.append(\"text\")\n\t\t\t.merge(legendItems.select(\"text\"))\n\t\t\t.html(d => d.name)\n\t\t\t.attr(\"alignment-baseline\", \"middle\");\n\n\t\tthis.breakItemsIntoLines(addedLegendItems);\n\n\t\t// Remove old elements as needed.\n\t\tlegendItems\n\t\t\t.exit()\n\t\t\t.on(\"mouseover\", null)\n\t\t\t.on(\"click\", null)\n\t\t\t.on(\"mouseout\", null)\n\t\t\t.remove();\n\n\t\tconst legendClickable = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"legend\",\n\t\t\t\"clickable\"\n\t\t);\n\t\tsvg.classed(\"clickable\", legendClickable);\n\n\t\tif (legendClickable && addedLegendItems.size() > 0) {\n\t\t\tthis.addEventListeners();\n\t\t}\n\t}\n\n\tbreakItemsIntoLines(addedLegendItems) {\n\t\tconst self = this;\n\t\tconst svg = this.getContainerSVG();\n\t\tconst options = this.model.getOptions();\n\n\t\t// Configs\n\t\tconst checkboxRadius = options.legend.checkbox.radius;\n\t\tconst legendItemsHorizontalSpacing =\n\t\t\toptions.legend.items.horizontalSpace;\n\t\tconst legendItemsVerticalSpacing = options.legend.items.verticalSpace;\n\t\tconst legendTextYOffset = options.legend.items.textYOffset;\n\t\tconst spaceNeededForCheckbox =\n\t\t\tcheckboxRadius * 2 + options.legend.checkbox.spaceAfter;\n\n\t\t// Check if there are disabled legend items\n\t\tconst { DISABLED } = options.legend.items.status;\n\t\tconst dataGroups = this.model.getDataGroups();\n\t\tconst hasDeactivatedItems = dataGroups.some(\n\t\t\tdataGroup => dataGroup.status === DISABLED\n\t\t);\n\n\t\tconst legendOrientation = Tools.getProperty(\n\t\t\toptions,\n\t\t\t\"legend\",\n\t\t\t\"orientation\"\n\t\t);\n\n\t\t// Keep track of line numbers and positions\n\t\tlet startingPoint = 0;\n\t\tlet lineNumber = 0;\n\t\tlet itemIndexInLine = 0;\n\t\tlet lastYPosition;\n\t\taddedLegendItems\n\t\t\t.merge(svg.selectAll(\"g.legend-item\"))\n\t\t\t.each(function(d, i) {\n\t\t\t\tconst legendItem = select(this);\n\t\t\t\tconst previousLegendItem = select(\n\t\t\t\t\tsvg.selectAll(\"g.legend-item\").nodes()[i - 1]\n\t\t\t\t);\n\n\t\t\t\tif (\n\t\t\t\t\titemIndexInLine === 0 ||\n\t\t\t\t\tpreviousLegendItem.empty() ||\n\t\t\t\t\tlegendOrientation === LegendOrientations.VERTICAL\n\t\t\t\t) {\n\t\t\t\t\tif (\n\t\t\t\t\t\tlegendOrientation === LegendOrientations.VERTICAL &&\n\t\t\t\t\t\ti !== 0\n\t\t\t\t\t) {\n\t\t\t\t\t\tlineNumber++;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tconst svgDimensions = DOMUtils.getSVGElementSize(\n\t\t\t\t\t\tself.parent,\n\t\t\t\t\t\t{ useAttr: true }\n\t\t\t\t\t);\n\t\t\t\t\tconst legendItemTextDimensions = DOMUtils.getSVGElementSize(\n\t\t\t\t\t\tselect(this).select(\"text\"),\n\t\t\t\t\t\t{ useBBox: true }\n\t\t\t\t\t);\n\t\t\t\t\tconst lastLegendItemTextDimensions = DOMUtils.getSVGElementSize(\n\t\t\t\t\t\tpreviousLegendItem.select(\"text\"),\n\t\t\t\t\t\t{ useBBox: true }\n\t\t\t\t\t);\n\t\t\t\t\tstartingPoint =\n\t\t\t\t\t\tstartingPoint +\n\t\t\t\t\t\tlastLegendItemTextDimensions.width +\n\t\t\t\t\t\tspaceNeededForCheckbox +\n\t\t\t\t\t\tlegendItemsHorizontalSpacing;\n\n\t\t\t\t\tif (\n\t\t\t\t\t\tstartingPoint +\n\t\t\t\t\t\t\tspaceNeededForCheckbox +\n\t\t\t\t\t\t\tlegendItemTextDimensions.width >\n\t\t\t\t\t\tsvgDimensions.width\n\t\t\t\t\t) {\n\t\t\t\t\t\tlineNumber++;\n\t\t\t\t\t\tstartingPoint = 0;\n\t\t\t\t\t\titemIndexInLine = 0;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst yOffset = 0;\n\n\t\t\t\t// Position checkbox\n\t\t\t\t// TODO - Replace with layout component margins\n\t\t\t\tlegendItem\n\t\t\t\t\t.select(\"rect.checkbox\")\n\t\t\t\t\t.attr(\"x\", startingPoint)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t\"y\",\n\t\t\t\t\t\tyOffset + lineNumber * legendItemsVerticalSpacing\n\t\t\t\t\t);\n\n\t\t\t\t// Position text\n\t\t\t\t// TODO - Replace with layout component margins\n\t\t\t\tconst yPosition =\n\t\t\t\t\tlegendTextYOffset + lineNumber * legendItemsVerticalSpacing;\n\t\t\t\tlegendItem\n\t\t\t\t\t.select(\"text\")\n\t\t\t\t\t.attr(\"x\", startingPoint + spaceNeededForCheckbox)\n\t\t\t\t\t.attr(\"y\", yOffset + yPosition);\n\n\t\t\t\tlastYPosition = yPosition;\n\n\t\t\t\t// Render checkbox check icon\n\t\t\t\tif (\n\t\t\t\t\thasDeactivatedItems &&\n\t\t\t\t\tlegendItem.select(\"g.check\").empty()\n\t\t\t\t) {\n\t\t\t\t\tlegendItem.append(\"g\").classed(\"check\", true).html(`\n\t\t\t\t\t\t\t<svg focusable=\"false\" preserveAspectRatio=\"xMidYMid meet\"\n\t\t\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\"\n\t\t\t\t\t\t\t\tviewBox=\"0 0 32 32\" aria-hidden=\"true\"\n\t\t\t\t\t\t\t\tstyle=\"will-change: transform;\">\n\t\t\t\t\t\t\t\t<path d=\"M13 21.2l-7.1-7.1-1.4 1.4 7.1 7.1L13 24 27.1 9.9l-1.4-1.5z\"></path>\n\t\t\t\t\t\t\t\t<title>Checkmark</title>\n\t\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t`);\n\n\t\t\t\t\tlegendItem\n\t\t\t\t\t\t.select(\"g.check svg\")\n\t\t\t\t\t\t.attr(\"width\", checkboxRadius * 2 - 1)\n\t\t\t\t\t\t.attr(\"height\", checkboxRadius * 2 - 1)\n\t\t\t\t\t\t.attr(\n\t\t\t\t\t\t\t\"x\",\n\t\t\t\t\t\t\tparseFloat(\n\t\t\t\t\t\t\t\tlegendItem.select(\"rect.checkbox\").attr(\"x\")\n\t\t\t\t\t\t\t) + 0.5\n\t\t\t\t\t\t)\n\t\t\t\t\t\t.attr(\n\t\t\t\t\t\t\t\"y\",\n\t\t\t\t\t\t\tparseFloat(\n\t\t\t\t\t\t\t\tlegendItem.select(\"rect.checkbox\").attr(\"y\")\n\t\t\t\t\t\t\t) + 0.5\n\t\t\t\t\t\t);\n\t\t\t\t} else if (\n\t\t\t\t\t!hasDeactivatedItems &&\n\t\t\t\t\t!legendItem.select(\"g.check\").empty()\n\t\t\t\t) {\n\t\t\t\t\tlegendItem.select(\"g.check\").remove();\n\t\t\t\t}\n\n\t\t\t\titemIndexInLine++;\n\t\t\t});\n\t}\n\n\taddEventListeners() {\n\t\tconst self = this;\n\t\tconst svg = this.getContainerSVG();\n\t\tconst options = this.model.getOptions();\n\n\t\tsvg.selectAll(\"g.legend-item\")\n\t\t\t.on(\"mouseover\", function() {\n\t\t\t\tself.services.events.dispatchEvent(Events.Legend.ITEM_HOVER, {\n\t\t\t\t\thoveredElement: select(this)\n\t\t\t\t});\n\n\t\t\t\t// Configs\n\t\t\t\tconst checkboxRadius = options.legend.checkbox.radius;\n\n\t\t\t\tconst hoveredItem = select(this);\n\t\t\t\thoveredItem\n\t\t\t\t\t.append(\"rect\")\n\t\t\t\t\t.classed(\"hover-stroke\", true)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t\"x\",\n\t\t\t\t\t\tparseFloat(\n\t\t\t\t\t\t\thoveredItem.select(\"rect.checkbox\").attr(\"x\")\n\t\t\t\t\t\t) - 2\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t\"y\",\n\t\t\t\t\t\tparseFloat(\n\t\t\t\t\t\t\thoveredItem.select(\"rect.checkbox\").attr(\"y\")\n\t\t\t\t\t\t) - 2\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\"width\", checkboxRadius * 2 + 4)\n\t\t\t\t\t.attr(\"height\", checkboxRadius * 2 + 4)\n\t\t\t\t\t.attr(\"rx\", 3)\n\t\t\t\t\t.attr(\"ry\", 3)\n\t\t\t\t\t.lower();\n\t\t\t})\n\t\t\t.on(\"click\", function() {\n\t\t\t\tself.services.events.dispatchEvent(Events.Legend.ITEM_CLICK, {\n\t\t\t\t\tclickedElement: select(this)\n\t\t\t\t});\n\n\t\t\t\tconst clickedItem = select(this);\n\t\t\t\tconst clickedItemData = clickedItem.datum() as any;\n\n\t\t\t\tself.model.toggleDataLabel(clickedItemData.name);\n\t\t\t})\n\t\t\t.on(\"mouseout\", function() {\n\t\t\t\tconst hoveredItem = select(this);\n\t\t\t\thoveredItem.select(\"rect.hover-stroke\").remove();\n\n\t\t\t\tself.services.events.dispatchEvent(\n\t\t\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\t\t\t{\n\t\t\t\t\t\thoveredElement: hoveredItem\n\t\t\t\t\t}\n\t\t\t\t);\n\t\t\t});\n\t}\n}\n"]}
|
|
@@ -55,7 +55,7 @@ var Threshold = /** @class */ (function (_super) {
|
|
|
55
55
|
var _c = mainYScale.range(), yScaleEnd = _c[0], yScaleStart = _c[1];
|
|
56
56
|
if (isVertical) {
|
|
57
57
|
// Position the threshold on the y scale value
|
|
58
|
-
var y = scale(value) + (isScaleTypeLabels ?
|
|
58
|
+
var y = scale(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);
|
|
59
59
|
this.threshold
|
|
60
60
|
.transition(this.services.transitions.getTransition("threshold-update", animate))
|
|
61
61
|
.attr("transform", "translate(" + xScaleStart + ", " + y + ")");
|
|
@@ -66,7 +66,7 @@ var Threshold = /** @class */ (function (_super) {
|
|
|
66
66
|
}
|
|
67
67
|
else {
|
|
68
68
|
// Position the threshold on the x scale value
|
|
69
|
-
var x = scale(value) + (isScaleTypeLabels ?
|
|
69
|
+
var x = scale(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);
|
|
70
70
|
this.threshold
|
|
71
71
|
.transition(this.services.transitions.getTransition("threshold-update", animate))
|
|
72
72
|
.attr("transform", "translate(" + x + ", " + yScaleStart + ")");
|
|
@@ -98,7 +98,10 @@ var Threshold = /** @class */ (function (_super) {
|
|
|
98
98
|
var scaleType = this.services.cartesianScales.getScaleTypeByPosition(axisPosition);
|
|
99
99
|
// If scale is time, format the threshold date as the ticks format
|
|
100
100
|
if (scaleType === ScaleTypes.TIME) {
|
|
101
|
-
var isVertical = [
|
|
101
|
+
var isVertical = [
|
|
102
|
+
AxisPositions.LEFT,
|
|
103
|
+
AxisPositions.RIGHT
|
|
104
|
+
].includes(axisPosition);
|
|
102
105
|
var mainXScale = this.services.cartesianScales.getMainXScale();
|
|
103
106
|
var mainYScale = this.services.cartesianScales.getMainYScale();
|
|
104
107
|
var scale = isVertical ? mainYScale : mainXScale;
|
|
@@ -112,9 +115,12 @@ var Threshold = /** @class */ (function (_super) {
|
|
|
112
115
|
var _a = this.configs, value = _a.value, valueFormatter = _a.valueFormatter, fillColor = _a.fillColor, _b = _a.label, label = _b === void 0 ? "Threshold" : _b;
|
|
113
116
|
var holder = select(this.services.domUtils.getHolder());
|
|
114
117
|
// Format the threshold value using valueFormatter if defined in user-provided options
|
|
115
|
-
var formattedValue = valueFormatter
|
|
118
|
+
var formattedValue = valueFormatter
|
|
119
|
+
? valueFormatter(value)
|
|
120
|
+
: this.getFormattedValue();
|
|
116
121
|
this.label = DOMUtils.appendOrSelect(holder, "div." + this.thresholdClass + "--label." + this.thresholdIdentifierClass);
|
|
117
|
-
this.label
|
|
122
|
+
this.label
|
|
123
|
+
.html(label + ": " + formattedValue)
|
|
118
124
|
.classed("hidden", true)
|
|
119
125
|
.style("background-color", fillColor);
|
|
120
126
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"threshold.js","sourceRoot":"","sources":["threshold.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { ChartModel } from \"../../model\";\nimport { AxisPositions, Events, ScaleTypes } from \"../../interfaces\";\nimport { select, mouse } from \"d3-selection\";\n\n// Carbon position service\nimport Position, { PLACEMENTS } from \"@carbon/utils-position\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\nimport { formatTick, computeTimeIntervalName } from \"../../services/time-series\";\n\nexport class Threshold extends Component {\n\ttype = \"threshold\";\n\n\tthreshold: any;\n\tthresholdClass: string;\n\tthresholdIdentifierClass: string;\n\n\tlabel: any;\n\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any, configs: any) {\n\t\tsuper(model, services, configs);\n\t}\n\n\trender(animate = false) {\n\t\tconst { value, fillColor, axisPosition, index } = this.configs;\n\t\tconst chartprefix = Tools.getProperty(this.model.getOptions(), \"style\", \"prefix\");\n\t\tthis.thresholdClass = `${settings.prefix}--${chartprefix}--threshold`;\n\t\t// We can have multiple thresholds, set an unique identifier\n\t\tthis.thresholdIdentifierClass = `${axisPosition}-${index}`;\n\n\t\tthis.threshold = DOMUtils.appendOrSelect(this.parent, `g.${this.thresholdClass}.${this.thresholdIdentifierClass}`).raise();\n\t\t// Append threshold hoverable area\n\t\tconst thresholdRect = DOMUtils.appendOrSelect(this.threshold, `rect.threshold-hoverable-area`);\n\t\t// Append threshold line\n\t\tconst thresholdLine = DOMUtils.appendOrSelect(this.threshold, `line.threshold-line`);\n\n\t\t// Set threshold line color from configs options\n\t\t// If not defined, the line takes the defined CSS color\n\t\tthresholdLine.style(\"stroke\", fillColor);\n\n\t\tconst scale = this.services.cartesianScales.getScaleByPosition(axisPosition);\n\t\tconst isVertical = [AxisPositions.LEFT, AxisPositions.RIGHT].includes(axisPosition);\n\t\tconst scaleType = this.services.cartesianScales.getScaleTypeByPosition(axisPosition);\n\t\tconst mainXScale = this.services.cartesianScales.getMainXScale();\n\t\tconst mainYScale = this.services.cartesianScales.getMainYScale();\n\t\tconst isScaleTypeLabels = scaleType === ScaleTypes.LABELS;\n\t\tconst [xScaleStart, xScaleEnd] = mainXScale.range();\n\t\tconst [yScaleEnd, yScaleStart] = mainYScale.range();\n\n\t\tif (isVertical) {\n\t\t\t// Position the threshold on the y scale value\n\t\t\tconst y = scale(value) + (isScaleTypeLabels ? (scale.step() / 2) : 0);\n\t\t\tthis.threshold\n\t\t\t\t.transition(this.services.transitions.getTransition(\"threshold-update\", animate))\n\t\t\t\t.attr(\"transform\", `translate(${xScaleStart}, ${y})`);\n\t\t\t// Set line end point on the x-axis\n\t\t\tthresholdLine.attr(\"x2\", xScaleEnd - xScaleStart);\n\t\t\t// Set hoverable area width\n\t\t\tthresholdRect.attr(\"width\", xScaleEnd - xScaleStart);\n\t\t} else {\n\t\t\t// Position the threshold on the x scale value\n\t\t\tconst x = scale(value) + (isScaleTypeLabels ? (scale.step() / 2) : 0);\n\t\t\tthis.threshold\n\t\t\t\t.transition(this.services.transitions.getTransition(\"threshold-update\", animate))\n\t\t\t\t.attr(\"transform\", `translate(${x}, ${yScaleStart})`);\n\t\t\t// Set line end point on the y-axis\n\t\t\tthresholdLine.attr(\"y2\", yScaleEnd - yScaleStart);\n\t\t\t// Set hoverable area width and rotate it\n\t\t\tthresholdRect.attr(\"width\", yScaleEnd - yScaleStart);\n\t\t\tthresholdRect.classed(\"rotate\", true);\n\t\t}\n\n\t\tconst self = this;\n\t\tthis.services.events.addEventListener(Events.Threshold.SHOW, e => {\n\t\t\tconst hovered = e.detail.hoveredElement.node();\n\t\t\t// If is this threshold\n\t\t\tif (hovered === self.threshold) {\n\t\t\t\t// Set label position and show it\n\t\t\t\tthis.setThresholdLabelPosition();\n\t\t\t\tthis.label.classed(\"hidden\", false);\n\t\t\t}\n\t\t});\n\n\t\tthis.services.events.addEventListener(Events.Threshold.HIDE, e => {\n\t\t\tthis.label.classed(\"hidden\", true);\n\t\t});\n\n\t\tthis.appendThresholdLabel();\n\n\t\tthis.addEventListeners();\n\t}\n\n\tgetFormattedValue() {\n\t\tconst { value, axisPosition } = this.configs;\n\t\tconst options = this.model.getOptions();\n\t\tconst scaleType = this.services.cartesianScales.getScaleTypeByPosition(axisPosition);\n\n\t\t// If scale is time, format the threshold date as the ticks format\n\t\tif (scaleType === ScaleTypes.TIME) {\n\t\t\tconst isVertical = [AxisPositions.LEFT, AxisPositions.RIGHT].includes(axisPosition);\n\t\t\tconst mainXScale = this.services.cartesianScales.getMainXScale();\n\t\t\tconst mainYScale = this.services.cartesianScales.getMainYScale();\n\t\t\tconst scale = isVertical ? mainYScale : mainXScale;\n\n\t\t\tconst timeScaleOptions = Tools.getProperty(options, \"timeScale\");\n\t\t\tconst timeInterval = computeTimeIntervalName(scale.ticks());\n\t\t\treturn formatTick(value, 0, timeInterval, timeScaleOptions);\n\t\t}\n\n\t\treturn value.toLocaleString(\"en\");\n\t}\n\n\tappendThresholdLabel() {\n\t\tconst { value, valueFormatter, fillColor, label = \"Threshold\" } = this.configs;\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\t// Format the threshold value using valueFormatter if defined in user-provided options\n\t\tconst formattedValue = valueFormatter ? valueFormatter(value) : this.getFormattedValue();\n\n\t\tthis.label = DOMUtils.appendOrSelect(holder, `div.${this.thresholdClass}--label.${this.thresholdIdentifierClass}`);\n\t\tthis.label.html(`${label}: ${formattedValue}`)\n\t\t\t.classed(\"hidden\", true)\n\t\t\t.style(\"background-color\", fillColor);\n\t}\n\n\tsetThresholdLabelPosition() {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst target = this.label.node();\n\t\tconst mouseRelativePos = mouse(holder);\n\n\t\t// Find out whether threshold label should be shown on the left or right side\n\t\tconst bestPlacementOption = this.positionService.findBestPlacementAt(\n\t\t\t{\n\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t},\n\t\t\ttarget,\n\t\t\t[\n\t\t\t\tPLACEMENTS.RIGHT,\n\t\t\t\tPLACEMENTS.LEFT,\n\t\t\t\tPLACEMENTS.TOP,\n\t\t\t\tPLACEMENTS.BOTTOM\n\t\t\t],\n\t\t\t() => ({\n\t\t\t\twidth: holder.offsetWidth,\n\t\t\t\theight: holder.offsetHeight\n\t\t\t})\n\t\t);\n\n\t\t// Get coordinates to where label should be positioned\n\t\tconst pos = this.positionService.findPositionAt(\n\t\t\t{\n\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t},\n\t\t\ttarget,\n\t\t\tbestPlacementOption\n\t\t);\n\n\t\tthis.positionService.setElement(target, pos);\n\t}\n\n\taddEventListeners() {\n\t\tconst self = this;\n\n\t\t// Add events to the threshold hoverable area\n\t\tDOMUtils.appendOrSelect(this.threshold, \"rect\")\n\t\t\t.on(\"mouseover mousemove\", function() {\n\t\t\t\t\tself.threshold.classed(\"active\", true);\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Threshold.SHOW, {\n\t\t\t\t\t\thoveredElement: select(self.threshold)\n\t\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mouseout\", function() {\n\t\t\t\t\tself.threshold.classed(\"active\", false);\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Threshold.HIDE, {\n\t\t\t\t\t\thoveredElement: select(self.threshold)\n\t\t\t\t\t});\n\t\t\t});\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"threshold.js","sourceRoot":"","sources":["threshold.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component } from \"../component\";\nimport { Tools } from \"../../tools\";\nimport { DOMUtils } from \"../../services\";\nimport { ChartModel } from \"../../model\";\nimport { AxisPositions, Events, ScaleTypes } from \"../../interfaces\";\nimport { select, mouse } from \"d3-selection\";\n\n// Carbon position service\nimport Position, { PLACEMENTS } from \"@carbon/utils-position\";\n\n// import the settings for the css prefix\nimport settings from \"carbon-components/es/globals/js/settings\";\nimport {\n\tformatTick,\n\tcomputeTimeIntervalName\n} from \"../../services/time-series\";\n\nexport class Threshold extends Component {\n\ttype = \"threshold\";\n\n\tthreshold: any;\n\tthresholdClass: string;\n\tthresholdIdentifierClass: string;\n\n\tlabel: any;\n\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any, configs: any) {\n\t\tsuper(model, services, configs);\n\t}\n\n\trender(animate = false) {\n\t\tconst { value, fillColor, axisPosition, index } = this.configs;\n\t\tconst chartprefix = Tools.getProperty(\n\t\t\tthis.model.getOptions(),\n\t\t\t\"style\",\n\t\t\t\"prefix\"\n\t\t);\n\t\tthis.thresholdClass = `${settings.prefix}--${chartprefix}--threshold`;\n\t\t// We can have multiple thresholds, set an unique identifier\n\t\tthis.thresholdIdentifierClass = `${axisPosition}-${index}`;\n\n\t\tthis.threshold = DOMUtils.appendOrSelect(\n\t\t\tthis.parent,\n\t\t\t`g.${this.thresholdClass}.${this.thresholdIdentifierClass}`\n\t\t).raise();\n\t\t// Append threshold hoverable area\n\t\tconst thresholdRect = DOMUtils.appendOrSelect(\n\t\t\tthis.threshold,\n\t\t\t`rect.threshold-hoverable-area`\n\t\t);\n\t\t// Append threshold line\n\t\tconst thresholdLine = DOMUtils.appendOrSelect(\n\t\t\tthis.threshold,\n\t\t\t`line.threshold-line`\n\t\t);\n\n\t\t// Set threshold line color from configs options\n\t\t// If not defined, the line takes the defined CSS color\n\t\tthresholdLine.style(\"stroke\", fillColor);\n\n\t\tconst scale = this.services.cartesianScales.getScaleByPosition(\n\t\t\taxisPosition\n\t\t);\n\t\tconst isVertical = [AxisPositions.LEFT, AxisPositions.RIGHT].includes(\n\t\t\taxisPosition\n\t\t);\n\t\tconst scaleType = this.services.cartesianScales.getScaleTypeByPosition(\n\t\t\taxisPosition\n\t\t);\n\t\tconst mainXScale = this.services.cartesianScales.getMainXScale();\n\t\tconst mainYScale = this.services.cartesianScales.getMainYScale();\n\t\tconst isScaleTypeLabels = scaleType === ScaleTypes.LABELS;\n\t\tconst [xScaleStart, xScaleEnd] = mainXScale.range();\n\t\tconst [yScaleEnd, yScaleStart] = mainYScale.range();\n\n\t\tif (isVertical) {\n\t\t\t// Position the threshold on the y scale value\n\t\t\tconst y = scale(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);\n\t\t\tthis.threshold\n\t\t\t\t.transition(\n\t\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\t\"threshold-update\",\n\t\t\t\t\t\tanimate\n\t\t\t\t\t)\n\t\t\t\t)\n\t\t\t\t.attr(\"transform\", `translate(${xScaleStart}, ${y})`);\n\t\t\t// Set line end point on the x-axis\n\t\t\tthresholdLine.attr(\"x2\", xScaleEnd - xScaleStart);\n\t\t\t// Set hoverable area width\n\t\t\tthresholdRect.attr(\"width\", xScaleEnd - xScaleStart);\n\t\t} else {\n\t\t\t// Position the threshold on the x scale value\n\t\t\tconst x = scale(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);\n\t\t\tthis.threshold\n\t\t\t\t.transition(\n\t\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t\t\"threshold-update\",\n\t\t\t\t\t\tanimate\n\t\t\t\t\t)\n\t\t\t\t)\n\t\t\t\t.attr(\"transform\", `translate(${x}, ${yScaleStart})`);\n\t\t\t// Set line end point on the y-axis\n\t\t\tthresholdLine.attr(\"y2\", yScaleEnd - yScaleStart);\n\t\t\t// Set hoverable area width and rotate it\n\t\t\tthresholdRect.attr(\"width\", yScaleEnd - yScaleStart);\n\t\t\tthresholdRect.classed(\"rotate\", true);\n\t\t}\n\n\t\tconst self = this;\n\t\tthis.services.events.addEventListener(Events.Threshold.SHOW, e => {\n\t\t\tconst hovered = e.detail.hoveredElement.node();\n\t\t\t// If is this threshold\n\t\t\tif (hovered === self.threshold) {\n\t\t\t\t// Set label position and show it\n\t\t\t\tthis.setThresholdLabelPosition();\n\t\t\t\tthis.label.classed(\"hidden\", false);\n\t\t\t}\n\t\t});\n\n\t\tthis.services.events.addEventListener(Events.Threshold.HIDE, e => {\n\t\t\tthis.label.classed(\"hidden\", true);\n\t\t});\n\n\t\tthis.appendThresholdLabel();\n\n\t\tthis.addEventListeners();\n\t}\n\n\tgetFormattedValue() {\n\t\tconst { value, axisPosition } = this.configs;\n\t\tconst options = this.model.getOptions();\n\t\tconst scaleType = this.services.cartesianScales.getScaleTypeByPosition(\n\t\t\taxisPosition\n\t\t);\n\n\t\t// If scale is time, format the threshold date as the ticks format\n\t\tif (scaleType === ScaleTypes.TIME) {\n\t\t\tconst isVertical = [\n\t\t\t\tAxisPositions.LEFT,\n\t\t\t\tAxisPositions.RIGHT\n\t\t\t].includes(axisPosition);\n\t\t\tconst mainXScale = this.services.cartesianScales.getMainXScale();\n\t\t\tconst mainYScale = this.services.cartesianScales.getMainYScale();\n\t\t\tconst scale = isVertical ? mainYScale : mainXScale;\n\n\t\t\tconst timeScaleOptions = Tools.getProperty(options, \"timeScale\");\n\t\t\tconst timeInterval = computeTimeIntervalName(scale.ticks());\n\t\t\treturn formatTick(value, 0, timeInterval, timeScaleOptions);\n\t\t}\n\n\t\treturn value.toLocaleString(\"en\");\n\t}\n\n\tappendThresholdLabel() {\n\t\tconst {\n\t\t\tvalue,\n\t\t\tvalueFormatter,\n\t\t\tfillColor,\n\t\t\tlabel = \"Threshold\"\n\t\t} = this.configs;\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\t\t// Format the threshold value using valueFormatter if defined in user-provided options\n\t\tconst formattedValue = valueFormatter\n\t\t\t? valueFormatter(value)\n\t\t\t: this.getFormattedValue();\n\n\t\tthis.label = DOMUtils.appendOrSelect(\n\t\t\tholder,\n\t\t\t`div.${this.thresholdClass}--label.${this.thresholdIdentifierClass}`\n\t\t);\n\t\tthis.label\n\t\t\t.html(`${label}: ${formattedValue}`)\n\t\t\t.classed(\"hidden\", true)\n\t\t\t.style(\"background-color\", fillColor);\n\t}\n\n\tsetThresholdLabelPosition() {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst target = this.label.node();\n\t\tconst mouseRelativePos = mouse(holder);\n\n\t\t// Find out whether threshold label should be shown on the left or right side\n\t\tconst bestPlacementOption = this.positionService.findBestPlacementAt(\n\t\t\t{\n\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t},\n\t\t\ttarget,\n\t\t\t[\n\t\t\t\tPLACEMENTS.RIGHT,\n\t\t\t\tPLACEMENTS.LEFT,\n\t\t\t\tPLACEMENTS.TOP,\n\t\t\t\tPLACEMENTS.BOTTOM\n\t\t\t],\n\t\t\t() => ({\n\t\t\t\twidth: holder.offsetWidth,\n\t\t\t\theight: holder.offsetHeight\n\t\t\t})\n\t\t);\n\n\t\t// Get coordinates to where label should be positioned\n\t\tconst pos = this.positionService.findPositionAt(\n\t\t\t{\n\t\t\t\tleft: mouseRelativePos[0],\n\t\t\t\ttop: mouseRelativePos[1]\n\t\t\t},\n\t\t\ttarget,\n\t\t\tbestPlacementOption\n\t\t);\n\n\t\tthis.positionService.setElement(target, pos);\n\t}\n\n\taddEventListeners() {\n\t\tconst self = this;\n\n\t\t// Add events to the threshold hoverable area\n\t\tDOMUtils.appendOrSelect(this.threshold, \"rect\")\n\t\t\t.on(\"mouseover mousemove\", function() {\n\t\t\t\tself.threshold.classed(\"active\", true);\n\t\t\t\tself.services.events.dispatchEvent(Events.Threshold.SHOW, {\n\t\t\t\t\thoveredElement: select(self.threshold)\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on(\"mouseout\", function() {\n\t\t\t\tself.threshold.classed(\"active\", false);\n\t\t\t\tself.services.events.dispatchEvent(Events.Threshold.HIDE, {\n\t\t\t\t\thoveredElement: select(self.threshold)\n\t\t\t\t});\n\t\t\t});\n\t}\n}\n"]}
|
|
@@ -36,17 +36,19 @@ var Title = /** @class */ (function (_super) {
|
|
|
36
36
|
// check if the title is too big for the containing svg
|
|
37
37
|
if (title.node().getComputedTextLength() > containerWidth) {
|
|
38
38
|
// append the ellipses to their own tspan to calculate the text length
|
|
39
|
-
title.append("tspan")
|
|
40
|
-
.text("...");
|
|
39
|
+
title.append("tspan").text("...");
|
|
41
40
|
// get the bounding width including the elipses '...'
|
|
42
|
-
var tspanLength = DOMUtils.appendOrSelect(title, "tspan")
|
|
41
|
+
var tspanLength = DOMUtils.appendOrSelect(title, "tspan")
|
|
42
|
+
.node()
|
|
43
|
+
.getComputedTextLength();
|
|
43
44
|
var truncatedSize = Math.floor(containerWidth - tspanLength);
|
|
44
45
|
var titleString = this.model.getOptions().title;
|
|
45
46
|
// get the index for creating the max length substring that fit within the svg
|
|
46
47
|
// use one less than the index to avoid crowding (the elipsis)
|
|
47
48
|
var substringIndex = this.getSubstringIndex(title.node(), 0, titleString.length - 1, truncatedSize);
|
|
48
49
|
// use the substring as the title
|
|
49
|
-
title
|
|
50
|
+
title
|
|
51
|
+
.html(titleString.substring(0, substringIndex - 1))
|
|
50
52
|
.append("tspan")
|
|
51
53
|
.text("...");
|
|
52
54
|
// add events for displaying the tooltip with the title
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"title.js","sourceRoot":"","sources":["title.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAE1D;IAA2B,yBAAS;IAApC;QAAA,
|
|
1
|
+
{"version":3,"file":"title.js","sourceRoot":"","sources":["title.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Component } from \"../component\";\nimport { DOMUtils } from \"../../services\";\nimport { TooltipTypes, Events } from \"./../../interfaces\";\n\nexport class Title extends Component {\n\ttype = \"title\";\n\n\t/**\n\t * Truncates title creating ellipses and attaching tooltip for exposing full title.\n\t */\n\ttruncateTitle() {\n\t\t// get a reference to the title elements to calculate the size the title can be\n\t\tconst containerWidth = DOMUtils.getSVGElementSize(\n\t\t\tthis.services.domUtils.getMainSVG(),\n\t\t\t{ useAttr: true }\n\t\t).width;\n\t\tconst title = DOMUtils.appendOrSelect(this.parent, \"text.title\");\n\n\t\t// sanity check to prevent stack overflow on binary search\n\t\tif (containerWidth <= 0) {\n\t\t\treturn;\n\t\t}\n\n\t\t// check if the title is too big for the containing svg\n\t\tif (title.node().getComputedTextLength() > containerWidth) {\n\t\t\t// append the ellipses to their own tspan to calculate the text length\n\t\t\ttitle.append(\"tspan\").text(\"...\");\n\n\t\t\t// get the bounding width including the elipses '...'\n\t\t\tconst tspanLength = DOMUtils.appendOrSelect(title, \"tspan\")\n\t\t\t\t.node()\n\t\t\t\t.getComputedTextLength();\n\t\t\tconst truncatedSize = Math.floor(containerWidth - tspanLength);\n\t\t\tconst titleString = this.model.getOptions().title;\n\n\t\t\t// get the index for creating the max length substring that fit within the svg\n\t\t\t// use one less than the index to avoid crowding (the elipsis)\n\t\t\tconst substringIndex = this.getSubstringIndex(\n\t\t\t\ttitle.node(),\n\t\t\t\t0,\n\t\t\t\ttitleString.length - 1,\n\t\t\t\ttruncatedSize\n\t\t\t);\n\n\t\t\t// use the substring as the title\n\t\t\ttitle\n\t\t\t\t.html(titleString.substring(0, substringIndex - 1))\n\t\t\t\t.append(\"tspan\")\n\t\t\t\t.text(\"...\");\n\n\t\t\t// add events for displaying the tooltip with the title\n\t\t\tconst self = this;\n\t\t\ttitle\n\t\t\t\t.on(\"mouseenter\", function() {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\t\thoveredElement: title,\n\t\t\t\t\t\ttype: TooltipTypes.TITLE\n\t\t\t\t\t});\n\t\t\t\t})\n\t\t\t\t.on(\"mouseout\", function() {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE, {\n\t\t\t\t\t\thoveredElement: title\n\t\t\t\t\t});\n\t\t\t\t});\n\t\t}\n\t}\n\n\trender() {\n\t\tconst svg = this.getContainerSVG();\n\n\t\tconst text = DOMUtils.appendOrSelect(svg, \"text.title\");\n\t\ttext.attr(\"x\", 0)\n\t\t\t.attr(\"y\", 20)\n\t\t\t.html(this.model.getOptions().title);\n\n\t\t// title needs to first render so that we can check for overflow\n\t\tthis.truncateTitle();\n\t}\n\n\t/**\n\t * Returns the index for a maximum length substring that is less than the width parameter.\n\t * @param title the title node used for getting the text lengths of substrings\n\t * @param start the start index for the binary search\n\t * @param end the end index for the binary search\n\t * @param width the width of the svg container that holds the title\n\t */\n\tprotected getSubstringIndex(title, start, end, width) {\n\t\tconst mid = Math.floor((end + start) / 2);\n\t\tif (title.getSubStringLength(0, mid) > width) {\n\t\t\treturn this.getSubstringIndex(title, start, mid, width);\n\t\t} else if (title.getSubStringLength(0, mid) < width) {\n\t\t\tif (title.getSubStringLength(0, mid + 1) > width) {\n\t\t\t\treturn mid;\n\t\t\t}\n\t\t\treturn this.getSubstringIndex(title, mid, end, width);\n\t\t} else {\n\t\t\treturn mid;\n\t\t}\n\t}\n}\n"]}
|