@fluentui/react-charting 5.21.32 → 5.22.1
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.json +37 -1
- package/CHANGELOG.md +21 -2
- package/dist/react-charting.d.ts +152 -0
- package/dist/react-charting.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/etc/react-charting.api.md +60 -0
- package/lib/components/DonutChart/Arc/Arc.js +22 -5
- package/lib/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib/components/DonutChart/Arc/Arc.types.d.ts +15 -0
- package/lib/components/DonutChart/Arc/Arc.types.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.base.js +13 -4
- package/lib/components/DonutChart/DonutChart.base.js.map +1 -1
- package/lib/components/DonutChart/DonutChart.types.d.ts +10 -0
- package/lib/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib/components/DonutChart/Pie/Pie.js +8 -2
- package/lib/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib/components/DonutChart/Pie/Pie.types.d.ts +10 -0
- package/lib/components/DonutChart/Pie/Pie.types.js.map +1 -1
- package/lib/components/GaugeChart/GaugeChart.base.js +30 -6
- package/lib/components/GaugeChart/GaugeChart.base.js.map +1 -1
- package/lib/components/GaugeChart/GaugeChart.types.d.ts +14 -0
- package/lib/components/GaugeChart/GaugeChart.types.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +29 -6
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.d.ts +10 -0
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.base.js +26 -9
- package/lib/components/HorizontalBarChart/HorizontalBarChart.base.js.map +1 -1
- package/lib/components/HorizontalBarChart/HorizontalBarChart.types.d.ts +10 -0
- package/lib/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +75 -30
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.d.ts +10 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -1
- package/lib/components/StackedBarChart/MultiStackedBarChart.base.js +29 -10
- package/lib/components/StackedBarChart/MultiStackedBarChart.base.js.map +1 -1
- package/lib/components/StackedBarChart/MultiStackedBarChart.types.d.ts +10 -0
- package/lib/components/StackedBarChart/MultiStackedBarChart.types.js.map +1 -1
- package/lib/components/StackedBarChart/StackedBarChart.base.js +18 -7
- package/lib/components/StackedBarChart/StackedBarChart.base.js.map +1 -1
- package/lib/components/StackedBarChart/StackedBarChart.types.d.ts +10 -0
- package/lib/components/StackedBarChart/StackedBarChart.types.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.base.js +79 -14
- package/lib/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.types.d.ts +10 -0
- package/lib/components/VerticalBarChart/VerticalBarChart.types.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +32 -10
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.types.d.ts +10 -0
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib/index.d.ts +39 -20
- package/lib/index.js +20 -20
- package/lib/index.js.map +1 -1
- package/lib/types/IDataPoint.d.ts +25 -0
- package/lib/types/IDataPoint.js.map +1 -1
- package/lib/utilities/gradients.d.ts +30 -0
- package/lib/utilities/gradients.js +173 -0
- package/lib/utilities/gradients.js.map +1 -0
- package/lib/utilities/index.d.ts +1 -0
- package/lib/utilities/index.js +1 -0
- package/lib/utilities/index.js.map +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/lib-amd/components/DonutChart/Arc/Arc.js +21 -4
- package/lib-amd/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib-amd/components/DonutChart/Arc/Arc.types.d.ts +15 -0
- package/lib-amd/components/DonutChart/Arc/Arc.types.js.map +1 -1
- package/lib-amd/components/DonutChart/DonutChart.base.js +12 -3
- package/lib-amd/components/DonutChart/DonutChart.base.js.map +1 -1
- package/lib-amd/components/DonutChart/DonutChart.types.d.ts +10 -0
- package/lib-amd/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib-amd/components/DonutChart/Pie/Pie.js +7 -1
- package/lib-amd/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib-amd/components/DonutChart/Pie/Pie.types.d.ts +10 -0
- package/lib-amd/components/DonutChart/Pie/Pie.types.js.map +1 -1
- package/lib-amd/components/GaugeChart/GaugeChart.base.js +28 -4
- package/lib-amd/components/GaugeChart/GaugeChart.base.js.map +1 -1
- package/lib-amd/components/GaugeChart/GaugeChart.types.d.ts +14 -0
- package/lib-amd/components/GaugeChart/GaugeChart.types.js.map +1 -1
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +28 -5
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.d.ts +10 -0
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.js.map +1 -1
- package/lib-amd/components/HorizontalBarChart/HorizontalBarChart.base.js +25 -8
- package/lib-amd/components/HorizontalBarChart/HorizontalBarChart.base.js.map +1 -1
- package/lib-amd/components/HorizontalBarChart/HorizontalBarChart.types.d.ts +10 -0
- package/lib-amd/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +74 -29
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -1
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.d.ts +10 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -1
- package/lib-amd/components/StackedBarChart/MultiStackedBarChart.base.js +28 -9
- package/lib-amd/components/StackedBarChart/MultiStackedBarChart.base.js.map +1 -1
- package/lib-amd/components/StackedBarChart/MultiStackedBarChart.types.d.ts +10 -0
- package/lib-amd/components/StackedBarChart/MultiStackedBarChart.types.js.map +1 -1
- package/lib-amd/components/StackedBarChart/StackedBarChart.base.js +17 -6
- package/lib-amd/components/StackedBarChart/StackedBarChart.base.js.map +1 -1
- package/lib-amd/components/StackedBarChart/StackedBarChart.types.d.ts +10 -0
- package/lib-amd/components/StackedBarChart/StackedBarChart.types.js.map +1 -1
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js +78 -13
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.types.d.ts +10 -0
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.types.js.map +1 -1
- package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +31 -9
- package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
- package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.types.d.ts +10 -0
- package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib-amd/index.d.ts +39 -20
- package/lib-amd/index.js +36 -21
- package/lib-amd/index.js.map +1 -1
- package/lib-amd/types/IDataPoint.d.ts +25 -0
- package/lib-amd/types/IDataPoint.js.map +1 -1
- package/lib-amd/utilities/gradients.d.ts +30 -0
- package/lib-amd/utilities/gradients.js +180 -0
- package/lib-amd/utilities/gradients.js.map +1 -0
- package/lib-amd/utilities/index.d.ts +1 -0
- package/lib-amd/utilities/index.js +2 -1
- package/lib-amd/utilities/index.js.map +1 -1
- package/lib-amd/version.js +1 -1
- package/lib-amd/version.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.js +21 -4
- package/lib-commonjs/components/DonutChart/Arc/Arc.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Arc/Arc.types.d.ts +15 -0
- package/lib-commonjs/components/DonutChart/Arc/Arc.types.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.base.js +12 -3
- package/lib-commonjs/components/DonutChart/DonutChart.base.js.map +1 -1
- package/lib-commonjs/components/DonutChart/DonutChart.types.d.ts +10 -0
- package/lib-commonjs/components/DonutChart/DonutChart.types.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.js +7 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.js.map +1 -1
- package/lib-commonjs/components/DonutChart/Pie/Pie.types.d.ts +10 -0
- package/lib-commonjs/components/DonutChart/Pie/Pie.types.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.base.js +28 -4
- package/lib-commonjs/components/GaugeChart/GaugeChart.base.js.map +1 -1
- package/lib-commonjs/components/GaugeChart/GaugeChart.types.d.ts +14 -0
- package/lib-commonjs/components/GaugeChart/GaugeChart.types.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +28 -5
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.d.ts +10 -0
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.base.js +25 -8
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.base.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.types.d.ts +10 -0
- package/lib-commonjs/components/HorizontalBarChart/HorizontalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +74 -29
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.d.ts +10 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -1
- package/lib-commonjs/components/StackedBarChart/MultiStackedBarChart.base.js +28 -9
- package/lib-commonjs/components/StackedBarChart/MultiStackedBarChart.base.js.map +1 -1
- package/lib-commonjs/components/StackedBarChart/MultiStackedBarChart.types.d.ts +10 -0
- package/lib-commonjs/components/StackedBarChart/MultiStackedBarChart.types.js.map +1 -1
- package/lib-commonjs/components/StackedBarChart/StackedBarChart.base.js +17 -6
- package/lib-commonjs/components/StackedBarChart/StackedBarChart.base.js.map +1 -1
- package/lib-commonjs/components/StackedBarChart/StackedBarChart.types.d.ts +10 -0
- package/lib-commonjs/components/StackedBarChart/StackedBarChart.types.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js +78 -13
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.types.d.ts +10 -0
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.types.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +31 -9
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.types.d.ts +10 -0
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.types.js.map +1 -1
- package/lib-commonjs/index.d.ts +39 -20
- package/lib-commonjs/index.js +55 -21
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/types/IDataPoint.d.ts +25 -0
- package/lib-commonjs/types/IDataPoint.js.map +1 -1
- package/lib-commonjs/utilities/gradients.d.ts +30 -0
- package/lib-commonjs/utilities/gradients.js +178 -0
- package/lib-commonjs/utilities/gradients.js.map +1 -0
- package/lib-commonjs/utilities/index.d.ts +1 -0
- package/lib-commonjs/utilities/index.js +1 -0
- package/lib-commonjs/utilities/index.js.map +1 -1
- package/lib-commonjs/version.js +1 -1
- package/lib-commonjs/version.js.map +1 -1
- package/package.json +3 -3
- package/src/components/DonutChart/Arc/Arc.types.ts +18 -0
- package/src/components/DonutChart/DonutChart.types.ts +12 -0
- package/src/components/DonutChart/Pie/Pie.types.ts +12 -0
- package/src/components/GaugeChart/GaugeChart.types.ts +17 -0
- package/src/components/HorizontalBarChart/HorizontalBarChart.types.ts +12 -0
- package/src/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.ts +12 -0
- package/src/components/StackedBarChart/MultiStackedBarChart.types.ts +12 -0
- package/src/components/StackedBarChart/StackedBarChart.types.ts +12 -0
- package/src/components/VerticalBarChart/VerticalBarChart.types.ts +12 -0
- package/src/components/VerticalStackedBarChart/VerticalStackedBarChart.types.ts +12 -0
|
@@ -6,7 +6,7 @@ import { MultiStackedBarChartVariant, } from './index';
|
|
|
6
6
|
import { Callout, DirectionalHint } from '@fluentui/react/lib/Callout';
|
|
7
7
|
import { FocusZone, FocusZoneDirection } from '@fluentui/react-focus';
|
|
8
8
|
import { convertToLocaleString } from '../../utilities/locale-util';
|
|
9
|
-
import { ChartHoverCard, formatValueWithSIPrefix, getAccessibleDataObject } from '../../utilities/index';
|
|
9
|
+
import { ChartHoverCard, formatValueWithSIPrefix, getAccessibleDataObject, getNextGradient, } from '../../utilities/index';
|
|
10
10
|
import { FocusableTooltipText } from '../../utilities/FocusableTooltipText';
|
|
11
11
|
var getClassNames = classNamesFunction();
|
|
12
12
|
export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
@@ -33,8 +33,12 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
33
33
|
if (validChartData.length < 3) {
|
|
34
34
|
var hideNumber = hideRatio[index] === undefined ? false : hideRatio[index];
|
|
35
35
|
if (hideNumber) {
|
|
36
|
-
validChartData.forEach(function (point) {
|
|
36
|
+
validChartData.forEach(function (point, pointIndex) {
|
|
37
|
+
var _a, _b;
|
|
37
38
|
var color = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];
|
|
39
|
+
if (_this.props.enableGradient) {
|
|
40
|
+
color = ((_a = point.gradient) === null || _a === void 0 ? void 0 : _a[0]) || getNextGradient(pointIndex, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted)[0];
|
|
41
|
+
}
|
|
38
42
|
var checkSimilarLegends = actions.filter(function (leg) { return leg.title === point.legend && leg.color === color; });
|
|
39
43
|
if (checkSimilarLegends.length > 0) {
|
|
40
44
|
return;
|
|
@@ -58,8 +62,12 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
58
62
|
}
|
|
59
63
|
}
|
|
60
64
|
else {
|
|
61
|
-
validChartData.forEach(function (point) {
|
|
65
|
+
validChartData.forEach(function (point, pointIndex) {
|
|
66
|
+
var _a, _b;
|
|
62
67
|
var color = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];
|
|
68
|
+
if (_this.props.enableGradient) {
|
|
69
|
+
color = ((_a = point.gradient) === null || _a === void 0 ? void 0 : _a[0]) || getNextGradient(pointIndex, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted)[0];
|
|
70
|
+
}
|
|
63
71
|
var checkSimilarLegends = actions.filter(function (leg) { return leg.title === point.legend && leg.color === color; });
|
|
64
72
|
if (checkSimilarLegends.length > 0) {
|
|
65
73
|
return;
|
|
@@ -248,11 +256,17 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
248
256
|
var prevPosition = 0;
|
|
249
257
|
var value = 0;
|
|
250
258
|
var bars = data.chartData.map(function (point, index) {
|
|
251
|
-
var
|
|
259
|
+
var _a, _b, _c, _d;
|
|
260
|
+
var startColor = point.color
|
|
252
261
|
? point.color
|
|
253
262
|
: point.placeHolder
|
|
254
263
|
? palette.neutralLight
|
|
255
264
|
: defaultPalette[Math.floor(Math.random() * 4 + 1)];
|
|
265
|
+
var endColor = startColor;
|
|
266
|
+
if (_this.props.enableGradient) {
|
|
267
|
+
startColor = ((_a = point.gradient) === null || _a === void 0 ? void 0 : _a[0]) || getNextGradient(index, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted)[0];
|
|
268
|
+
endColor = ((_c = point.gradient) === null || _c === void 0 ? void 0 : _c[1]) || getNextGradient(index, 0, (_d = _this.props.theme) === null || _d === void 0 ? void 0 : _d.isInverted)[1];
|
|
269
|
+
}
|
|
256
270
|
var pointData = point.data ? point.data : 0;
|
|
257
271
|
if (index > 0) {
|
|
258
272
|
prevPosition += value;
|
|
@@ -270,7 +284,7 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
270
284
|
startingPoint.push(prevPosition);
|
|
271
285
|
var styles = _this.props.styles;
|
|
272
286
|
var shouldHighlight = _this._legendHighlighted(point.legend) || _this._noLegendHighlighted() ? true : false;
|
|
273
|
-
var hoverCardYColor = point.placeHolder ? _this.props.theme.semanticColors.bodyText :
|
|
287
|
+
var hoverCardYColor = point.placeHolder ? _this.props.theme.semanticColors.bodyText : startColor;
|
|
274
288
|
_this._classNames = getClassNames(styles, {
|
|
275
289
|
theme: _this.props.theme,
|
|
276
290
|
shouldHighlight: shouldHighlight,
|
|
@@ -278,12 +292,17 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
278
292
|
variant: _this.props.variant,
|
|
279
293
|
hideLabels: _this.props.hideLabels,
|
|
280
294
|
});
|
|
295
|
+
var gradientId = getId('MSBC_Gradient') + "_".concat(barNo, "_").concat(index);
|
|
281
296
|
return (React.createElement("g", { key: index, className: point.placeHolder ? _this._classNames.placeHolderOnHover : _this._classNames.opacityChangeOnHover, ref: function (e) {
|
|
282
297
|
_this._refCallback(e, point.legend);
|
|
283
298
|
}, "data-is-focusable": !_this.props.hideTooltip && shouldHighlight, onFocus: _this._onBarFocus.bind(_this, pointData, hoverCardYColor, point), onBlur: _this._onBarLeave, role: "img", "aria-label": _this._getAriaLabel(point), onMouseOver: _this._onBarHover.bind(_this, pointData, hoverCardYColor, point), onMouseMove: _this._onBarHover.bind(_this, pointData, hoverCardYColor, point), onMouseLeave: _this._onBarLeave, onClick: href ? (point.placeHolder ? undefined : _this._redirectToUrl.bind(_this, href)) : point.onClick },
|
|
299
|
+
_this.props.enableGradient && (React.createElement("defs", null,
|
|
300
|
+
React.createElement("linearGradient", { id: gradientId },
|
|
301
|
+
React.createElement("stop", { offset: "0", stopColor: startColor }),
|
|
302
|
+
React.createElement("stop", { offset: "100%", stopColor: endColor })))),
|
|
284
303
|
React.createElement("rect", { key: index, id: "".concat(_this._barId, "-").concat(barNo, "-").concat(index), x: "".concat(_this._isRTL
|
|
285
304
|
? 100 - startingPoint[index] - value - _this.state.barSpacingInPercent * index
|
|
286
|
-
: startingPoint[index] + _this.state.barSpacingInPercent * index, "%"), y: 0, width: value + '%', height: barHeight, fill:
|
|
305
|
+
: startingPoint[index] + _this.state.barSpacingInPercent * index, "%"), y: 0, width: value + '%', height: barHeight, rx: _this.props.roundCorners ? 3 : 0, fill: _this.props.enableGradient ? "url(#".concat(gradientId, ")") : startColor })));
|
|
287
306
|
});
|
|
288
307
|
if (this.props.variant === MultiStackedBarChartVariant.AbsoluteScale && !this.props.hideLabels) {
|
|
289
308
|
var showLabel_1 = false;
|
|
@@ -310,11 +329,11 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
310
329
|
// Render placeholder bars only for part-to-whole variant
|
|
311
330
|
if (data.chartData.length === 0) {
|
|
312
331
|
bars.push(React.createElement("g", { key: 0, className: this._classNames.noData, onClick: this._redirectToUrl.bind(this, href) },
|
|
313
|
-
React.createElement("rect", { key: 0, id: this._barIdPlaceholderPartToWhole, x: '0%', y: 0, width: '100%', height: barHeight, fill: palette.neutralLight })));
|
|
332
|
+
React.createElement("rect", { key: 0, id: this._barIdPlaceholderPartToWhole, x: '0%', y: 0, width: '100%', height: barHeight, fill: palette.neutralLight, rx: this.props.roundCorners ? 3 : 0 })));
|
|
314
333
|
}
|
|
315
334
|
if (barTotalValue === 0) {
|
|
316
335
|
bars.push(React.createElement("g", { key: 'empty', className: this._classNames.noData, onClick: this._redirectToUrl.bind(this, href) },
|
|
317
|
-
React.createElement("rect", { key: 0, id: this._barIdEmpty, x: '0%', y: 0, width: '100%', height: barHeight, fill: palette.neutralLight })));
|
|
336
|
+
React.createElement("rect", { key: 0, id: this._barIdEmpty, x: '0%', y: 0, width: '100%', height: barHeight, fill: palette.neutralLight, rx: this.props.roundCorners ? 3 : 0 })));
|
|
318
337
|
}
|
|
319
338
|
}
|
|
320
339
|
var hideNumber = hideRatio === undefined ? false : hideRatio;
|
|
@@ -347,7 +366,7 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
347
366
|
color: color,
|
|
348
367
|
xCalloutValue: point.xAxisCalloutData,
|
|
349
368
|
yCalloutValue: point.yAxisCalloutData,
|
|
350
|
-
dataPointCalloutProps: point,
|
|
369
|
+
dataPointCalloutProps: __assign(__assign({}, point), { color: color }),
|
|
351
370
|
callOutAccessibilityData: point.callOutAccessibilityData,
|
|
352
371
|
});
|
|
353
372
|
}
|
|
@@ -391,7 +410,7 @@ export var MultiStackedBarChartBase = /** @class */ (function (_super) {
|
|
|
391
410
|
color: color,
|
|
392
411
|
xCalloutValue: point.xAxisCalloutData,
|
|
393
412
|
yCalloutValue: point.yAxisCalloutData,
|
|
394
|
-
dataPointCalloutProps: point,
|
|
413
|
+
dataPointCalloutProps: __assign(__assign({}, point), { color: color }),
|
|
395
414
|
callOutAccessibilityData: point.callOutAccessibilityData,
|
|
396
415
|
});
|
|
397
416
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStackedBarChart.base.js","sourceRoot":"../src/","sources":["components/StackedBarChart/MultiStackedBarChart.base.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNamesFunction, getId, getRTL } from '@fluentui/react/lib/Utilities';\nimport { IProcessedStyleSet, IPalette } from '@fluentui/react/lib/Styling';\nimport { ILegend, Legends } from '../Legends/index';\nimport {\n IAccessibilityProps,\n IChartDataPoint,\n IChartProps,\n IMultiStackedBarChartProps,\n IMultiStackedBarChartStyles,\n IMultiStackedBarChartStyleProps,\n MultiStackedBarChartVariant,\n} from './index';\nimport { Callout, DirectionalHint } from '@fluentui/react/lib/Callout';\nimport { FocusZone, FocusZoneDirection } from '@fluentui/react-focus';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport { ChartHoverCard, formatValueWithSIPrefix, getAccessibleDataObject } from '../../utilities/index';\nimport { FocusableTooltipText } from '../../utilities/FocusableTooltipText';\n\nconst getClassNames = classNamesFunction<IMultiStackedBarChartStyleProps, IMultiStackedBarChartStyles>();\n\nexport interface IRefArrayData {\n legendText?: string;\n refElement?: SVGGElement;\n}\n\nexport interface IMultiStackedBarChartState {\n isCalloutVisible: boolean;\n refArray: IRefArrayData[];\n selectedLegend: string;\n activeLegend: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n refSelected: any;\n dataForHoverCard: number;\n color: string;\n xCalloutValue?: string;\n yCalloutValue?: string;\n dataPointCalloutProps?: IChartDataPoint;\n callOutAccessibilityData?: IAccessibilityProps;\n calloutLegend: string;\n barSpacingInPercent: number;\n}\n\nexport class MultiStackedBarChartBase extends React.Component<IMultiStackedBarChartProps, IMultiStackedBarChartState> {\n public static defaultProps: Partial<IMultiStackedBarChartProps> = {\n barHeight: 12,\n hideRatio: [],\n hideDenominator: [],\n };\n\n private _classNames: IProcessedStyleSet<IMultiStackedBarChartStyles>;\n private _calloutId: string;\n private _calloutAnchorPoint: IChartDataPoint | null;\n private _longestBarTotalValue: number;\n private _isRTL: boolean = getRTL();\n private barChartSvgRef: React.RefObject<SVGSVGElement>;\n private _emptyChartId: string;\n private _barId: string;\n private _barIdPlaceholderPartToWhole: string;\n private _barIdEmpty: string;\n\n public constructor(props: IMultiStackedBarChartProps) {\n super(props);\n this.state = {\n isCalloutVisible: false,\n refArray: [],\n selectedLegend: '',\n activeLegend: '',\n refSelected: null,\n dataForHoverCard: 0,\n color: '',\n xCalloutValue: '',\n yCalloutValue: '',\n calloutLegend: '',\n barSpacingInPercent: 0,\n };\n this._onLeave = this._onLeave.bind(this);\n this._onBarLeave = this._onBarLeave.bind(this);\n this._calloutId = getId('callout');\n this.barChartSvgRef = React.createRef<SVGSVGElement>();\n this._emptyChartId = getId('_MSBC_empty');\n this._barId = getId('_MSBC_rect_');\n this._barIdPlaceholderPartToWhole = getId('_MSBC_rect_partToWhole_');\n this._barIdEmpty = getId('_MSBC_rect_empty');\n }\n\n public componentDidMount(): void {\n const svgWidth = this.barChartSvgRef.current?.getBoundingClientRect().width || 0;\n const MARGIN_WIDTH_IN_PX = 3;\n if (svgWidth) {\n const currentBarSpacing = (MARGIN_WIDTH_IN_PX / svgWidth) * 100;\n this.setState({ barSpacingInPercent: currentBarSpacing });\n }\n }\n\n public render(): JSX.Element {\n if (!this._isChartEmpty()) {\n const { data, theme, culture } = this.props;\n this._adjustProps();\n const { palette } = theme!;\n const legends = this._getLegendData(data!, this.props.hideRatio!, palette);\n const { isCalloutVisible } = this.state;\n\n this._classNames = getClassNames(this.props.styles!, {\n legendColor: this.state.color,\n theme: theme!,\n variant: this.props.variant,\n hideLabels: this.props.hideLabels,\n });\n\n const legendName = this.state.xCalloutValue ? this.state.xCalloutValue : this.state.calloutLegend;\n const calloutYVal = this.state.yCalloutValue ? this.state.yCalloutValue : this.state.dataForHoverCard;\n\n this._longestBarTotalValue = this._computeLongestBarTotalValue();\n const bars: JSX.Element[] = data!.map((singleChartData: IChartProps, index: number) => {\n const singleChartBars = this._createBarsAndLegends(\n singleChartData!,\n this.props.barHeight!,\n palette,\n this.props.hideRatio![index],\n this.props.hideDenominator![index],\n this.props.href,\n index,\n );\n return (\n <div key={index} id={`_MSBC_bar-${index}`}>\n {singleChartBars}\n </div>\n );\n });\n\n return (\n <div className={this._classNames.root} onMouseLeave={this._handleChartMouseLeave}>\n {bars}\n {!this.props.hideLegend && <div className={this._classNames.legendContainer}>{legends}</div>}\n <Callout\n gapSpace={15}\n isBeakVisible={false}\n target={this.state.refSelected}\n setInitialFocus={true}\n hidden={!(!this.props.hideTooltip && isCalloutVisible)}\n directionalHint={DirectionalHint.topAutoEdge}\n id={this._calloutId}\n onDismiss={this._closeCallout}\n preventDismissOnLostFocus={true}\n /** Keep the callout updated with details of focused/hovered bar */\n shouldUpdateWhenHidden={true}\n {...this.props.calloutProps!}\n {...getAccessibleDataObject(this.state.callOutAccessibilityData, 'text', false)}\n >\n <>\n {this.props.onRenderCalloutPerDataPoint ? (\n this.props.onRenderCalloutPerDataPoint(this.state.dataPointCalloutProps)\n ) : (\n <ChartHoverCard Legend={legendName} YValue={calloutYVal} color={this.state.color} culture={culture} />\n )}\n </>\n </Callout>\n </div>\n );\n }\n return (\n <div\n id={this._emptyChartId}\n role={'alert'}\n style={{ opacity: '0' }}\n aria-label={'Graph has no data to display'}\n />\n );\n }\n\n /**\n * The Create bar functions returns an array of <rect> elements, which form the bars\n * For each bar an x value, and a width needs to be specified\n * The computations are done based on percentages\n * Extra margin is also provided, in the x value to provide some spacing\n */\n\n private _createBarsAndLegends(\n data: IChartProps,\n barHeight: number,\n palette: IPalette,\n hideRatio: boolean,\n hideDenominator: boolean,\n href?: string,\n barNo?: number,\n ): JSX.Element {\n const noOfBars =\n data.chartData?.reduce((count: number, point: IChartDataPoint) => (count += (point.data || 0) > 0 ? 1 : 0), 0) ||\n 1;\n const totalMarginPercent = this.state.barSpacingInPercent * (noOfBars - 1);\n const { culture } = this.props;\n const defaultPalette: string[] = [palette.blueLight, palette.blue, palette.blueMid, palette.red, palette.black];\n // calculating starting point of each bar and it's range\n const startingPoint: number[] = [];\n const barTotalValue = data.chartData!.reduce(\n (acc: number, point: IChartDataPoint) => acc + (point.data ? point.data : 0),\n 0,\n );\n const total =\n this.props.variant === MultiStackedBarChartVariant.AbsoluteScale ? this._longestBarTotalValue : barTotalValue;\n\n let sumOfPercent = 0;\n data.chartData!.map((point: IChartDataPoint, index: number) => {\n const pointData = point.data ? point.data : 0;\n const currValue = (pointData / total) * 100;\n let value = currValue ? currValue : 0;\n\n if (value < 1 && value !== 0) {\n value = 1;\n } else if (value > 99 && value !== 100) {\n value = 99;\n }\n sumOfPercent += value;\n\n return sumOfPercent;\n });\n\n // Include an imaginary placeholder bar with value equal to\n // the difference between longestBarTotalValue and barTotalValue\n // while calculating sumOfPercent to get correct scalingRatio for absolute-scale variant\n if (this.props.variant === MultiStackedBarChartVariant.AbsoluteScale) {\n let value = total === 0 ? 0 : ((total - barTotalValue) / total) * 100;\n if (value < 1 && value !== 0) {\n value = 1;\n } else if (value > 99 && value !== 100) {\n value = 99;\n }\n sumOfPercent += value;\n }\n\n /**\n * The %age of the space occupied by the margin needs to subtracted\n * while computing the scaling ratio, since the margins are not being\n * scaled down, only the data is being scaled down from a higher percentage to lower percentage\n * Eg: 95% of the space is taken by the bars, 5% by the margins\n * Now if the sumOfPercent is 120% -> This needs to be scaled down to 95%, not 100%\n * since that's only space available to the bars\n */\n\n const scalingRatio = sumOfPercent !== 0 ? sumOfPercent / (100 - totalMarginPercent) : 1;\n\n let prevPosition = 0;\n let value = 0;\n\n const bars = data.chartData!.map((point: IChartDataPoint, index: number) => {\n const color: string = point.color\n ? point.color\n : point.placeHolder\n ? palette.neutralLight\n : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n const pointData = point.data ? point.data : 0;\n if (index > 0) {\n prevPosition += value;\n }\n value = (pointData / total) * 100 ? (pointData / total) * 100 : 0;\n if (value < 1 && value !== 0) {\n value = 1 / scalingRatio;\n } else if (value > 99 && value !== 100) {\n value = 99 / scalingRatio;\n } else {\n value = value / scalingRatio;\n }\n\n startingPoint.push(prevPosition);\n\n const styles = this.props.styles;\n const shouldHighlight = this._legendHighlighted(point.legend!) || this._noLegendHighlighted() ? true : false;\n const hoverCardYColor = point.placeHolder ? this.props.theme!.semanticColors.bodyText : color;\n\n this._classNames = getClassNames(styles!, {\n theme: this.props.theme!,\n shouldHighlight,\n href,\n variant: this.props.variant,\n hideLabels: this.props.hideLabels,\n });\n return (\n <g\n key={index}\n className={point.placeHolder ? this._classNames.placeHolderOnHover : this._classNames.opacityChangeOnHover}\n ref={(e: SVGGElement) => {\n this._refCallback(e, point.legend!);\n }}\n data-is-focusable={!this.props.hideTooltip && shouldHighlight}\n onFocus={this._onBarFocus.bind(this, pointData, hoverCardYColor, point)}\n onBlur={this._onBarLeave}\n role=\"img\"\n aria-label={this._getAriaLabel(point)}\n onMouseOver={this._onBarHover.bind(this, pointData, hoverCardYColor, point)}\n onMouseMove={this._onBarHover.bind(this, pointData, hoverCardYColor, point)}\n onMouseLeave={this._onBarLeave}\n onClick={href ? (point.placeHolder ? undefined : this._redirectToUrl.bind(this, href)) : point.onClick}\n >\n <rect\n key={index}\n id={`${this._barId}-${barNo}-${index}`}\n x={`${\n this._isRTL\n ? 100 - startingPoint[index] - value - this.state.barSpacingInPercent * index\n : startingPoint[index] + this.state.barSpacingInPercent * index\n }%`}\n y={0}\n width={value + '%'}\n height={barHeight}\n fill={color}\n />\n </g>\n );\n });\n if (this.props.variant === MultiStackedBarChartVariant.AbsoluteScale && !this.props.hideLabels) {\n let showLabel = false;\n let barLabel = 0;\n if (this._noLegendHighlighted()) {\n showLabel = true;\n barLabel = barTotalValue;\n } else {\n data.chartData?.forEach(point => {\n if (this._legendHighlighted(point.legend!)) {\n showLabel = true;\n barLabel += point.data ? point.data : 0;\n }\n });\n }\n if (showLabel) {\n bars.push(\n <text\n key=\"text\"\n x={`${\n this._isRTL\n ? 100 - (startingPoint[startingPoint.length - 1] || 0) - value - totalMarginPercent\n : (startingPoint[startingPoint.length - 1] || 0) + value + totalMarginPercent\n }%`}\n textAnchor={'start'}\n y={barHeight / 2}\n dominantBaseline=\"central\"\n transform={`translate(${this._isRTL ? -4 : 4})`}\n className={this._classNames.barLabel}\n aria-label={`Total: ${barLabel}`}\n role=\"img\"\n >\n {formatValueWithSIPrefix(barLabel)}\n </text>,\n );\n }\n } else {\n // Render placeholder bars only for part-to-whole variant\n if (data.chartData!.length === 0) {\n bars.push(\n <g key={0} className={this._classNames.noData} onClick={this._redirectToUrl.bind(this, href)}>\n <rect\n key={0}\n id={this._barIdPlaceholderPartToWhole}\n x={'0%'}\n y={0}\n width={'100%'}\n height={barHeight}\n fill={palette.neutralLight}\n />\n </g>,\n );\n }\n if (barTotalValue === 0) {\n bars.push(\n <g key={'empty'} className={this._classNames.noData} onClick={this._redirectToUrl.bind(this, href)}>\n <rect\n key={0}\n id={this._barIdEmpty}\n x={'0%'}\n y={0}\n width={'100%'}\n height={barHeight}\n fill={palette.neutralLight}\n />\n </g>,\n );\n }\n }\n const hideNumber = hideRatio === undefined ? false : hideRatio;\n\n // Hide right side text of chart title for absolute-scale variant\n const showRatio =\n this.props.variant !== MultiStackedBarChartVariant.AbsoluteScale && !hideNumber && data!.chartData!.length === 2;\n const showNumber =\n this.props.variant !== MultiStackedBarChartVariant.AbsoluteScale && !hideNumber && data!.chartData!.length === 1;\n\n const getChartData = () => convertToLocaleString(data!.chartData![0].data ? data!.chartData![0].data : 0, culture);\n return (\n <div className={this._classNames.singleChartRoot}>\n <FocusZone direction={FocusZoneDirection.horizontal}>\n <div className={this._classNames.chartTitle}>\n {data!.chartTitle && (\n <FocusableTooltipText\n className={this._classNames.chartTitleLeft}\n content={data!.chartTitle}\n accessibilityData={data!.chartTitleAccessibilityData}\n />\n )}\n {showRatio && (\n <div {...getAccessibleDataObject(data!.chartDataAccessibilityData, 'text', false)}>\n <span className={this._classNames.ratioNumerator}>{getChartData()}</span>\n {!hideDenominator && (\n <span className={this._classNames.ratioDenominator}>\n {' / ' + convertToLocaleString(barTotalValue, culture)}\n </span>\n )}\n </div>\n )}\n {showNumber && (\n <div\n className={this._classNames.ratioNumerator}\n {...getAccessibleDataObject(data!.chartDataAccessibilityData, 'text', false)}\n >\n {getChartData()}\n </div>\n )}\n </div>\n </FocusZone>\n <FocusZone direction={FocusZoneDirection.horizontal}>\n <div className={this._classNames.chartWrapper}>\n <svg ref={this.barChartSvgRef} className={this._classNames.chart} aria-label={data?.chartTitle}>\n {bars}\n </svg>\n </div>\n </FocusZone>\n </div>\n );\n }\n\n private _onBarFocus(pointData: number, color: string, point: IChartDataPoint): void {\n this.state.refArray.forEach((obj: IRefArrayData) => {\n if (obj.legendText === point.legend!) {\n this.setState({\n refSelected: obj.refElement,\n /** Show the callout if highlighted bar is focused and Hide it if unhighlighted bar is focused */\n isCalloutVisible: this.state.selectedLegend === '' || this.state.selectedLegend === point.legend!,\n calloutLegend: point.legend!,\n dataForHoverCard: pointData,\n color,\n xCalloutValue: point.xAxisCalloutData!,\n yCalloutValue: point.yAxisCalloutData!,\n dataPointCalloutProps: point,\n callOutAccessibilityData: point.callOutAccessibilityData!,\n });\n }\n });\n }\n\n private _refCallback(element: SVGGElement, legendTitle: string): void {\n this.state.refArray.push({ legendText: legendTitle, refElement: element });\n }\n\n private _adjustProps = (): void => {\n const { theme, className, styles, width, barHeight } = this.props;\n this._classNames = getClassNames(styles!, {\n legendColor: this.state.color,\n theme: theme!,\n width,\n className,\n barHeight,\n });\n };\n\n private _onHover(legendTitle: string): void {\n this.setState({\n activeLegend: legendTitle,\n });\n }\n\n private _getLegendData = (data: IChartProps[], hideRatio: boolean[], palette: IPalette): JSX.Element => {\n const defaultPalette: string[] = [palette.blueLight, palette.blue, palette.blueMid, palette.red, palette.black];\n const actions: ILegend[] = [];\n data.forEach((singleChartData: IChartProps, index: number) => {\n const validChartData = singleChartData.chartData!.filter((_: IChartDataPoint) => !_.placeHolder);\n if (validChartData!.length < 3) {\n const hideNumber = hideRatio[index] === undefined ? false : hideRatio[index];\n if (hideNumber) {\n validChartData!.forEach((point: IChartDataPoint) => {\n const color: string = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n const checkSimilarLegends = actions.filter(\n (leg: ILegend) => leg.title === point.legend! && leg.color === color,\n );\n if (checkSimilarLegends!.length > 0) {\n return;\n }\n const legend: ILegend = {\n title: point.legend!,\n color,\n action: () => {\n this._onClick(point.legend!);\n },\n hoverAction: () => {\n this._handleChartMouseLeave();\n this._onHover(point.legend!);\n },\n onMouseOutAction: () => {\n this._onLeave();\n },\n };\n actions.push(legend);\n });\n }\n } else {\n validChartData!.forEach((point: IChartDataPoint) => {\n const color: string = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n const checkSimilarLegends = actions.filter(\n (leg: ILegend) => leg.title === point.legend! && leg.color === color,\n );\n if (checkSimilarLegends!.length > 0) {\n return;\n }\n const legend: ILegend = {\n title: point.legend!,\n color,\n action: () => {\n this._onClick(point.legend!);\n },\n hoverAction: () => {\n this._handleChartMouseLeave();\n this._onHover(point.legend!);\n },\n onMouseOutAction: () => {\n this._onLeave();\n },\n };\n actions.push(legend);\n });\n }\n });\n return (\n <Legends\n legends={actions}\n overflowProps={this.props.legendsOverflowProps}\n focusZonePropsInHoverCard={this.props.focusZonePropsForLegendsInHoverCard}\n overflowText={this.props.legendsOverflowText}\n {...this.props.legendProps}\n />\n );\n };\n\n private _onClick(legendTitle: string): void {\n if (this.state.selectedLegend === legendTitle) {\n this.setState({\n selectedLegend: '',\n });\n } else {\n this.setState({\n selectedLegend: legendTitle,\n });\n }\n }\n\n private _onLeave(): void {\n this.setState({\n activeLegend: '',\n });\n }\n\n private _onBarHover(\n pointData: number,\n color: string,\n point: IChartDataPoint,\n mouseEvent: React.MouseEvent<SVGPathElement>,\n ): void {\n mouseEvent.persist();\n\n if (this._calloutAnchorPoint !== point) {\n this._calloutAnchorPoint = point;\n this.setState({\n refSelected: mouseEvent,\n /** Show the callout if highlighted bar is hovered and Hide it if unhighlighted bar is hovered */\n isCalloutVisible: this.state.selectedLegend === '' || this.state.selectedLegend === point.legend!,\n calloutLegend: point.legend!,\n dataForHoverCard: pointData,\n color,\n xCalloutValue: point.xAxisCalloutData!,\n yCalloutValue: point.yAxisCalloutData!,\n dataPointCalloutProps: point,\n callOutAccessibilityData: point.callOutAccessibilityData!,\n });\n }\n }\n\n private _onBarLeave(): void {\n /**/\n }\n\n private _handleChartMouseLeave = () => {\n this._calloutAnchorPoint = null;\n this.setState({\n isCalloutVisible: false,\n });\n };\n\n private _redirectToUrl(href: string | undefined): void {\n href ? (window.location.href = href) : '';\n }\n\n private _closeCallout = () => {\n this.setState({\n isCalloutVisible: false,\n });\n };\n\n /**\n * This function checks if the given legend is highlighted or not.\n * A legend can be highlighted in 2 ways:\n * 1. selection: if the user clicks on it\n * 2. hovering: if there is no selected legend and the user hovers over it\n */\n private _legendHighlighted = (legendTitle: string) => {\n return (\n this.state.selectedLegend === legendTitle ||\n (this.state.selectedLegend === '' && this.state.activeLegend === legendTitle)\n );\n };\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n private _noLegendHighlighted = () => {\n return this.state.selectedLegend === '' && this.state.activeLegend === '';\n };\n\n private _getAriaLabel = (point: IChartDataPoint): string => {\n const legend = point.xAxisCalloutData || point.legend;\n const yValue = point.yAxisCalloutData || point.data || 0;\n return (\n point.callOutAccessibilityData?.ariaLabel ||\n (legend ? `${legend}, ` : point.placeHolder ? 'Remaining, ' : '') + `${yValue}.`\n );\n };\n\n private _computeLongestBarTotalValue = () => {\n let longestBarTotalValue = 0;\n this.props.data!.forEach(({ chartData }) => {\n const barTotalValue = chartData!.reduce(\n (acc: number, point: IChartDataPoint) => acc + (point.data ? point.data : 0),\n 0,\n );\n longestBarTotalValue = Math.max(longestBarTotalValue, barTotalValue);\n });\n return longestBarTotalValue;\n };\n\n private _isChartEmpty(): boolean {\n return !(\n this.props.data &&\n this.props.data.length > 0 &&\n this.props.data.filter(\n item => item.chartData && item.chartData.length === 0 && (!item.chartTitle || item.chartTitle === ''),\n ).length === 0\n );\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"MultiStackedBarChart.base.js","sourceRoot":"../src/","sources":["components/StackedBarChart/MultiStackedBarChart.base.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { classNamesFunction, getId, getRTL } from '@fluentui/react/lib/Utilities';\nimport { IProcessedStyleSet, IPalette } from '@fluentui/react/lib/Styling';\nimport { ILegend, Legends } from '../Legends/index';\nimport {\n IAccessibilityProps,\n IChartDataPoint,\n IChartProps,\n IMultiStackedBarChartProps,\n IMultiStackedBarChartStyles,\n IMultiStackedBarChartStyleProps,\n MultiStackedBarChartVariant,\n} from './index';\nimport { Callout, DirectionalHint } from '@fluentui/react/lib/Callout';\nimport { FocusZone, FocusZoneDirection } from '@fluentui/react-focus';\nimport { convertToLocaleString } from '../../utilities/locale-util';\nimport {\n ChartHoverCard,\n formatValueWithSIPrefix,\n getAccessibleDataObject,\n getNextGradient,\n} from '../../utilities/index';\nimport { FocusableTooltipText } from '../../utilities/FocusableTooltipText';\n\nconst getClassNames = classNamesFunction<IMultiStackedBarChartStyleProps, IMultiStackedBarChartStyles>();\n\nexport interface IRefArrayData {\n legendText?: string;\n refElement?: SVGGElement;\n}\n\nexport interface IMultiStackedBarChartState {\n isCalloutVisible: boolean;\n refArray: IRefArrayData[];\n selectedLegend: string;\n activeLegend: string;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n refSelected: any;\n dataForHoverCard: number;\n color: string;\n xCalloutValue?: string;\n yCalloutValue?: string;\n dataPointCalloutProps?: IChartDataPoint;\n callOutAccessibilityData?: IAccessibilityProps;\n calloutLegend: string;\n barSpacingInPercent: number;\n}\n\nexport class MultiStackedBarChartBase extends React.Component<IMultiStackedBarChartProps, IMultiStackedBarChartState> {\n public static defaultProps: Partial<IMultiStackedBarChartProps> = {\n barHeight: 12,\n hideRatio: [],\n hideDenominator: [],\n };\n\n private _classNames: IProcessedStyleSet<IMultiStackedBarChartStyles>;\n private _calloutId: string;\n private _calloutAnchorPoint: IChartDataPoint | null;\n private _longestBarTotalValue: number;\n private _isRTL: boolean = getRTL();\n private barChartSvgRef: React.RefObject<SVGSVGElement>;\n private _emptyChartId: string;\n private _barId: string;\n private _barIdPlaceholderPartToWhole: string;\n private _barIdEmpty: string;\n\n public constructor(props: IMultiStackedBarChartProps) {\n super(props);\n this.state = {\n isCalloutVisible: false,\n refArray: [],\n selectedLegend: '',\n activeLegend: '',\n refSelected: null,\n dataForHoverCard: 0,\n color: '',\n xCalloutValue: '',\n yCalloutValue: '',\n calloutLegend: '',\n barSpacingInPercent: 0,\n };\n this._onLeave = this._onLeave.bind(this);\n this._onBarLeave = this._onBarLeave.bind(this);\n this._calloutId = getId('callout');\n this.barChartSvgRef = React.createRef<SVGSVGElement>();\n this._emptyChartId = getId('_MSBC_empty');\n this._barId = getId('_MSBC_rect_');\n this._barIdPlaceholderPartToWhole = getId('_MSBC_rect_partToWhole_');\n this._barIdEmpty = getId('_MSBC_rect_empty');\n }\n\n public componentDidMount(): void {\n const svgWidth = this.barChartSvgRef.current?.getBoundingClientRect().width || 0;\n const MARGIN_WIDTH_IN_PX = 3;\n if (svgWidth) {\n const currentBarSpacing = (MARGIN_WIDTH_IN_PX / svgWidth) * 100;\n this.setState({ barSpacingInPercent: currentBarSpacing });\n }\n }\n\n public render(): JSX.Element {\n if (!this._isChartEmpty()) {\n const { data, theme, culture } = this.props;\n this._adjustProps();\n const { palette } = theme!;\n const legends = this._getLegendData(data!, this.props.hideRatio!, palette);\n const { isCalloutVisible } = this.state;\n\n this._classNames = getClassNames(this.props.styles!, {\n legendColor: this.state.color,\n theme: theme!,\n variant: this.props.variant,\n hideLabels: this.props.hideLabels,\n });\n\n const legendName = this.state.xCalloutValue ? this.state.xCalloutValue : this.state.calloutLegend;\n const calloutYVal = this.state.yCalloutValue ? this.state.yCalloutValue : this.state.dataForHoverCard;\n\n this._longestBarTotalValue = this._computeLongestBarTotalValue();\n\n const bars: JSX.Element[] = data!.map((singleChartData: IChartProps, index: number) => {\n const singleChartBars = this._createBarsAndLegends(\n singleChartData!,\n this.props.barHeight!,\n palette,\n this.props.hideRatio![index],\n this.props.hideDenominator![index],\n this.props.href,\n index,\n );\n return (\n <div key={index} id={`_MSBC_bar-${index}`}>\n {singleChartBars}\n </div>\n );\n });\n\n return (\n <div className={this._classNames.root} onMouseLeave={this._handleChartMouseLeave}>\n {bars}\n {!this.props.hideLegend && <div className={this._classNames.legendContainer}>{legends}</div>}\n <Callout\n gapSpace={15}\n isBeakVisible={false}\n target={this.state.refSelected}\n setInitialFocus={true}\n hidden={!(!this.props.hideTooltip && isCalloutVisible)}\n directionalHint={DirectionalHint.topAutoEdge}\n id={this._calloutId}\n onDismiss={this._closeCallout}\n preventDismissOnLostFocus={true}\n /** Keep the callout updated with details of focused/hovered bar */\n shouldUpdateWhenHidden={true}\n {...this.props.calloutProps!}\n {...getAccessibleDataObject(this.state.callOutAccessibilityData, 'text', false)}\n >\n <>\n {this.props.onRenderCalloutPerDataPoint ? (\n this.props.onRenderCalloutPerDataPoint(this.state.dataPointCalloutProps)\n ) : (\n <ChartHoverCard Legend={legendName} YValue={calloutYVal} color={this.state.color} culture={culture} />\n )}\n </>\n </Callout>\n </div>\n );\n }\n\n return (\n <div\n id={this._emptyChartId}\n role={'alert'}\n style={{ opacity: '0' }}\n aria-label={'Graph has no data to display'}\n />\n );\n }\n\n /**\n * The Create bar functions returns an array of <rect> elements, which form the bars\n * For each bar an x value, and a width needs to be specified\n * The computations are done based on percentages\n * Extra margin is also provided, in the x value to provide some spacing\n */\n\n private _createBarsAndLegends(\n data: IChartProps,\n barHeight: number,\n palette: IPalette,\n hideRatio: boolean,\n hideDenominator: boolean,\n href?: string,\n barNo?: number,\n ): JSX.Element {\n const noOfBars =\n data.chartData?.reduce((count: number, point: IChartDataPoint) => (count += (point.data || 0) > 0 ? 1 : 0), 0) ||\n 1;\n const totalMarginPercent = this.state.barSpacingInPercent * (noOfBars - 1);\n const { culture } = this.props;\n const defaultPalette: string[] = [palette.blueLight, palette.blue, palette.blueMid, palette.red, palette.black];\n // calculating starting point of each bar and it's range\n const startingPoint: number[] = [];\n const barTotalValue = data.chartData!.reduce(\n (acc: number, point: IChartDataPoint) => acc + (point.data ? point.data : 0),\n 0,\n );\n const total =\n this.props.variant === MultiStackedBarChartVariant.AbsoluteScale ? this._longestBarTotalValue : barTotalValue;\n\n let sumOfPercent = 0;\n data.chartData!.map((point: IChartDataPoint, index: number) => {\n const pointData = point.data ? point.data : 0;\n const currValue = (pointData / total) * 100;\n let value = currValue ? currValue : 0;\n\n if (value < 1 && value !== 0) {\n value = 1;\n } else if (value > 99 && value !== 100) {\n value = 99;\n }\n sumOfPercent += value;\n\n return sumOfPercent;\n });\n\n // Include an imaginary placeholder bar with value equal to\n // the difference between longestBarTotalValue and barTotalValue\n // while calculating sumOfPercent to get correct scalingRatio for absolute-scale variant\n if (this.props.variant === MultiStackedBarChartVariant.AbsoluteScale) {\n let value = total === 0 ? 0 : ((total - barTotalValue) / total) * 100;\n if (value < 1 && value !== 0) {\n value = 1;\n } else if (value > 99 && value !== 100) {\n value = 99;\n }\n sumOfPercent += value;\n }\n\n /**\n * The %age of the space occupied by the margin needs to subtracted\n * while computing the scaling ratio, since the margins are not being\n * scaled down, only the data is being scaled down from a higher percentage to lower percentage\n * Eg: 95% of the space is taken by the bars, 5% by the margins\n * Now if the sumOfPercent is 120% -> This needs to be scaled down to 95%, not 100%\n * since that's only space available to the bars\n */\n\n const scalingRatio = sumOfPercent !== 0 ? sumOfPercent / (100 - totalMarginPercent) : 1;\n\n let prevPosition = 0;\n let value = 0;\n\n const bars = data.chartData!.map((point: IChartDataPoint, index: number) => {\n let startColor: string = point.color\n ? point.color\n : point.placeHolder\n ? palette.neutralLight\n : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n let endColor: string = startColor;\n if (this.props.enableGradient) {\n startColor = point.gradient?.[0] || getNextGradient(index, 0, this.props.theme?.isInverted)[0];\n endColor = point.gradient?.[1] || getNextGradient(index, 0, this.props.theme?.isInverted)[1];\n }\n const pointData = point.data ? point.data : 0;\n if (index > 0) {\n prevPosition += value;\n }\n value = (pointData / total) * 100 ? (pointData / total) * 100 : 0;\n if (value < 1 && value !== 0) {\n value = 1 / scalingRatio;\n } else if (value > 99 && value !== 100) {\n value = 99 / scalingRatio;\n } else {\n value = value / scalingRatio;\n }\n\n startingPoint.push(prevPosition);\n\n const styles = this.props.styles;\n const shouldHighlight = this._legendHighlighted(point.legend!) || this._noLegendHighlighted() ? true : false;\n const hoverCardYColor = point.placeHolder ? this.props.theme!.semanticColors.bodyText : startColor;\n\n this._classNames = getClassNames(styles!, {\n theme: this.props.theme!,\n shouldHighlight,\n href,\n variant: this.props.variant,\n hideLabels: this.props.hideLabels,\n });\n\n const gradientId = getId('MSBC_Gradient') + `_${barNo}_${index}`;\n\n return (\n <g\n key={index}\n className={point.placeHolder ? this._classNames.placeHolderOnHover : this._classNames.opacityChangeOnHover}\n ref={(e: SVGGElement) => {\n this._refCallback(e, point.legend!);\n }}\n data-is-focusable={!this.props.hideTooltip && shouldHighlight}\n onFocus={this._onBarFocus.bind(this, pointData, hoverCardYColor, point)}\n onBlur={this._onBarLeave}\n role=\"img\"\n aria-label={this._getAriaLabel(point)}\n onMouseOver={this._onBarHover.bind(this, pointData, hoverCardYColor, point)}\n onMouseMove={this._onBarHover.bind(this, pointData, hoverCardYColor, point)}\n onMouseLeave={this._onBarLeave}\n onClick={href ? (point.placeHolder ? undefined : this._redirectToUrl.bind(this, href)) : point.onClick}\n >\n {this.props.enableGradient && (\n <defs>\n <linearGradient id={gradientId}>\n <stop offset=\"0\" stopColor={startColor} />\n <stop offset=\"100%\" stopColor={endColor} />\n </linearGradient>\n </defs>\n )}\n <rect\n key={index}\n id={`${this._barId}-${barNo}-${index}`}\n x={`${\n this._isRTL\n ? 100 - startingPoint[index] - value - this.state.barSpacingInPercent * index\n : startingPoint[index] + this.state.barSpacingInPercent * index\n }%`}\n y={0}\n width={value + '%'}\n height={barHeight}\n rx={this.props.roundCorners ? 3 : 0}\n fill={this.props.enableGradient ? `url(#${gradientId})` : startColor}\n />\n </g>\n );\n });\n if (this.props.variant === MultiStackedBarChartVariant.AbsoluteScale && !this.props.hideLabels) {\n let showLabel = false;\n let barLabel = 0;\n if (this._noLegendHighlighted()) {\n showLabel = true;\n barLabel = barTotalValue;\n } else {\n data.chartData?.forEach(point => {\n if (this._legendHighlighted(point.legend!)) {\n showLabel = true;\n barLabel += point.data ? point.data : 0;\n }\n });\n }\n if (showLabel) {\n bars.push(\n <text\n key=\"text\"\n x={`${\n this._isRTL\n ? 100 - (startingPoint[startingPoint.length - 1] || 0) - value - totalMarginPercent\n : (startingPoint[startingPoint.length - 1] || 0) + value + totalMarginPercent\n }%`}\n textAnchor={'start'}\n y={barHeight / 2}\n dominantBaseline=\"central\"\n transform={`translate(${this._isRTL ? -4 : 4})`}\n className={this._classNames.barLabel}\n aria-label={`Total: ${barLabel}`}\n role=\"img\"\n >\n {formatValueWithSIPrefix(barLabel)}\n </text>,\n );\n }\n } else {\n // Render placeholder bars only for part-to-whole variant\n if (data.chartData!.length === 0) {\n bars.push(\n <g key={0} className={this._classNames.noData} onClick={this._redirectToUrl.bind(this, href)}>\n <rect\n key={0}\n id={this._barIdPlaceholderPartToWhole}\n x={'0%'}\n y={0}\n width={'100%'}\n height={barHeight}\n fill={palette.neutralLight}\n rx={this.props.roundCorners ? 3 : 0}\n />\n </g>,\n );\n }\n if (barTotalValue === 0) {\n bars.push(\n <g key={'empty'} className={this._classNames.noData} onClick={this._redirectToUrl.bind(this, href)}>\n <rect\n key={0}\n id={this._barIdEmpty}\n x={'0%'}\n y={0}\n width={'100%'}\n height={barHeight}\n fill={palette.neutralLight}\n rx={this.props.roundCorners ? 3 : 0}\n />\n </g>,\n );\n }\n }\n const hideNumber = hideRatio === undefined ? false : hideRatio;\n\n // Hide right side text of chart title for absolute-scale variant\n const showRatio =\n this.props.variant !== MultiStackedBarChartVariant.AbsoluteScale && !hideNumber && data!.chartData!.length === 2;\n const showNumber =\n this.props.variant !== MultiStackedBarChartVariant.AbsoluteScale && !hideNumber && data!.chartData!.length === 1;\n\n const getChartData = () => convertToLocaleString(data!.chartData![0].data ? data!.chartData![0].data : 0, culture);\n return (\n <div className={this._classNames.singleChartRoot}>\n <FocusZone direction={FocusZoneDirection.horizontal}>\n <div className={this._classNames.chartTitle}>\n {data!.chartTitle && (\n <FocusableTooltipText\n className={this._classNames.chartTitleLeft}\n content={data!.chartTitle}\n accessibilityData={data!.chartTitleAccessibilityData}\n />\n )}\n {showRatio && (\n <div {...getAccessibleDataObject(data!.chartDataAccessibilityData, 'text', false)}>\n <span className={this._classNames.ratioNumerator}>{getChartData()}</span>\n {!hideDenominator && (\n <span className={this._classNames.ratioDenominator}>\n {' / ' + convertToLocaleString(barTotalValue, culture)}\n </span>\n )}\n </div>\n )}\n {showNumber && (\n <div\n className={this._classNames.ratioNumerator}\n {...getAccessibleDataObject(data!.chartDataAccessibilityData, 'text', false)}\n >\n {getChartData()}\n </div>\n )}\n </div>\n </FocusZone>\n <FocusZone direction={FocusZoneDirection.horizontal}>\n <div className={this._classNames.chartWrapper}>\n <svg ref={this.barChartSvgRef} className={this._classNames.chart} aria-label={data?.chartTitle}>\n {bars}\n </svg>\n </div>\n </FocusZone>\n </div>\n );\n }\n\n private _onBarFocus(pointData: number, color: string, point: IChartDataPoint): void {\n this.state.refArray.forEach((obj: IRefArrayData) => {\n if (obj.legendText === point.legend!) {\n this.setState({\n refSelected: obj.refElement,\n /** Show the callout if highlighted bar is focused and Hide it if unhighlighted bar is focused */\n isCalloutVisible: this.state.selectedLegend === '' || this.state.selectedLegend === point.legend!,\n calloutLegend: point.legend!,\n dataForHoverCard: pointData,\n color,\n xCalloutValue: point.xAxisCalloutData!,\n yCalloutValue: point.yAxisCalloutData!,\n dataPointCalloutProps: { ...point, color },\n callOutAccessibilityData: point.callOutAccessibilityData!,\n });\n }\n });\n }\n\n private _refCallback(element: SVGGElement, legendTitle: string): void {\n this.state.refArray.push({ legendText: legendTitle, refElement: element });\n }\n\n private _adjustProps = (): void => {\n const { theme, className, styles, width, barHeight } = this.props;\n this._classNames = getClassNames(styles!, {\n legendColor: this.state.color,\n theme: theme!,\n width,\n className,\n barHeight,\n });\n };\n\n private _onHover(legendTitle: string): void {\n this.setState({\n activeLegend: legendTitle,\n });\n }\n\n private _getLegendData = (data: IChartProps[], hideRatio: boolean[], palette: IPalette): JSX.Element => {\n const defaultPalette: string[] = [palette.blueLight, palette.blue, palette.blueMid, palette.red, palette.black];\n const actions: ILegend[] = [];\n data.forEach((singleChartData: IChartProps, index: number) => {\n const validChartData = singleChartData.chartData!.filter((_: IChartDataPoint) => !_.placeHolder);\n if (validChartData!.length < 3) {\n const hideNumber = hideRatio[index] === undefined ? false : hideRatio[index];\n if (hideNumber) {\n validChartData!.forEach((point: IChartDataPoint, pointIndex: number) => {\n let color: string = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n if (this.props.enableGradient) {\n color = point.gradient?.[0] || getNextGradient(pointIndex, 0, this.props.theme?.isInverted)[0];\n }\n\n const checkSimilarLegends = actions.filter(\n (leg: ILegend) => leg.title === point.legend! && leg.color === color,\n );\n if (checkSimilarLegends!.length > 0) {\n return;\n }\n const legend: ILegend = {\n title: point.legend!,\n color,\n action: () => {\n this._onClick(point.legend!);\n },\n hoverAction: () => {\n this._handleChartMouseLeave();\n this._onHover(point.legend!);\n },\n onMouseOutAction: () => {\n this._onLeave();\n },\n };\n actions.push(legend);\n });\n }\n } else {\n validChartData!.forEach((point: IChartDataPoint, pointIndex: number) => {\n let color: string = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];\n if (this.props.enableGradient) {\n color = point.gradient?.[0] || getNextGradient(pointIndex, 0, this.props.theme?.isInverted)[0];\n }\n\n const checkSimilarLegends = actions.filter(\n (leg: ILegend) => leg.title === point.legend! && leg.color === color,\n );\n if (checkSimilarLegends!.length > 0) {\n return;\n }\n const legend: ILegend = {\n title: point.legend!,\n color,\n action: () => {\n this._onClick(point.legend!);\n },\n hoverAction: () => {\n this._handleChartMouseLeave();\n this._onHover(point.legend!);\n },\n onMouseOutAction: () => {\n this._onLeave();\n },\n };\n actions.push(legend);\n });\n }\n });\n return (\n <Legends\n legends={actions}\n overflowProps={this.props.legendsOverflowProps}\n focusZonePropsInHoverCard={this.props.focusZonePropsForLegendsInHoverCard}\n overflowText={this.props.legendsOverflowText}\n {...this.props.legendProps}\n />\n );\n };\n\n private _onClick(legendTitle: string): void {\n if (this.state.selectedLegend === legendTitle) {\n this.setState({\n selectedLegend: '',\n });\n } else {\n this.setState({\n selectedLegend: legendTitle,\n });\n }\n }\n\n private _onLeave(): void {\n this.setState({\n activeLegend: '',\n });\n }\n\n private _onBarHover(\n pointData: number,\n color: string,\n point: IChartDataPoint,\n mouseEvent: React.MouseEvent<SVGPathElement>,\n ): void {\n mouseEvent.persist();\n\n if (this._calloutAnchorPoint !== point) {\n this._calloutAnchorPoint = point;\n this.setState({\n refSelected: mouseEvent,\n /** Show the callout if highlighted bar is hovered and Hide it if unhighlighted bar is hovered */\n isCalloutVisible: this.state.selectedLegend === '' || this.state.selectedLegend === point.legend!,\n calloutLegend: point.legend!,\n dataForHoverCard: pointData,\n color,\n xCalloutValue: point.xAxisCalloutData!,\n yCalloutValue: point.yAxisCalloutData!,\n dataPointCalloutProps: { ...point, color },\n callOutAccessibilityData: point.callOutAccessibilityData!,\n });\n }\n }\n\n private _onBarLeave(): void {\n /**/\n }\n\n private _handleChartMouseLeave = () => {\n this._calloutAnchorPoint = null;\n this.setState({\n isCalloutVisible: false,\n });\n };\n\n private _redirectToUrl(href: string | undefined): void {\n href ? (window.location.href = href) : '';\n }\n\n private _closeCallout = () => {\n this.setState({\n isCalloutVisible: false,\n });\n };\n\n /**\n * This function checks if the given legend is highlighted or not.\n * A legend can be highlighted in 2 ways:\n * 1. selection: if the user clicks on it\n * 2. hovering: if there is no selected legend and the user hovers over it\n */\n private _legendHighlighted = (legendTitle: string) => {\n return (\n this.state.selectedLegend === legendTitle ||\n (this.state.selectedLegend === '' && this.state.activeLegend === legendTitle)\n );\n };\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n private _noLegendHighlighted = () => {\n return this.state.selectedLegend === '' && this.state.activeLegend === '';\n };\n\n private _getAriaLabel = (point: IChartDataPoint): string => {\n const legend = point.xAxisCalloutData || point.legend;\n const yValue = point.yAxisCalloutData || point.data || 0;\n return (\n point.callOutAccessibilityData?.ariaLabel ||\n (legend ? `${legend}, ` : point.placeHolder ? 'Remaining, ' : '') + `${yValue}.`\n );\n };\n\n private _computeLongestBarTotalValue = () => {\n let longestBarTotalValue = 0;\n this.props.data!.forEach(({ chartData }) => {\n const barTotalValue = chartData!.reduce(\n (acc: number, point: IChartDataPoint) => acc + (point.data ? point.data : 0),\n 0,\n );\n longestBarTotalValue = Math.max(longestBarTotalValue, barTotalValue);\n });\n return longestBarTotalValue;\n };\n\n private _isChartEmpty(): boolean {\n return !(\n this.props.data &&\n this.props.data.length > 0 &&\n this.props.data.filter(\n item => item.chartData && item.chartData.length === 0 && (!item.chartTitle || item.chartTitle === ''),\n ).length === 0\n );\n }\n}\n"]}
|
|
@@ -99,6 +99,16 @@ export interface IMultiStackedBarChartProps {
|
|
|
99
99
|
* @default false
|
|
100
100
|
*/
|
|
101
101
|
hideLabels?: boolean;
|
|
102
|
+
/**
|
|
103
|
+
* @default false
|
|
104
|
+
* The prop used to enable gradient fill color for the chart.
|
|
105
|
+
*/
|
|
106
|
+
enableGradient?: boolean;
|
|
107
|
+
/**
|
|
108
|
+
* @default false
|
|
109
|
+
* The prop used to enable rounded corners for the chart.
|
|
110
|
+
*/
|
|
111
|
+
roundCorners?: boolean;
|
|
102
112
|
}
|
|
103
113
|
/**
|
|
104
114
|
* Multi Stacked Bar Chart style properties
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiStackedBarChart.types.js","sourceRoot":"../src/","sources":["components/StackedBarChart/MultiStackedBarChart.types.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MultiStackedBarChart.types.js","sourceRoot":"../src/","sources":["components/StackedBarChart/MultiStackedBarChart.types.ts"],"names":[],"mappings":"AAsQA;;GAEG;AACH,MAAM,CAAN,IAAY,2BAGX;AAHD,WAAY,2BAA2B;IACrC,4DAA6B,CAAA;IAC7B,+DAAgC,CAAA;AAClC,CAAC,EAHW,2BAA2B,KAA3B,2BAA2B,QAGtC","sourcesContent":["import { IChartProps, IChartDataPoint } from './index';\nimport { IStyle, ITheme } from '@fluentui/react/lib/Styling';\nimport { ICalloutProps } from '@fluentui/react/lib/Callout';\nimport { IRenderFunction, IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport { IOverflowSetProps } from '@fluentui/react/lib/OverflowSet';\nimport { IFocusZoneProps } from '@fluentui/react-focus';\nimport { ILegendsProps } from '../Legends/index';\n\n/**\n * Multi Stacked Bar Chart properties\n * {@docCategory MultiStackedBarChart}\n */\nexport interface IMultiStackedBarChartProps {\n /**\n * An array of chart data points for the multistacked bar chart\n */\n data?: IChartProps[];\n\n /**\n * Width of bar chart\n */\n width?: number;\n\n /**\n * Height of bar chart\n * @default 15\n */\n barHeight?: number;\n\n /**\n * Additional CSS class(es) to apply to the StackedBarChart.\n */\n className?: string;\n\n /**\n * Theme (provided through customization.)\n */\n theme?: ITheme;\n\n /**\n * This property tells whether to show ratio on top of stacked bar chart or not.\n * This property is applicable only if there are 1 or 2 datapoints.\n */\n hideRatio?: boolean[];\n\n /**\n * Do not show the legend at the bottom of chart\n *\n * @default false\n */\n hideLegend?: boolean;\n\n /**\n * Do not show tooltips in chart\n *\n * @default false\n */\n hideTooltip?: boolean;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules.\n */\n styles?: IStyleFunctionOrObject<IMultiStackedBarChartStyleProps, IMultiStackedBarChartStyles>;\n\n /**\n * Url that the data-viz needs to redirect to upon clicking on it\n */\n href?: string;\n\n /**\n * If this value is set to true the denominator will not be shown for the ratio above the chart\n * This prop is applicable only if hide ratio is false and there are exactly 2 datapoints.\n */\n hideDenominator?: boolean[];\n\n /**\n * overflow props for legend\n */\n legendsOverflowProps?: Partial<IOverflowSetProps>;\n\n /**\n * text for overflow legends string\n */\n legendsOverflowText?: string;\n\n /**\n * focus zone props in hover card for legends\n */\n focusZonePropsForLegendsInHoverCard?: IFocusZoneProps;\n\n /**\n * props for the legends in the chart\n */\n legendProps?: Partial<ILegendsProps>;\n\n /**\n * Define a custom callout renderer for a data point\n */\n onRenderCalloutPerDataPoint?: IRenderFunction<IChartDataPoint>;\n\n /**\n * props for the callout in the chart\n */\n calloutProps?: Partial<ICalloutProps>;\n\n /**\n * The prop used to define the culture to localized the numbers\n */\n culture?: string;\n\n /**\n * Prop to define the variant of MultiStackedBarChart to render\n * @default MultiStackedBarChartVariant.PartToWhole\n */\n variant?: MultiStackedBarChartVariant;\n\n /**\n * Prop to hide the bar labels\n * @default false\n */\n hideLabels?: boolean;\n\n /**\n * @default false\n * The prop used to enable gradient fill color for the chart.\n */\n enableGradient?: boolean;\n\n /**\n * @default false\n * The prop used to enable rounded corners for the chart.\n */\n roundCorners?: boolean;\n}\n\n/**\n * Multi Stacked Bar Chart style properties\n * {@docCategory MultiStackedBarChart}\n */\nexport interface IMultiStackedBarChartStyleProps {\n /**\n * Theme (provided through customization.)\n */\n theme: ITheme;\n\n /**\n * Additional CSS class(es) to apply to the StackedBarChart.\n */\n className?: string;\n\n /**\n * Width of the chart.\n */\n width?: number;\n\n /**\n * barHeight for each chart\n */\n barHeight?: number;\n\n /**\n * color of the datapoint legend\n */\n legendColor?: string;\n\n /**\n * prop to check if the chart is selcted or hovered upon to determine opacity\n */\n shouldHighlight?: boolean;\n\n /**\n * prop to check to decide cursor type\n */\n href?: string;\n\n /**\n * Prop to define the variant of MultiStackedBarChart to render\n */\n variant?: MultiStackedBarChartVariant;\n\n /**\n * Prop to hide the bar labels\n */\n hideLabels?: boolean;\n}\n\n/**\n * Multi Stacked Bar Chart styles\n * {@docCategory MultiStackedBarChart}\n */\nexport interface IMultiStackedBarChartStyles {\n /**\n * Styling for the root container\n */\n root: IStyle;\n\n /**\n * Styling for the root container of each chart in the multistacked bar chart\n */\n singleChartRoot: IStyle;\n\n /**\n * Styling for each item in the container\n */\n items: IStyle;\n\n /**\n * Styling for each svg in the multistacked bar chart\n */\n chart: IStyle;\n\n /**\n * Styling for chart title of the stacked bar chart\n */\n chartTitle: IStyle;\n\n /**\n * Style for left side text of the chart title\n */\n chartTitleLeft: IStyle;\n\n /**\n * Style to change the opacity of bars in dataviz when we hover on a single bar or legends\n */\n opacityChangeOnHover: IStyle;\n\n /**\n * Style for the chart ratio numerator\n */\n ratioNumerator: IStyle;\n\n /**\n * Style for the chart ratio denominator\n */\n ratioDenominator: IStyle;\n\n /**\n * Style to change the opacity of placeholder data point when we hover a single bar or legend\n */\n placeHolderOnHover: IStyle;\n\n /**\n * Style for the legends container\n */\n legendContainer: IStyle;\n\n /**\n * Style for stacked bar chart with no data\n */\n noData: IStyle;\n\n /**\n * Style for the bar labels\n */\n barLabel: IStyle;\n\n /**\n * Style for the div containing the chart\n */\n chartWrapper: IStyle;\n}\n\n/**\n * {@docCategory MultiStackedBarChart}\n */\nexport enum MultiStackedBarChartVariant {\n PartToWhole = 'part-to-whole',\n AbsoluteScale = 'absolute-scale',\n}\n"]}
|
|
@@ -4,7 +4,7 @@ import { classNamesFunction, getId, getRTL } from '@fluentui/react/lib/Utilities
|
|
|
4
4
|
import { Legends } from '../Legends/index';
|
|
5
5
|
import { Callout, DirectionalHint } from '@fluentui/react/lib/Callout';
|
|
6
6
|
import { FocusZone, FocusZoneDirection } from '@fluentui/react-focus';
|
|
7
|
-
import { ChartHoverCard, getAccessibleDataObject } from '../../utilities/index';
|
|
7
|
+
import { ChartHoverCard, getAccessibleDataObject, getNextGradient } from '../../utilities/index';
|
|
8
8
|
import { FocusableTooltipText } from '../../utilities/FocusableTooltipText';
|
|
9
9
|
import { convertToLocaleString } from '../../utilities/locale-util';
|
|
10
10
|
var getClassNames = classNamesFunction();
|
|
@@ -190,12 +190,18 @@ export var StackedBarChartBase = /** @class */ (function (_super) {
|
|
|
190
190
|
*/
|
|
191
191
|
var scalingRatio = sumOfPercent !== 0 ? sumOfPercent / (100 - totalMarginPercent) : 1;
|
|
192
192
|
var bars = data.chartData.map(function (point, index) {
|
|
193
|
-
var
|
|
193
|
+
var _a, _b, _c, _d;
|
|
194
|
+
var startColor = point.color ? point.color : defaultPalette[Math.floor(Math.random() * 4 + 1)];
|
|
195
|
+
var endColor = startColor;
|
|
196
|
+
if (_this.props.enableGradient) {
|
|
197
|
+
startColor = ((_a = point.gradient) === null || _a === void 0 ? void 0 : _a[0]) || getNextGradient(index, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted)[0];
|
|
198
|
+
endColor = ((_c = point.gradient) === null || _c === void 0 ? void 0 : _c[1]) || getNextGradient(index, 0, (_d = _this.props.theme) === null || _d === void 0 ? void 0 : _d.isInverted)[1];
|
|
199
|
+
}
|
|
194
200
|
var pointData = point.data ? point.data : 0;
|
|
195
201
|
// mapping data to the format Legends component needs
|
|
196
202
|
var legend = {
|
|
197
203
|
title: point.legend,
|
|
198
|
-
color:
|
|
204
|
+
color: startColor,
|
|
199
205
|
action: total > 0
|
|
200
206
|
? function () {
|
|
201
207
|
_this._onClick(point.legend);
|
|
@@ -237,12 +243,17 @@ export var StackedBarChartBase = /** @class */ (function (_super) {
|
|
|
237
243
|
shouldHighlight: shouldHighlight,
|
|
238
244
|
href: _this.props.href,
|
|
239
245
|
});
|
|
246
|
+
var gradientId = getId('SBC_Gradient') + "_".concat(index);
|
|
240
247
|
return (React.createElement("g", { key: index, className: _this._classNames.opacityChangeOnHover, ref: function (e) {
|
|
241
248
|
_this._refCallback(e, legend.title);
|
|
242
|
-
}, "data-is-focusable": !_this.props.hideTooltip && shouldHighlight, onFocus: _this._onBarFocus.bind(_this, pointData,
|
|
249
|
+
}, "data-is-focusable": !_this.props.hideTooltip && shouldHighlight, onFocus: _this._onBarFocus.bind(_this, pointData, startColor, point), onBlur: _this._onBarLeave, "aria-label": _this._getAriaLabel(point), role: "img", onMouseOver: _this._onBarHover.bind(_this, pointData, startColor, point), onMouseMove: _this._onBarHover.bind(_this, pointData, startColor, point), onMouseLeave: _this._onBarLeave, pointerEvents: "all", onClick: _this.props.href ? _this._redirectToUrl.bind(_this, _this.props.href) : point.onClick },
|
|
250
|
+
_this.props.enableGradient && (React.createElement("defs", null,
|
|
251
|
+
React.createElement("linearGradient", { id: gradientId },
|
|
252
|
+
React.createElement("stop", { offset: "0", stopColor: startColor }),
|
|
253
|
+
React.createElement("stop", { offset: "100%", stopColor: endColor })))),
|
|
243
254
|
React.createElement("rect", { key: index, id: getId('_SBC_bar'), x: "".concat(_this._isRTL
|
|
244
255
|
? 100 - startingPoint[index] - value - _this.state.barSpacingInPercent * index
|
|
245
|
-
: startingPoint[index] + _this.state.barSpacingInPercent * index, "%"), y: 0, width: value + '%', height: barHeight, fill:
|
|
256
|
+
: startingPoint[index] + _this.state.barSpacingInPercent * index, "%"), y: 0, width: value + '%', height: barHeight, rx: _this.props.roundCorners ? 3 : 0, fill: _this.props.enableGradient ? "url(#".concat(gradientId, ")") : startColor })));
|
|
246
257
|
});
|
|
247
258
|
// add benchmark legends
|
|
248
259
|
this._addLegend(legendDataItems, benchmarkData);
|
|
@@ -270,7 +281,7 @@ export var StackedBarChartBase = /** @class */ (function (_super) {
|
|
|
270
281
|
color: color,
|
|
271
282
|
xCalloutValue: point.xAxisCalloutData,
|
|
272
283
|
yCalloutValue: point.yAxisCalloutData,
|
|
273
|
-
dataPointCalloutProps: point,
|
|
284
|
+
dataPointCalloutProps: __assign(__assign({}, point), { color: color }),
|
|
274
285
|
callOutAccessibilityData: point.callOutAccessibilityData,
|
|
275
286
|
});
|
|
276
287
|
}
|
|
@@ -328,7 +339,7 @@ export var StackedBarChartBase = /** @class */ (function (_super) {
|
|
|
328
339
|
color: color,
|
|
329
340
|
xCalloutValue: point.xAxisCalloutData,
|
|
330
341
|
yCalloutValue: point.yAxisCalloutData,
|
|
331
|
-
dataPointCalloutProps: point,
|
|
342
|
+
dataPointCalloutProps: __assign(__assign({}, point), { color: color }),
|
|
332
343
|
callOutAccessibilityData: point.callOutAccessibilityData,
|
|
333
344
|
});
|
|
334
345
|
}
|