@carbon/charts 0.41.34 → 0.41.38

package/components/essentials/threshold.js

@@ -14,7 +14,7 @@ var __extends = (this && this.__extends) || (function () {
 import { Component } from '../component';
 import { Tools } from '../../tools';
 import { DOMUtils } from '../../services';
-import { AxisPositions, Events, ScaleTypes, } from '../../interfaces';
+import { AxisPositions, Events, ScaleTypes } from '../../interfaces';
 import { select, mouse } from 'd3-selection';
 // Carbon position service
 import Position, { PLACEMENTS } from '@carbon/utils-position';
@@ -23,8 +23,8 @@ import settings from 'carbon-components/es/globals/js/settings';
 import { formatTick, computeTimeIntervalName, } from '../../services/time-series';
 var Threshold = /** @class */ (function (_super) {
     __extends(Threshold, _super);
-    function Threshold(model, services, configs) {
-        var _this = _super.call(this, model, services, configs) || this;
+    function Threshold(model, services) {
+        var _this = _super.call(this, model, services) || this;
         _this.type = 'threshold';
         _this.positionService = new Position();
         return _this;
@@ -32,74 +32,146 @@ var Threshold = /** @class */ (function (_super) {
     Threshold.prototype.render = function (animate) {
         var _this = this;
         if (animate === void 0) { animate = false; }
-        var _a = this.configs, value = _a.value, fillColor = _a.fillColor, axisPosition = _a.axisPosition, index = _a.index;
-        var chartprefix = Tools.getProperty(this.getOptions(), 'style', 'prefix');
-        this.thresholdClass = settings.prefix + "--" + chartprefix + "--threshold";
-        // We can have multiple thresholds, set an unique identifier
-        this.thresholdIdentifierClass = axisPosition + "-" + index;
-        this.threshold = DOMUtils.appendOrSelect(this.parent, "g." + this.thresholdClass + "." + this.thresholdIdentifierClass).raise();
-        // Append threshold hoverable area
-        var thresholdRect = DOMUtils.appendOrSelect(this.threshold, "rect.threshold-hoverable-area");
-        // Append threshold line
-        var thresholdLine = DOMUtils.appendOrSelect(this.threshold, "line.threshold-line");
-        // Set threshold line color from configs options
-        // If not defined, the line takes the defined CSS color
-        thresholdLine.style('stroke', fillColor);
-        var scale = this.services.cartesianScales.getScaleByPosition(axisPosition);
-        var scaleType = this.services.cartesianScales.getScaleTypeByPosition(axisPosition);
-        var mainXScale = this.services.cartesianScales.getMainXScale();
-        var mainYScale = this.services.cartesianScales.getMainYScale();
-        var isScaleTypeLabels = scaleType === ScaleTypes.LABELS;
-        var _b = mainXScale.range(), xScaleStart = _b[0], xScaleEnd = _b[1];
-        var _c = mainYScale.range(), yScaleEnd = _c[0], yScaleStart = _c[1];
-        var cartesianScales = this.services.cartesianScales;
-        var orientation = cartesianScales.getOrientation();
-        var getDomainValue = function (d) { return cartesianScales.getDomainValue(d); };
-        var getRangeValue = function (d) { return cartesianScales.getRangeValue(d); };
-        var _d = Tools.flipDomainAndRangeBasedOnOrientation(getDomainValue, getRangeValue, orientation), getXValue = _d[0], getYValue = _d[1];
-        if (axisPosition === AxisPositions.TOP ||
-            axisPosition === AxisPositions.BOTTOM) {
-            var position = getXValue(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);
-            // Position the threshold on the x scale value
-            this.threshold
-                .transition(this.services.transitions.getTransition('threshold-update', animate))
-                .attr('transform', "translate(" + position + ", " + yScaleStart + ")");
-            // Set line end point on the y-axis
-            thresholdLine.attr('y2', yScaleEnd - yScaleStart);
-            // Set hoverable area width and rotate it
-            thresholdRect
-                .attr('width', Math.abs(yScaleEnd - yScaleStart))
-                .classed('rotate', true);
-        }
-        else {
-            var position = getYValue(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);
-            // Position the threshold on the y scale value
-            this.threshold
-                .transition(this.services.transitions.getTransition('threshold-update', animate))
-                .attr('transform', "translate(" + xScaleStart + ", " + position + ")");
-            // Set line end point on the x-axis
-            thresholdLine.attr('x2', xScaleEnd - xScaleStart);
-            // Set hoverable area width
-            thresholdRect.attr('width', Math.abs(xScaleEnd - xScaleStart));
-        }
+        var axesOptions = Tools.getProperty(this.getOptions(), 'axes');
+        var thresholdData = [];
+        Object.keys(axesOptions).forEach(function (axisPosition) {
+            if (Object.values(AxisPositions).includes(axisPosition)) {
+                var axisOptions = axesOptions[axisPosition];
+                if (axisOptions.thresholds &&
+                    axisOptions.thresholds.length > 0) {
+                    thresholdData.push({
+                        axisPosition: axisPosition,
+                        thresholds: axisOptions.thresholds,
+                    });
+                }
+            }
+        });
+        // Grab container SVG
+        var svg = this.getContainerSVG({ withinChartClip: true });
+        // Update data on all axis threshold groups
+        var thresholdAxisGroups = svg
+            .selectAll('g.axis-thresholds')
+            .data(thresholdData, function (thresholdData) { return thresholdData.axisPosition; });
+        // Remove axis threshold groups that are no longer needed
+        thresholdAxisGroups.exit().attr('opacity', 0).remove();
+        // Add the axis threshold groups that need to be introduced
+        var thresholdAxisGroupsEnter = thresholdAxisGroups
+            .enter()
+            .append('g');
+        var thresholdAxisGroupsMerge = thresholdAxisGroupsEnter.merge(thresholdAxisGroups);
+        thresholdAxisGroupsMerge.attr('class', function (d) { return "axis-thresholds " + d.axisPosition; });
+        var thresholdGroups = thresholdAxisGroupsMerge
+            .selectAll('g.threshold-group')
+            .data(function (d) {
+            return d.thresholds.map(function (threshold) {
+                threshold.axisPosition = d.axisPosition;
+                return threshold;
+            });
+        });
+        // Remove threshold groups that are no longer needed
+        thresholdGroups.exit().attr('opacity', 0).remove();
+        // Add the threshold groups that need to be introduced
+        var thresholdGroupsEnter = thresholdGroups.enter().append('g');
+        thresholdGroupsEnter.append('line').attr('class', 'threshold-line');
+        thresholdGroupsEnter
+            .append('rect')
+            .attr('class', 'threshold-hoverable-area');
+        var thresholdGroupsMerge = thresholdGroupsEnter.merge(thresholdGroups);
+        thresholdGroupsMerge.attr('class', 'threshold-group');
         var self = this;
-        this.services.events.addEventListener(Events.Threshold.SHOW, function (e) {
-            var hovered = e.detail.hoveredElement.node();
-            // If is this threshold
-            if (hovered === self.threshold) {
-                // Set label position and show it
-                _this.setThresholdLabelPosition();
-                _this.label.classed('hidden', false);
+        thresholdAxisGroupsMerge.each(function (_a) {
+            var axisPosition = _a.axisPosition;
+            var scale = self.services.cartesianScales.getScaleByPosition(axisPosition);
+            var scaleType = self.services.cartesianScales.getScaleTypeByPosition(axisPosition);
+            var mainXScale = self.services.cartesianScales.getMainXScale();
+            var mainYScale = self.services.cartesianScales.getMainYScale();
+            var isScaleTypeLabels = scaleType === ScaleTypes.LABELS;
+            var _b = mainXScale.range(), xScaleStart = _b[0], xScaleEnd = _b[1];
+            var _c = mainYScale.range(), yScaleEnd = _c[0], yScaleStart = _c[1];
+            var cartesianScales = self.services.cartesianScales;
+            var orientation = cartesianScales.getOrientation();
+            var getDomainValue = function (d) { return cartesianScales.getDomainValue(d); };
+            var getRangeValue = function (d) { return cartesianScales.getRangeValue(d); };
+            var _d = Tools.flipDomainAndRangeBasedOnOrientation(getDomainValue, getRangeValue, orientation), getXValue = _d[0], getYValue = _d[1];
+            var group = select(this);
+            if (axisPosition === AxisPositions.TOP ||
+                axisPosition === AxisPositions.BOTTOM) {
+                group
+                    .selectAll('line.threshold-line')
+                    .transition(self.services.transitions.getTransition('threshold-line-update', animate))
+                    .attr('y1', yScaleStart)
+                    .attr('y2', yScaleEnd)
+                    .attr('x1', function (_a) {
+                    var value = _a.value;
+                    return getXValue(value) +
+                        (isScaleTypeLabels ? scale.step() / 2 : 0);
+                })
+                    .attr('x2', function (_a) {
+                    var value = _a.value;
+                    return getXValue(value) +
+                        (isScaleTypeLabels ? scale.step() / 2 : 0);
+                })
+                    .style('stroke', function (_a) {
+                    var fillColor = _a.fillColor;
+                    return fillColor;
+                });
+                // Set hoverable area width and rotate it
+                group
+                    .selectAll('rect.threshold-hoverable-area')
+                    .attr('x', 0)
+                    .attr('y', function (_a) {
+                    var value = _a.value;
+                    return -getXValue(value);
+                })
+                    .attr('width', Math.abs(yScaleEnd - yScaleStart))
+                    .classed('rotate', true);
+            }
+            else {
+                group
+                    .selectAll('line.threshold-line')
+                    .transition(self.services.transitions.getTransition('threshold-line-update', animate))
+                    .attr('x1', xScaleStart)
+                    .attr('x2', xScaleEnd)
+                    .attr('y1', function (_a) {
+                    var value = _a.value;
+                    return getYValue(value) +
+                        (isScaleTypeLabels ? scale.step() / 2 : 0);
+                })
+                    .attr('y2', function (_a) {
+                    var value = _a.value;
+                    return getYValue(value) +
+                        (isScaleTypeLabels ? scale.step() / 2 : 0);
+                })
+                    .style('stroke', function (_a) {
+                    var fillColor = _a.fillColor;
+                    return fillColor;
+                });
+                // Set hoverable area width
+                group
+                    .selectAll('rect.threshold-hoverable-area')
+                    .attr('x', xScaleStart)
+                    .attr('y', function (_a) {
+                    var value = _a.value;
+                    return getYValue(value);
+                })
+                    .attr('width', Math.abs(xScaleEnd - xScaleStart))
+                    .classed('rotate', false);
             }
         });
+        // Add event listener for showing the threshold tooltip
+        this.services.events.addEventListener(Events.Threshold.SHOW, function (e) {
+            _this.setThresholdLabelPosition(e.detail.datum);
+            _this.label.classed('hidden', false);
+        });
+        // Add event listener for hiding the threshold tooltip
         this.services.events.addEventListener(Events.Threshold.HIDE, function (e) {
             _this.label.classed('hidden', true);
         });
         this.appendThresholdLabel();
         this.addEventListeners();
     };
-    Threshold.prototype.getFormattedValue = function () {
-        var _a = this.configs, value = _a.value, axisPosition = _a.axisPosition;
+    Threshold.prototype.getFormattedValue = function (datum) {
+        var value = datum.value, axisPosition = datum.axisPosition;
         var options = this.getOptions();
         var scaleType = this.services.cartesianScales.getScaleTypeByPosition(axisPosition);
         // If scale is time, format the threshold date as the ticks format
@@ -118,22 +190,21 @@ var Threshold = /** @class */ (function (_super) {
         return value.toLocaleString('en');
     };
     Threshold.prototype.appendThresholdLabel = function () {
-        var _a = this.configs, value = _a.value, valueFormatter = _a.valueFormatter, fillColor = _a.fillColor, _b = _a.label, label = _b === void 0 ? 'Threshold' : _b;
         var holder = select(this.services.domUtils.getHolder());
-        // Format the threshold value using valueFormatter if defined in user-provided options
-        var formattedValue = valueFormatter
-            ? valueFormatter(value)
-            : this.getFormattedValue();
-        this.label = DOMUtils.appendOrSelect(holder, "div." + this.thresholdClass + "--label." + this.thresholdIdentifierClass);
-        this.label
-            .html(label + ": " + formattedValue)
-            .classed('hidden', true)
-            .style('background-color', fillColor);
+        var chartprefix = Tools.getProperty(this.getOptions(), 'style', 'prefix');
+        this.label = DOMUtils.appendOrSelect(holder, "div." + settings.prefix + "--" + chartprefix + "--threshold--label").classed('hidden', true);
     };
-    Threshold.prototype.setThresholdLabelPosition = function () {
+    Threshold.prototype.setThresholdLabelPosition = function (datum) {
         var holder = this.services.domUtils.getHolder();
-        var target = this.label.node();
         var mouseRelativePos = mouse(holder);
+        // Format the threshold value using valueFormatter if defined in user-provided options
+        var formattedValue = datum.valueFormatter
+            ? datum.valueFormatter(datum.value)
+            : this.getFormattedValue(datum);
+        this.label
+            .html((datum.label || 'Threshold') + ": " + formattedValue)
+            .style('background-color', datum.fillColor);
+        var target = this.label.node();
         // Find out whether threshold label should be shown on the left or right side
         var bestPlacementOption = this.positionService.findBestPlacementAt({
             left: mouseRelativePos[0],
@@ -156,18 +227,26 @@ var Threshold = /** @class */ (function (_super) {
     };
     Threshold.prototype.addEventListeners = function () {
         var self = this;
+        // Grab container SVG
+        var svg = this.getContainerSVG({ withinChartClip: true });
         // Add events to the threshold hoverable area
-        DOMUtils.appendOrSelect(this.threshold, 'rect')
+        svg.selectAll('rect.threshold-hoverable-area')
             .on('mouseover mousemove', function () {
-            self.threshold.classed('active', true);
+            select(this.parentNode)
+                .select('line.threshold-line')
+                .classed('active', true);
             self.services.events.dispatchEvent(Events.Threshold.SHOW, {
-                hoveredElement: select(self.threshold),
+                hoveredElement: select(this),
+                datum: select(this).datum(),
             });
         })
             .on('mouseout', function () {
-            self.threshold.classed('active', false);
+            select(this.parentNode)
+                .select('line.threshold-line')
+                .classed('active', false);
             self.services.events.dispatchEvent(Events.Threshold.HIDE, {
-                hoveredElement: select(self.threshold),
+                hoveredElement: select(this),
+                datum: select(this).datum(),
             });
         });
     };

package/components/essentials/threshold.js.map

@@ -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 {\n\tAxisPositions,\n\tEvents,\n\tScaleTypes,\n\tCartesianOrientations,\n} 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.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 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\tconst { cartesianScales } = this.services;\n\t\tconst orientation = cartesianScales.getOrientation();\n\t\tconst getDomainValue = (d) => cartesianScales.getDomainValue(d);\n\t\tconst getRangeValue = (d) => cartesianScales.getRangeValue(d);\n\t\tconst [\n\t\t\tgetXValue,\n\t\t\tgetYValue,\n\t\t] = Tools.flipDomainAndRangeBasedOnOrientation(\n\t\t\tgetDomainValue,\n\t\t\tgetRangeValue,\n\t\t\torientation\n\t\t);\n\n\t\tif (\n\t\t\taxisPosition === AxisPositions.TOP ||\n\t\t\taxisPosition === AxisPositions.BOTTOM\n\t\t) {\n\t\t\tconst position =\n\t\t\t\tgetXValue(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);\n\t\t\t// Position the threshold on the x scale value\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(${position}, ${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\n\t\t\t\t.attr('width', Math.abs(yScaleEnd - yScaleStart))\n\t\t\t\t.classed('rotate', true);\n\t\t} else {\n\t\t\tconst position =\n\t\t\t\tgetYValue(value) + (isScaleTypeLabels ? scale.step() / 2 : 0);\n\t\t\t// Position the threshold on the y scale value\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}, ${position})`);\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', Math.abs(xScaleEnd - xScaleStart));\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.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(\n\t\t\t\tvalue,\n\t\t\t\t0,\n\t\t\t\tscale.ticks(),\n\t\t\t\ttimeInterval,\n\t\t\t\ttimeScaleOptions\n\t\t\t);\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"]}
+{"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\tlabel: any;\n\n\tpositionService = new Position();\n\n\tconstructor(model: ChartModel, services: any) {\n\t\tsuper(model, services);\n\t}\n\n\trender(animate = false) {\n\t\tconst axesOptions = Tools.getProperty(this.getOptions(), 'axes');\n\n\t\tconst thresholdData = [];\n\n\t\tObject.keys(axesOptions).forEach((axisPosition) => {\n\t\t\tif (Object.values(AxisPositions).includes(axisPosition as any)) {\n\t\t\t\tconst axisOptions = axesOptions[axisPosition];\n\n\t\t\t\tif (\n\t\t\t\t\taxisOptions.thresholds &&\n\t\t\t\t\taxisOptions.thresholds.length > 0\n\t\t\t\t) {\n\t\t\t\t\tthresholdData.push({\n\t\t\t\t\t\taxisPosition,\n\t\t\t\t\t\tthresholds: axisOptions.thresholds,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\n\t\t// Grab container SVG\n\t\tconst svg = this.getContainerSVG({ withinChartClip: true });\n\n\t\t// Update data on all axis threshold groups\n\t\tconst thresholdAxisGroups = svg\n\t\t\t.selectAll('g.axis-thresholds')\n\t\t\t.data(thresholdData, (thresholdData) => thresholdData.axisPosition);\n\n\t\t// Remove axis threshold groups that are no longer needed\n\t\tthresholdAxisGroups.exit().attr('opacity', 0).remove();\n\n\t\t// Add the axis threshold groups that need to be introduced\n\t\tconst thresholdAxisGroupsEnter = thresholdAxisGroups\n\t\t\t.enter()\n\t\t\t.append('g');\n\n\t\tconst thresholdAxisGroupsMerge = thresholdAxisGroupsEnter.merge(\n\t\t\tthresholdAxisGroups\n\t\t);\n\t\tthresholdAxisGroupsMerge.attr(\n\t\t\t'class',\n\t\t\t(d) => `axis-thresholds ${d.axisPosition}`\n\t\t);\n\n\t\tconst thresholdGroups = thresholdAxisGroupsMerge\n\t\t\t.selectAll('g.threshold-group')\n\t\t\t.data((d) =>\n\t\t\t\td.thresholds.map((threshold) => {\n\t\t\t\t\tthreshold.axisPosition = d.axisPosition;\n\t\t\t\t\treturn threshold;\n\t\t\t\t})\n\t\t\t);\n\n\t\t// Remove threshold groups that are no longer needed\n\t\tthresholdGroups.exit().attr('opacity', 0).remove();\n\n\t\t// Add the threshold groups that need to be introduced\n\t\tconst thresholdGroupsEnter = thresholdGroups.enter().append('g');\n\n\t\tthresholdGroupsEnter.append('line').attr('class', 'threshold-line');\n\t\tthresholdGroupsEnter\n\t\t\t.append('rect')\n\t\t\t.attr('class', 'threshold-hoverable-area');\n\n\t\tconst thresholdGroupsMerge = thresholdGroupsEnter.merge(\n\t\t\tthresholdGroups\n\t\t);\n\t\tthresholdGroupsMerge.attr('class', 'threshold-group');\n\n\t\tconst self = this;\n\t\tthresholdAxisGroupsMerge.each(function ({ axisPosition }) {\n\t\t\tconst scale = self.services.cartesianScales.getScaleByPosition(\n\t\t\t\taxisPosition\n\t\t\t);\n\t\t\tconst scaleType = self.services.cartesianScales.getScaleTypeByPosition(\n\t\t\t\taxisPosition\n\t\t\t);\n\t\t\tconst mainXScale = self.services.cartesianScales.getMainXScale();\n\t\t\tconst mainYScale = self.services.cartesianScales.getMainYScale();\n\t\t\tconst isScaleTypeLabels = scaleType === ScaleTypes.LABELS;\n\t\t\tconst [xScaleStart, xScaleEnd] = mainXScale.range();\n\t\t\tconst [yScaleEnd, yScaleStart] = mainYScale.range();\n\n\t\t\tconst { cartesianScales } = self.services;\n\t\t\tconst orientation = cartesianScales.getOrientation();\n\t\t\tconst getDomainValue = (d) => cartesianScales.getDomainValue(d);\n\t\t\tconst getRangeValue = (d) => cartesianScales.getRangeValue(d);\n\t\t\tconst [\n\t\t\t\tgetXValue,\n\t\t\t\tgetYValue,\n\t\t\t] = Tools.flipDomainAndRangeBasedOnOrientation(\n\t\t\t\tgetDomainValue,\n\t\t\t\tgetRangeValue,\n\t\t\t\torientation\n\t\t\t);\n\n\t\t\tconst group = select(this);\n\t\t\tif (\n\t\t\t\taxisPosition === AxisPositions.TOP ||\n\t\t\t\taxisPosition === AxisPositions.BOTTOM\n\t\t\t) {\n\t\t\t\tgroup\n\t\t\t\t\t.selectAll('line.threshold-line')\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t'threshold-line-update',\n\t\t\t\t\t\t\tanimate\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr('y1', yScaleStart)\n\t\t\t\t\t.attr('y2', yScaleEnd)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t'x1',\n\t\t\t\t\t\t({ value }) =>\n\t\t\t\t\t\t\tgetXValue(value) +\n\t\t\t\t\t\t\t(isScaleTypeLabels ? scale.step() / 2 : 0)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t'x2',\n\t\t\t\t\t\t({ value }) =>\n\t\t\t\t\t\t\tgetXValue(value) +\n\t\t\t\t\t\t\t(isScaleTypeLabels ? scale.step() / 2 : 0)\n\t\t\t\t\t)\n\t\t\t\t\t.style('stroke', ({ fillColor }) => fillColor);\n\n\t\t\t\t// Set hoverable area width and rotate it\n\t\t\t\tgroup\n\t\t\t\t\t.selectAll('rect.threshold-hoverable-area')\n\t\t\t\t\t.attr('x', 0)\n\t\t\t\t\t.attr('y', ({ value }) => -getXValue(value))\n\t\t\t\t\t.attr('width', Math.abs(yScaleEnd - yScaleStart))\n\t\t\t\t\t.classed('rotate', true);\n\t\t\t} else {\n\t\t\t\tgroup\n\t\t\t\t\t.selectAll('line.threshold-line')\n\t\t\t\t\t.transition(\n\t\t\t\t\t\tself.services.transitions.getTransition(\n\t\t\t\t\t\t\t'threshold-line-update',\n\t\t\t\t\t\t\tanimate\n\t\t\t\t\t\t)\n\t\t\t\t\t)\n\t\t\t\t\t.attr('x1', xScaleStart)\n\t\t\t\t\t.attr('x2', xScaleEnd)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t'y1',\n\t\t\t\t\t\t({ value }) =>\n\t\t\t\t\t\t\tgetYValue(value) +\n\t\t\t\t\t\t\t(isScaleTypeLabels ? scale.step() / 2 : 0)\n\t\t\t\t\t)\n\t\t\t\t\t.attr(\n\t\t\t\t\t\t'y2',\n\t\t\t\t\t\t({ value }) =>\n\t\t\t\t\t\t\tgetYValue(value) +\n\t\t\t\t\t\t\t(isScaleTypeLabels ? scale.step() / 2 : 0)\n\t\t\t\t\t)\n\t\t\t\t\t.style('stroke', ({ fillColor }) => fillColor);\n\n\t\t\t\t// Set hoverable area width\n\t\t\t\tgroup\n\t\t\t\t\t.selectAll('rect.threshold-hoverable-area')\n\t\t\t\t\t.attr('x', xScaleStart)\n\t\t\t\t\t.attr('y', ({ value }) => getYValue(value))\n\t\t\t\t\t.attr('width', Math.abs(xScaleEnd - xScaleStart))\n\t\t\t\t\t.classed('rotate', false);\n\t\t\t}\n\t\t});\n\n\t\t// Add event listener for showing the threshold tooltip\n\t\tthis.services.events.addEventListener(Events.Threshold.SHOW, (e) => {\n\t\t\tthis.setThresholdLabelPosition(e.detail.datum);\n\n\t\t\tthis.label.classed('hidden', false);\n\t\t});\n\n\t\t// Add event listener for hiding the threshold tooltip\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(datum) {\n\t\tconst { value, axisPosition } = datum;\n\t\tconst options = this.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(\n\t\t\t\tvalue,\n\t\t\t\t0,\n\t\t\t\tscale.ticks(),\n\t\t\t\ttimeInterval,\n\t\t\t\ttimeScaleOptions\n\t\t\t);\n\t\t}\n\n\t\treturn value.toLocaleString('en');\n\t}\n\n\tappendThresholdLabel() {\n\t\tconst holder = select(this.services.domUtils.getHolder());\n\n\t\tconst chartprefix = Tools.getProperty(\n\t\t\tthis.getOptions(),\n\t\t\t'style',\n\t\t\t'prefix'\n\t\t);\n\n\t\tthis.label = DOMUtils.appendOrSelect(\n\t\t\tholder,\n\t\t\t`div.${settings.prefix}--${chartprefix}--threshold--label`\n\t\t).classed('hidden', true);\n\t}\n\n\tsetThresholdLabelPosition(datum) {\n\t\tconst holder = this.services.domUtils.getHolder();\n\t\tconst mouseRelativePos = mouse(holder);\n\n\t\t// Format the threshold value using valueFormatter if defined in user-provided options\n\t\tconst formattedValue = datum.valueFormatter\n\t\t\t? datum.valueFormatter(datum.value)\n\t\t\t: this.getFormattedValue(datum);\n\n\t\tthis.label\n\t\t\t.html(`${datum.label || 'Threshold'}: ${formattedValue}`)\n\t\t\t.style('background-color', datum.fillColor);\n\n\t\tconst target = this.label.node();\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// Grab container SVG\n\t\tconst svg = this.getContainerSVG({ withinChartClip: true });\n\n\t\t// Add events to the threshold hoverable area\n\t\tsvg.selectAll('rect.threshold-hoverable-area')\n\t\t\t.on('mouseover mousemove', function () {\n\t\t\t\tselect(this.parentNode)\n\t\t\t\t\t.select('line.threshold-line')\n\t\t\t\t\t.classed('active', true);\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Threshold.SHOW, {\n\t\t\t\t\thoveredElement: select(this),\n\t\t\t\t\tdatum: select(this).datum(),\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('mouseout', function () {\n\t\t\t\tselect(this.parentNode)\n\t\t\t\t\t.select('line.threshold-line')\n\t\t\t\t\t.classed('active', false);\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Threshold.HIDE, {\n\t\t\t\t\thoveredElement: select(this),\n\t\t\t\t\tdatum: select(this).datum(),\n\t\t\t\t});\n\t\t\t});\n\t}\n}\n"]}

package/components/graphs/area-stacked.d.ts

@@ -5,6 +5,6 @@ export declare class StackedArea extends Component {
     init(): void;
     render(animate?: boolean): void;
     handleLegendOnHover: (event: CustomEvent<any>) => void;
-    handleLegendMouseOut: (event: CustomEvent<any>) => void;
+    handleLegendMouseOut: () => void;
     destroy(): void;
 }

package/components/graphs/area-stacked.js

@@ -13,6 +13,7 @@ var __extends = (this && this.__extends) || (function () {
 })();
 // Internal Imports
 import { Component } from '../component';
+import { Tools } from '../../tools';
 import * as Configuration from '../../configuration';
 import { Roles, Events, ColorClassNameTypes, } from '../../interfaces';
 // D3 Imports
@@ -36,7 +37,7 @@ var StackedArea = /** @class */ (function (_super) {
                 return Configuration.area.opacity.selected;
             });
         };
-        _this.handleLegendMouseOut = function (event) {
+        _this.handleLegendMouseOut = function () {
             _this.parent
                 .selectAll('path.area')
                 .transition(_this.services.transitions.getTransition('legend-mouseout-area'))
@@ -63,10 +64,11 @@ var StackedArea = /** @class */ (function (_super) {
             percentage: percentage,
             groups: this.configs.groups,
         });
+        var firstDatum = Tools.getProperty(stackedData, 0, 0);
         // area doesnt have to use the main range and domain axes - they can be mapped to the secondary (in the case of a combo chart)
         // however area _cannot_ have multiple datasets that are mapped to _different_ ranges and domains so we can use the first data item
-        var domainAxisPosition = this.services.cartesianScales.getDomainAxisPosition({ datum: stackedData[0][0] });
-        var rangeAxisPosition = this.services.cartesianScales.getRangeAxisPosition({ datum: stackedData[0][0] });
+        var domainAxisPosition = this.services.cartesianScales.getDomainAxisPosition({ firstDatum: firstDatum });
+        var rangeAxisPosition = this.services.cartesianScales.getRangeAxisPosition({ firstDatum: firstDatum });
         var mainYScale = this.services.cartesianScales.getScaleByPosition(rangeAxisPosition);
         var areas = svg
             .selectAll('path.area')

package/components/graphs/area-stacked.js.map

@@ -1 +1 @@
-{"version":3,"file":"area-stacked.js","sourceRoot":"","sources":["area-stacked.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Component } from '../component';\nimport * as Configuration from '../../configuration';\nimport {\n\tRoles,\n\tScaleTypes,\n\tEvents,\n\tColorClassNameTypes,\n\tCartesianOrientations,\n} from '../../interfaces';\n\n// D3 Imports\nimport { area } from 'd3-shape';\n\nexport class StackedArea extends Component {\n\ttype = 'area-stacked';\n\n\tareaGenerator: any;\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct area on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight area on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate = true) {\n\t\tconst svg = this.getContainerSVG({ withinChartClip: true });\n\t\tconst self = this;\n\t\tconst options = this.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tconst percentage = Object.keys(options.axes).some(\n\t\t\t(axis) => options.axes[axis].percentage\n\t\t);\n\n\t\tconst stackedData = this.model.getStackedData({\n\t\t\tpercentage,\n\t\t\tgroups: this.configs.groups,\n\t\t});\n\n\t\t// area doesnt have to use the main range and domain axes - they can be mapped to the secondary (in the case of a combo chart)\n\t\t// however area _cannot_ have multiple datasets that are mapped to _different_ ranges and domains so we can use the first data item\n\t\tconst domainAxisPosition = this.services.cartesianScales.getDomainAxisPosition(\n\t\t\t{ datum: stackedData[0][0] }\n\t\t);\n\t\tconst rangeAxisPosition = this.services.cartesianScales.getRangeAxisPosition(\n\t\t\t{ datum: stackedData[0][0] }\n\t\t);\n\t\tconst mainYScale = this.services.cartesianScales.getScaleByPosition(\n\t\t\trangeAxisPosition\n\t\t);\n\n\t\tconst areas = svg\n\t\t\t.selectAll('path.area')\n\t\t\t.data(stackedData, (d) => d[0][groupMapsTo]);\n\n\t\t// D3 area generator function\n\t\tthis.areaGenerator = area()\n\t\t\t.x((d: any, i) =>\n\t\t\t\tthis.services.cartesianScales.getValueThroughAxisPosition(\n\t\t\t\t\tdomainAxisPosition,\n\t\t\t\t\td.data.sharedStackKey,\n\t\t\t\t\ti\n\t\t\t\t)\n\t\t\t)\n\t\t\t.y0((d) => mainYScale(d[0]))\n\t\t\t.y1((d) => mainYScale(d[1]))\n\t\t\t.curve(this.services.curves.getD3Curve());\n\n\t\tareas.exit().attr('opacity', 0).remove();\n\n\t\tconst enteringAreas = areas.enter().append('path').attr('opacity', 0);\n\n\t\tenteringAreas\n\t\t\t.merge(areas)\n\t\t\t.data(stackedData, (d) => d[0][groupMapsTo])\n\t\t\t.attr('class', 'area')\n\t\t\t.attr('class', (d) =>\n\t\t\t\tthis.model.getColorClassName({\n\t\t\t\t\tclassNameTypes: [ColorClassNameTypes.FILL],\n\t\t\t\t\tdataGroupName: d[0][groupMapsTo],\n\t\t\t\t\toriginalClassName: 'area',\n\t\t\t\t})\n\t\t\t)\n\t\t\t.style('fill', (d) => self.model.getFillColor(d[0][groupMapsTo]))\n\t\t\t.attr('role', Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr('aria-roledescription', 'area')\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t'area-update-enter',\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr('opacity', Configuration.area.opacity.selected)\n\t\t\t.attr('d', this.areaGenerator);\n\t}\n\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\t\tconst options = this.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tthis.parent\n\t\t\t.selectAll('path.area')\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition('legend-hover-area')\n\t\t\t)\n\t\t\t.attr('opacity', (d) => {\n\t\t\t\tif (d[0][groupMapsTo] !== hoveredElement.datum().name) {\n\t\t\t\t\treturn Configuration.area.opacity.unselected;\n\t\t\t\t}\n\n\t\t\t\treturn Configuration.area.opacity.selected;\n\t\t\t});\n\t};\n\n\thandleLegendMouseOut = (event: CustomEvent) => {\n\t\tthis.parent\n\t\t\t.selectAll('path.area')\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition('legend-mouseout-area')\n\t\t\t)\n\t\t\t.attr('opacity', Configuration.area.opacity.selected);\n\t};\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll('path.area')\n\t\t\t.on('mouseover', null)\n\t\t\t.on('mousemove', null)\n\t\t\t.on('mouseout', null);\n\t}\n}\n"]}
+{"version":3,"file":"area-stacked.js","sourceRoot":"","sources":["area-stacked.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,KAAK,aAAa,MAAM,qBAAqB,CAAC;AACrD,OAAO,EACN,KAAK,EAEL,MAAM,EACN,mBAAmB,GAEnB,MAAM,kBAAkB,CAAC;AAE1B,aAAa;AACb,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC;IAAiC,+BAAS;IAA1C;QAAA,qEAmIC;QAlIA,UAAI,GAAG,cAAc,CAAC;QA8FtB,yBAAmB,GAAG,UAAC,KAAkB;YAChC,IAAA,4CAAc,CAAkB;YACxC,IAAM,OAAO,GAAG,KAAI,CAAC,UAAU,EAAE,CAAC;YAC1B,IAAA,sCAAW,CAAkB;YAErC,KAAI,CAAC,MAAM;iBACT,SAAS,CAAC,WAAW,CAAC;iBACtB,UAAU,CACV,KAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAC5D;iBACA,IAAI,CAAC,SAAS,EAAE,UAAC,CAAC;gBAClB,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,KAAK,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE;oBACtD,OAAO,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;iBAC7C;gBAED,OAAO,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC;YAC5C,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;QAEF,0BAAoB,GAAG;YACtB,KAAI,CAAC,MAAM;iBACT,SAAS,CAAC,WAAW,CAAC;iBACtB,UAAU,CACV,KAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,aAAa,CAAC,sBAAsB,CAAC,CAC/D;iBACA,IAAI,CAAC,SAAS,EAAE,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;QACxD,CAAC,CAAC;;IAUH,CAAC;IA9HA,0BAAI,GAAJ;QACC,IAAM,cAAc,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;QAE5C,+CAA+C;QAC/C,cAAc,CAAC,gBAAgB,CAC9B,MAAM,CAAC,MAAM,CAAC,UAAU,EACxB,IAAI,CAAC,mBAAmB,CACxB,CAAC;QAEF,6CAA6C;QAC7C,cAAc,CAAC,gBAAgB,CAC9B,MAAM,CAAC,MAAM,CAAC,aAAa,EAC3B,IAAI,CAAC,oBAAoB,CACzB,CAAC;IACH,CAAC;IAED,4BAAM,GAAN,UAAO,OAAc;QAArB,iBAwEC;QAxEM,wBAAA,EAAA,cAAc;QACpB,IAAM,GAAG,GAAG,IAAI,CAAC,eAAe,CAAC,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC,CAAC;QAC5D,IAAM,IAAI,GAAG,IAAI,CAAC;QAClB,IAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAC1B,IAAA,sCAAW,CAAkB;QAErC,IAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,CAChD,UAAC,IAAI,IAAK,OAAA,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,UAAU,EAA7B,CAA6B,CACvC,CAAC;QAEF,IAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;YAC7C,UAAU,YAAA;YACV,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,MAAM;SAC3B,CAAC,CAAC;QAEH,IAAM,UAAU,GAAG,KAAK,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QAExD,8HAA8H;QAC9H,mIAAmI;QACnI,IAAM,kBAAkB,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,qBAAqB,CAC7E,EAAE,UAAU,YAAA,EAAE,CACd,CAAC;QACF,IAAM,iBAAiB,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,oBAAoB,CAC3E,EAAE,UAAU,YAAA,EAAE,CACd,CAAC;QACF,IAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,kBAAkB,CAClE,iBAAiB,CACjB,CAAC;QAEF,IAAM,KAAK,GAAG,GAAG;aACf,SAAS,CAAC,WAAW,CAAC;aACtB,IAAI,CAAC,WAAW,EAAE,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,EAAjB,CAAiB,CAAC,CAAC;QAE9C,6BAA6B;QAC7B,IAAI,CAAC,aAAa,GAAG,IAAI,EAAE;aACzB,CAAC,CAAC,UAAC,CAAM,EAAE,CAAC;YACZ,OAAA,KAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,2BAA2B,CACxD,kBAAkB,EAClB,CAAC,CAAC,IAAI,CAAC,cAAc,EACrB,CAAC,CACD;QAJD,CAIC,CACD;aACA,EAAE,CAAC,UAAC,CAAC,IAAK,OAAA,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAhB,CAAgB,CAAC;aAC3B,EAAE,CAAC,UAAC,CAAC,IAAK,OAAA,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAhB,CAAgB,CAAC;aAC3B,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC;QAE3C,KAAK,CAAC,IAAI,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,MAAM,EAAE,CAAC;QAEzC,IAAM,aAAa,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC;QAEtE,aAAa;aACX,KAAK,CAAC,KAAK,CAAC;aACZ,IAAI,CAAC,WAAW,EAAE,UAAC,CAAC,IAAK,OAAA,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,EAAjB,CAAiB,CAAC;aAC3C,IAAI,CAAC,OAAO,EAAE,MAAM,CAAC;aACrB,IAAI,CAAC,OAAO,EAAE,UAAC,CAAC;YAChB,OAAA,KAAI,CAAC,KAAK,CAAC,iBAAiB,CAAC;gBAC5B,cAAc,EAAE,CAAC,mBAAmB,CAAC,IAAI,CAAC;gBAC1C,aAAa,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC;gBAChC,iBAAiB,EAAE,MAAM;aACzB,CAAC;QAJF,CAIE,CACF;aACA,KAAK,CAAC,MAAM,EAAE,UAAC,CAAC,IAAK,OAAA,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,EAA1C,CAA0C,CAAC;aAChE,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,eAAe,CAAC;aACnC,IAAI,CAAC,sBAAsB,EAAE,MAAM,CAAC;aACpC,UAAU,CACV,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,aAAa,CACtC,mBAAmB,EACnB,OAAO,CACP,CACD;aACA,IAAI,CAAC,SAAS,EAAE,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC;aACpD,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACjC,CAAC;IA8BD,6BAAO,GAAP;QACC,yBAAyB;QACzB,IAAI,CAAC,MAAM;aACT,SAAS,CAAC,WAAW,CAAC;aACtB,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC;aACrB,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC;aACrB,EAAE,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;IACxB,CAAC;IACF,kBAAC;AAAD,CAAC,AAnID,CAAiC,SAAS,GAmIzC","sourcesContent":["// Internal Imports\nimport { Component } from '../component';\nimport { Tools } from '../../tools';\nimport * as Configuration from '../../configuration';\nimport {\n\tRoles,\n\tScaleTypes,\n\tEvents,\n\tColorClassNameTypes,\n\tCartesianOrientations,\n} from '../../interfaces';\n\n// D3 Imports\nimport { area } from 'd3-shape';\n\nexport class StackedArea extends Component {\n\ttype = 'area-stacked';\n\n\tareaGenerator: any;\n\n\tinit() {\n\t\tconst eventsFragment = this.services.events;\n\n\t\t// Highlight correct area on legend item hovers\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_HOVER,\n\t\t\tthis.handleLegendOnHover\n\t\t);\n\n\t\t// Un-highlight area on legend item mouseouts\n\t\teventsFragment.addEventListener(\n\t\t\tEvents.Legend.ITEM_MOUSEOUT,\n\t\t\tthis.handleLegendMouseOut\n\t\t);\n\t}\n\n\trender(animate = true) {\n\t\tconst svg = this.getContainerSVG({ withinChartClip: true });\n\t\tconst self = this;\n\t\tconst options = this.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tconst percentage = Object.keys(options.axes).some(\n\t\t\t(axis) => options.axes[axis].percentage\n\t\t);\n\n\t\tconst stackedData = this.model.getStackedData({\n\t\t\tpercentage,\n\t\t\tgroups: this.configs.groups,\n\t\t});\n\n\t\tconst firstDatum = Tools.getProperty(stackedData, 0, 0);\n\n\t\t// area doesnt have to use the main range and domain axes - they can be mapped to the secondary (in the case of a combo chart)\n\t\t// however area _cannot_ have multiple datasets that are mapped to _different_ ranges and domains so we can use the first data item\n\t\tconst domainAxisPosition = this.services.cartesianScales.getDomainAxisPosition(\n\t\t\t{ firstDatum }\n\t\t);\n\t\tconst rangeAxisPosition = this.services.cartesianScales.getRangeAxisPosition(\n\t\t\t{ firstDatum }\n\t\t);\n\t\tconst mainYScale = this.services.cartesianScales.getScaleByPosition(\n\t\t\trangeAxisPosition\n\t\t);\n\n\t\tconst areas = svg\n\t\t\t.selectAll('path.area')\n\t\t\t.data(stackedData, (d) => d[0][groupMapsTo]);\n\n\t\t// D3 area generator function\n\t\tthis.areaGenerator = area()\n\t\t\t.x((d: any, i) =>\n\t\t\t\tthis.services.cartesianScales.getValueThroughAxisPosition(\n\t\t\t\t\tdomainAxisPosition,\n\t\t\t\t\td.data.sharedStackKey,\n\t\t\t\t\ti\n\t\t\t\t)\n\t\t\t)\n\t\t\t.y0((d) => mainYScale(d[0]))\n\t\t\t.y1((d) => mainYScale(d[1]))\n\t\t\t.curve(this.services.curves.getD3Curve());\n\n\t\tareas.exit().attr('opacity', 0).remove();\n\n\t\tconst enteringAreas = areas.enter().append('path').attr('opacity', 0);\n\n\t\tenteringAreas\n\t\t\t.merge(areas)\n\t\t\t.data(stackedData, (d) => d[0][groupMapsTo])\n\t\t\t.attr('class', 'area')\n\t\t\t.attr('class', (d) =>\n\t\t\t\tthis.model.getColorClassName({\n\t\t\t\t\tclassNameTypes: [ColorClassNameTypes.FILL],\n\t\t\t\t\tdataGroupName: d[0][groupMapsTo],\n\t\t\t\t\toriginalClassName: 'area',\n\t\t\t\t})\n\t\t\t)\n\t\t\t.style('fill', (d) => self.model.getFillColor(d[0][groupMapsTo]))\n\t\t\t.attr('role', Roles.GRAPHICS_SYMBOL)\n\t\t\t.attr('aria-roledescription', 'area')\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition(\n\t\t\t\t\t'area-update-enter',\n\t\t\t\t\tanimate\n\t\t\t\t)\n\t\t\t)\n\t\t\t.attr('opacity', Configuration.area.opacity.selected)\n\t\t\t.attr('d', this.areaGenerator);\n\t}\n\n\thandleLegendOnHover = (event: CustomEvent) => {\n\t\tconst { hoveredElement } = event.detail;\n\t\tconst options = this.getOptions();\n\t\tconst { groupMapsTo } = options.data;\n\n\t\tthis.parent\n\t\t\t.selectAll('path.area')\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition('legend-hover-area')\n\t\t\t)\n\t\t\t.attr('opacity', (d) => {\n\t\t\t\tif (d[0][groupMapsTo] !== hoveredElement.datum().name) {\n\t\t\t\t\treturn Configuration.area.opacity.unselected;\n\t\t\t\t}\n\n\t\t\t\treturn Configuration.area.opacity.selected;\n\t\t\t});\n\t};\n\n\thandleLegendMouseOut = () => {\n\t\tthis.parent\n\t\t\t.selectAll('path.area')\n\t\t\t.transition(\n\t\t\t\tthis.services.transitions.getTransition('legend-mouseout-area')\n\t\t\t)\n\t\t\t.attr('opacity', Configuration.area.opacity.selected);\n\t};\n\n\tdestroy() {\n\t\t// Remove event listeners\n\t\tthis.parent\n\t\t\t.selectAll('path.area')\n\t\t\t.on('mouseover', null)\n\t\t\t.on('mousemove', null)\n\t\t\t.on('mouseout', null);\n\t}\n}\n"]}

package/components/graphs/boxplot.d.ts

@@ -0,0 +1,7 @@
+import { Component } from '../component';
+export declare class Boxplot extends Component {
+    type: string;
+    render(animate: boolean): void;
+    addBoxEventListeners(): void;
+    addCircleEventListeners(): void;
+}