@fluentui/react-charting 5.16.29 → 5.16.31
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.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/lib/HorizontalBarChartWithAxis.d.ts +1 -0
- package/lib/HorizontalBarChartWithAxis.js +2 -0
- package/lib/HorizontalBarChartWithAxis.js.map +1 -0
- package/lib/components/CommonComponents/CartesianChart.base.d.ts +2 -0
- package/lib/components/CommonComponents/CartesianChart.base.js +72 -12
- package/lib/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.d.ts +13 -0
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.d.ts +57 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +487 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.d.ts +3 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +6 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.d.ts +2 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js +12 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js.map +1 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.d.ts +100 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js +2 -0
- package/lib/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -0
- package/lib/components/HorizontalBarChartWithAxis/index.d.ts +2 -0
- package/lib/components/HorizontalBarChartWithAxis/index.js +3 -0
- package/lib/components/HorizontalBarChartWithAxis/index.js.map +1 -0
- package/lib/index.d.ts +1 -0
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib/types/IDataPoint.d.ts +38 -0
- package/lib/types/IDataPoint.js.map +1 -1
- package/lib/utilities/utilities.d.ts +53 -8
- package/lib/utilities/utilities.js +170 -7
- package/lib/utilities/utilities.js.map +1 -1
- package/lib/version.js +1 -1
- package/lib/version.js.map +1 -1
- package/lib-amd/HorizontalBarChartWithAxis.d.ts +1 -0
- package/lib-amd/HorizontalBarChartWithAxis.js +6 -0
- package/lib-amd/HorizontalBarChartWithAxis.js.map +1 -0
- package/lib-amd/components/CommonComponents/CartesianChart.base.d.ts +2 -0
- package/lib-amd/components/CommonComponents/CartesianChart.base.js +71 -11
- package/lib-amd/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib-amd/components/CommonComponents/CartesianChart.types.d.ts +13 -0
- package/lib-amd/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.d.ts +57 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +482 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.d.ts +3 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +8 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.d.ts +2 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js +17 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js.map +1 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.d.ts +100 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js +5 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/index.d.ts +2 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/index.js +7 -0
- package/lib-amd/components/HorizontalBarChartWithAxis/index.js.map +1 -0
- package/lib-amd/index.d.ts +1 -0
- package/lib-amd/index.js +2 -1
- package/lib-amd/index.js.map +1 -1
- package/lib-amd/types/IDataPoint.d.ts +38 -0
- package/lib-amd/types/IDataPoint.js.map +1 -1
- package/lib-amd/utilities/utilities.d.ts +53 -8
- package/lib-amd/utilities/utilities.js +181 -10
- package/lib-amd/utilities/utilities.js.map +1 -1
- package/lib-amd/version.js +1 -1
- package/lib-amd/version.js.map +1 -1
- package/lib-commonjs/HorizontalBarChartWithAxis.d.ts +1 -0
- package/lib-commonjs/HorizontalBarChartWithAxis.js +5 -0
- package/lib-commonjs/HorizontalBarChartWithAxis.js.map +1 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.d.ts +2 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.js +71 -11
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.d.ts +13 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.d.ts +57 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js +490 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map +1 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.d.ts +3 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js +9 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.js.map +1 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.d.ts +2 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js +16 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js.map +1 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.d.ts +100 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js +3 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.js.map +1 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/index.d.ts +2 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/index.js +6 -0
- package/lib-commonjs/components/HorizontalBarChartWithAxis/index.js.map +1 -0
- package/lib-commonjs/index.d.ts +1 -0
- package/lib-commonjs/index.js +1 -0
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/types/IDataPoint.d.ts +38 -0
- package/lib-commonjs/types/IDataPoint.js.map +1 -1
- package/lib-commonjs/utilities/utilities.d.ts +53 -8
- package/lib-commonjs/utilities/utilities.js +181 -10
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/lib-commonjs/version.js +1 -1
- package/lib-commonjs/version.js.map +1 -1
- package/package.json +6 -5
- package/src/components/CommonComponents/CartesianChart.types.ts +16 -0
- package/src/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.types.ts +125 -0
|
@@ -0,0 +1,490 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.HorizontalBarChartWithAxisBase = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var React = require("react");
|
|
6
|
+
var d3_array_1 = require("d3-array");
|
|
7
|
+
var d3_selection_1 = require("d3-selection");
|
|
8
|
+
var d3_scale_1 = require("d3-scale");
|
|
9
|
+
var Utilities_1 = require("@fluentui/react/lib/Utilities");
|
|
10
|
+
var Callout_1 = require("@fluentui/react/lib/Callout");
|
|
11
|
+
var index_1 = require("../../index");
|
|
12
|
+
var react_focus_1 = require("@fluentui/react-focus");
|
|
13
|
+
var index_2 = require("../../utilities/index");
|
|
14
|
+
var getClassNames = Utilities_1.classNamesFunction();
|
|
15
|
+
var HorizontalBarChartWithAxisBase = /** @class */ (function (_super) {
|
|
16
|
+
tslib_1.__extends(HorizontalBarChartWithAxisBase, _super);
|
|
17
|
+
function HorizontalBarChartWithAxisBase(props) {
|
|
18
|
+
var _this = _super.call(this, props) || this;
|
|
19
|
+
_this._isRtl = Utilities_1.getRTL();
|
|
20
|
+
_this._getMargins = function (margins) {
|
|
21
|
+
_this.margins = margins;
|
|
22
|
+
};
|
|
23
|
+
_this._renderContentForOnlyBars = function (point) {
|
|
24
|
+
var _a, _b;
|
|
25
|
+
var _c = _this.props.useSingleColor, useSingleColor = _c === void 0 ? false : _c;
|
|
26
|
+
var selectedPointIndex = 0;
|
|
27
|
+
_this.props.data.forEach(function (yDataPoint, index) {
|
|
28
|
+
if (yDataPoint.y === point.y) {
|
|
29
|
+
selectedPointIndex = index;
|
|
30
|
+
}
|
|
31
|
+
});
|
|
32
|
+
var color;
|
|
33
|
+
if (useSingleColor) {
|
|
34
|
+
//if useSingle color , then check if user has given a palette or not
|
|
35
|
+
// and pick the first color from that or else from our paltette.
|
|
36
|
+
color = _this.props.colors ? _this._createColors()(1) : index_2.getNextColor(1, 0, (_a = _this.props.theme) === null || _a === void 0 ? void 0 : _a.isInverted);
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
color = point.color
|
|
40
|
+
? point.color
|
|
41
|
+
: _this.props.colors
|
|
42
|
+
? _this._createColors()(point.x)
|
|
43
|
+
: index_2.getNextColor(selectedPointIndex, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted);
|
|
44
|
+
}
|
|
45
|
+
return (React.createElement(React.Fragment, null,
|
|
46
|
+
React.createElement(index_1.ChartHoverCard, { XValue: point.xAxisCalloutData || point.x.toString(), Legend: point.legend, YValue: point.yAxisCalloutData || point.y, color: color, culture: _this.props.culture })));
|
|
47
|
+
};
|
|
48
|
+
_this._renderCallout = function (props) {
|
|
49
|
+
return props ? _this._renderContentForOnlyBars(props) : null;
|
|
50
|
+
};
|
|
51
|
+
_this._getCustomizedCallout = function () {
|
|
52
|
+
return _this.props.onRenderCalloutPerDataPoint
|
|
53
|
+
? _this.props.onRenderCalloutPerDataPoint(_this.state.dataPointCalloutProps, _this._renderCallout)
|
|
54
|
+
: null;
|
|
55
|
+
};
|
|
56
|
+
_this._getGraphData = function (xScale, yScale, containerHeight, containerWidth, xElement, yElement) {
|
|
57
|
+
return (_this._bars =
|
|
58
|
+
_this._yAxisType === index_2.YAxisType.NumericAxis
|
|
59
|
+
? _this._createNumericBars(containerHeight, containerWidth, xElement, yElement)
|
|
60
|
+
: _this._createStringBars(containerHeight, containerWidth, xElement, yElement));
|
|
61
|
+
};
|
|
62
|
+
_this._refCallback = function (element, legendTitle) {
|
|
63
|
+
_this._refArray.push({ index: legendTitle, refElement: element });
|
|
64
|
+
};
|
|
65
|
+
_this._getCalloutContentForBar = function (point) {
|
|
66
|
+
var _a, _b;
|
|
67
|
+
var YValueHover = [];
|
|
68
|
+
var _c = _this.props.useSingleColor, useSingleColor = _c === void 0 ? false : _c;
|
|
69
|
+
var data = _this.props.data;
|
|
70
|
+
var selectedPoint = data.filter(function (yDataPoint) { return yDataPoint.y === point.y; });
|
|
71
|
+
var selectedPointIndex = 0;
|
|
72
|
+
data.forEach(function (yDataPoint, index) {
|
|
73
|
+
if (yDataPoint.y === point.y) {
|
|
74
|
+
selectedPointIndex = index;
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
var color;
|
|
78
|
+
if (useSingleColor) {
|
|
79
|
+
//if useSingle color , then check if user has given a palette or not
|
|
80
|
+
// and pick the first color from that or else from our paltette.
|
|
81
|
+
color = _this.props.colors ? _this._createColors()(1) : index_2.getNextColor(1, 0, (_a = _this.props.theme) === null || _a === void 0 ? void 0 : _a.isInverted);
|
|
82
|
+
}
|
|
83
|
+
else {
|
|
84
|
+
color = selectedPoint[0].color
|
|
85
|
+
? selectedPoint[0].color
|
|
86
|
+
: _this.props.colors
|
|
87
|
+
? _this._createColors()(selectedPoint[0].x)
|
|
88
|
+
: index_2.getNextColor(selectedPointIndex, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted);
|
|
89
|
+
}
|
|
90
|
+
// callout data for the bar
|
|
91
|
+
YValueHover.push({
|
|
92
|
+
legend: selectedPoint[0].legend,
|
|
93
|
+
// For HBCWA x and y Values are swapped
|
|
94
|
+
y: selectedPoint[0].x,
|
|
95
|
+
color: color,
|
|
96
|
+
data: selectedPoint[0].yAxisCalloutData,
|
|
97
|
+
yAxisCalloutData: selectedPoint[0].yAxisCalloutData,
|
|
98
|
+
});
|
|
99
|
+
return { YValueHover: YValueHover, hoverXValue: point.yAxisCalloutData || point.y.toString() };
|
|
100
|
+
};
|
|
101
|
+
_this._onBarLeave = function () {
|
|
102
|
+
/**/
|
|
103
|
+
};
|
|
104
|
+
_this._handleChartMouseLeave = function () {
|
|
105
|
+
_this._calloutAnchorPoint = null;
|
|
106
|
+
_this.setState({
|
|
107
|
+
isCalloutVisible: false,
|
|
108
|
+
activeXdataPoint: null,
|
|
109
|
+
YValueHover: [],
|
|
110
|
+
hoverXValue: '',
|
|
111
|
+
});
|
|
112
|
+
};
|
|
113
|
+
_this._onBarFocus = function (point, refArrayIndexNumber, color) {
|
|
114
|
+
if (_this.state.isLegendSelected === false ||
|
|
115
|
+
(_this.state.isLegendSelected && _this.state.selectedLegendTitle === point.legend)) {
|
|
116
|
+
var _a = _this._getCalloutContentForBar(point), YValueHover_1 = _a.YValueHover, hoverXValue_1 = _a.hoverXValue;
|
|
117
|
+
_this._refArray.forEach(function (obj, index) {
|
|
118
|
+
if (refArrayIndexNumber === index) {
|
|
119
|
+
_this.setState({
|
|
120
|
+
refSelected: obj.refElement,
|
|
121
|
+
isCalloutVisible: true,
|
|
122
|
+
selectedLegendTitle: point.legend,
|
|
123
|
+
dataForHoverCard: point.x,
|
|
124
|
+
color: _this.props.useSingleColor ? color : point.color,
|
|
125
|
+
xCalloutValue: point.yAxisCalloutData || point.y.toString(),
|
|
126
|
+
yCalloutValue: point.xAxisCalloutData || point.x.toString(),
|
|
127
|
+
dataPointCalloutProps: point,
|
|
128
|
+
activeXdataPoint: point.x,
|
|
129
|
+
YValueHover: YValueHover_1,
|
|
130
|
+
hoverXValue: hoverXValue_1,
|
|
131
|
+
callOutAccessibilityData: point.callOutAccessibilityData,
|
|
132
|
+
});
|
|
133
|
+
}
|
|
134
|
+
});
|
|
135
|
+
}
|
|
136
|
+
};
|
|
137
|
+
_this._getScales = function (containerHeight, containerWidth, isNumericScale) {
|
|
138
|
+
if (isNumericScale) {
|
|
139
|
+
var xMax = d3_array_1.max(_this._points, function (point) { return point.x; });
|
|
140
|
+
var yMax = d3_array_1.max(_this._points, function (point) { return point.y; });
|
|
141
|
+
var xBarScale = d3_scale_1.scaleLinear()
|
|
142
|
+
.domain(_this._isRtl ? [xMax, 0] : [0, xMax])
|
|
143
|
+
.nice()
|
|
144
|
+
.range([_this.margins.left, containerWidth - _this.margins.right]);
|
|
145
|
+
var yBarScale = d3_scale_1.scaleLinear()
|
|
146
|
+
.domain([0, yMax])
|
|
147
|
+
.range([containerHeight - _this.margins.bottom, _this.margins.top]);
|
|
148
|
+
return { xBarScale: xBarScale, yBarScale: yBarScale };
|
|
149
|
+
}
|
|
150
|
+
else {
|
|
151
|
+
var xMax = d3_array_1.max(_this._points, function (point) { return point.x; });
|
|
152
|
+
// please note these padding default values must be consistent in here
|
|
153
|
+
// and CatrtesianChartBase w for more details refer example
|
|
154
|
+
// http://using-d3js.com/04_07_ordinal_scales.html
|
|
155
|
+
var yBarScale = d3_scale_1.scaleBand()
|
|
156
|
+
.domain(_this._yAxisLabels)
|
|
157
|
+
.range([containerHeight - _this.margins.bottom - _this._barHeight / 2, _this.margins.top + _this._barHeight / 2])
|
|
158
|
+
.padding(_this.props.yAxisPadding || 0);
|
|
159
|
+
var xBarScale = d3_scale_1.scaleLinear()
|
|
160
|
+
.domain(_this._isRtl ? [xMax, 0] : [0, xMax])
|
|
161
|
+
.range([_this.margins.left, containerWidth - _this.margins.right]);
|
|
162
|
+
return { xBarScale: xBarScale, yBarScale: yBarScale };
|
|
163
|
+
}
|
|
164
|
+
};
|
|
165
|
+
_this._closeCallout = function () {
|
|
166
|
+
_this.setState({
|
|
167
|
+
isCalloutVisible: false,
|
|
168
|
+
});
|
|
169
|
+
};
|
|
170
|
+
_this._getLegendData = function (data, palette) {
|
|
171
|
+
var useSingleColor = _this.props.useSingleColor;
|
|
172
|
+
var actions = [];
|
|
173
|
+
data.forEach(function (point, _index) {
|
|
174
|
+
var _a;
|
|
175
|
+
var color = useSingleColor
|
|
176
|
+
? _this.props.colors
|
|
177
|
+
? _this._createColors()(1)
|
|
178
|
+
: index_2.getNextColor(1, 0, (_a = _this.props.theme) === null || _a === void 0 ? void 0 : _a.isInverted)
|
|
179
|
+
: point.color;
|
|
180
|
+
// mapping data to the format Legends component needs
|
|
181
|
+
var legend = {
|
|
182
|
+
title: point.legend,
|
|
183
|
+
color: color,
|
|
184
|
+
action: function () {
|
|
185
|
+
_this._onLegendClick(point.legend);
|
|
186
|
+
},
|
|
187
|
+
hoverAction: function () {
|
|
188
|
+
_this._onLegendHover(point.legend);
|
|
189
|
+
},
|
|
190
|
+
onMouseOutAction: function (isLegendSelected) {
|
|
191
|
+
_this._onLegendLeave(isLegendSelected);
|
|
192
|
+
},
|
|
193
|
+
};
|
|
194
|
+
actions.push(legend);
|
|
195
|
+
});
|
|
196
|
+
var legends = (React.createElement(index_1.Legends, tslib_1.__assign({ legends: actions, enabledWrapLines: _this.props.enabledLegendsWrapLines, overflowProps: _this.props.legendsOverflowProps, focusZonePropsInHoverCard: _this.props.focusZonePropsForLegendsInHoverCard, overflowText: _this.props.legendsOverflowText }, _this.props.legendProps)));
|
|
197
|
+
return legends;
|
|
198
|
+
};
|
|
199
|
+
_this._getAxisData = function (yAxisData) {
|
|
200
|
+
if (yAxisData && yAxisData.yAxisDomainValues.length) {
|
|
201
|
+
// For HBCWA x and y Values are swapped
|
|
202
|
+
var domainValue = yAxisData.yAxisDomainValues;
|
|
203
|
+
_this._xMax = Math.max(domainValue[domainValue.length - 1], _this.props.xMaxValue || 0);
|
|
204
|
+
}
|
|
205
|
+
};
|
|
206
|
+
_this._getAriaLabel = function (point) {
|
|
207
|
+
var _a;
|
|
208
|
+
var xValue = point.xAxisCalloutData || point.x;
|
|
209
|
+
var yValue = point.yAxisCalloutData || point.y;
|
|
210
|
+
return ((_a = point.callOutAccessibilityData) === null || _a === void 0 ? void 0 : _a.ariaLabel) || xValue + ". " + (yValue + ".");
|
|
211
|
+
};
|
|
212
|
+
_this.state = {
|
|
213
|
+
color: '',
|
|
214
|
+
dataForHoverCard: 0,
|
|
215
|
+
isCalloutVisible: false,
|
|
216
|
+
isLegendSelected: false,
|
|
217
|
+
isLegendHovered: false,
|
|
218
|
+
refSelected: null,
|
|
219
|
+
selectedLegendTitle: '',
|
|
220
|
+
xCalloutValue: '',
|
|
221
|
+
yCalloutValue: '',
|
|
222
|
+
activeXdataPoint: null,
|
|
223
|
+
YValueHover: [],
|
|
224
|
+
hoverXValue: '',
|
|
225
|
+
};
|
|
226
|
+
_this._calloutId = Utilities_1.getId('callout');
|
|
227
|
+
_this._tooltipId = Utilities_1.getId('HBCWATooltipID_');
|
|
228
|
+
_this._refArray = [];
|
|
229
|
+
_this._xAxisType =
|
|
230
|
+
_this.props.data && _this.props.data.length > 0
|
|
231
|
+
? index_2.getTypeOfAxis(_this.props.data[0].x, true)
|
|
232
|
+
: index_2.XAxisTypes.NumericAxis;
|
|
233
|
+
_this._yAxisType =
|
|
234
|
+
_this.props.data && _this.props.data.length > 0
|
|
235
|
+
? index_2.getTypeOfAxis(_this.props.data[0].y, false)
|
|
236
|
+
: index_2.YAxisType.StringAxis;
|
|
237
|
+
return _this;
|
|
238
|
+
}
|
|
239
|
+
HorizontalBarChartWithAxisBase.prototype.render = function () {
|
|
240
|
+
var _this = this;
|
|
241
|
+
this._adjustProps();
|
|
242
|
+
var reversedBars = tslib_1.__spreadArray([], this._points).reverse();
|
|
243
|
+
this._yAxisLabels = reversedBars.map(function (point) { return point.y; });
|
|
244
|
+
this._xMax = Math.max(d3_array_1.max(this._points, function (point) { return point.x; }), this.props.xMaxValue || 0);
|
|
245
|
+
var legendBars = this._getLegendData(this._points, this.props.theme.palette);
|
|
246
|
+
this._classNames = getClassNames(this.props.styles, {
|
|
247
|
+
theme: this.props.theme,
|
|
248
|
+
legendColor: this.state.color,
|
|
249
|
+
});
|
|
250
|
+
var calloutProps = tslib_1.__assign(tslib_1.__assign({ isCalloutVisible: this.state.isCalloutVisible, directionalHint: Callout_1.DirectionalHint.topAutoEdge, id: "toolTip" + this._calloutId, target: this.state.refSelected, isBeakVisible: false, gapSpace: 15, color: this.state.color, legend: this.state.selectedLegendTitle, XValue: this.state.xCalloutValue, YValue: this.state.yCalloutValue ? this.state.yCalloutValue : this.state.dataForHoverCard, onDismiss: this._closeCallout, preventDismissOnLostFocus: true }, this.props.calloutProps), index_2.getAccessibleDataObject(this.state.callOutAccessibilityData));
|
|
251
|
+
var tickParams = {
|
|
252
|
+
tickValues: this.props.tickValues,
|
|
253
|
+
tickFormat: this.props.tickFormat,
|
|
254
|
+
};
|
|
255
|
+
return (React.createElement(index_1.CartesianChart, tslib_1.__assign({}, this.props, { points: this._points, chartType: index_2.ChartTypes.HorizontalBarChartWithAxis, xAxisType: this._xAxisType, yAxisType: this._yAxisType, stringDatasetForYAxisDomain: this._yAxisLabels, calloutProps: calloutProps, tickParams: tickParams, legendBars: legendBars, barwidth: this._barHeight, focusZoneDirection: react_focus_1.FocusZoneDirection.vertical, customizedCallout: this._getCustomizedCallout(), getmargins: this._getMargins, getGraphData: this._getGraphData, getAxisData: this._getAxisData, onChartMouseLeave: this._handleChartMouseLeave,
|
|
256
|
+
/* eslint-disable react/jsx-no-bind */
|
|
257
|
+
// eslint-disable-next-line react/no-children-prop
|
|
258
|
+
children: function (props) {
|
|
259
|
+
return (React.createElement(React.Fragment, null,
|
|
260
|
+
React.createElement("g", null, _this._bars)));
|
|
261
|
+
} })));
|
|
262
|
+
};
|
|
263
|
+
HorizontalBarChartWithAxisBase.prototype._adjustProps = function () {
|
|
264
|
+
this._points = this.props.data || [];
|
|
265
|
+
this._barHeight = this.props.barHeight || 32;
|
|
266
|
+
var palette = this.props.theme.palette;
|
|
267
|
+
this._colors = this.props.colors || [palette.blueLight, palette.blue, palette.blueMid, palette.blueDark];
|
|
268
|
+
};
|
|
269
|
+
HorizontalBarChartWithAxisBase.prototype._createColors = function () {
|
|
270
|
+
var _this = this;
|
|
271
|
+
var increment = this._colors.length <= 1 ? 1 : 1 / (this._colors.length - 1);
|
|
272
|
+
var _a = this.props.useSingleColor, useSingleColor = _a === void 0 ? false : _a;
|
|
273
|
+
if (useSingleColor) {
|
|
274
|
+
return function (_p) {
|
|
275
|
+
var _a = _this.props, theme = _a.theme, colors = _a.colors;
|
|
276
|
+
return colors && colors.length > 0 ? colors[0] : theme.palette.blueLight;
|
|
277
|
+
};
|
|
278
|
+
}
|
|
279
|
+
var domainValues = [];
|
|
280
|
+
for (var i = 0; i < this._colors.length; i++) {
|
|
281
|
+
domainValues.push(increment * i * this._xMax);
|
|
282
|
+
}
|
|
283
|
+
var colorScale = d3_scale_1.scaleLinear().domain(domainValues).range(this._colors);
|
|
284
|
+
return colorScale;
|
|
285
|
+
};
|
|
286
|
+
HorizontalBarChartWithAxisBase.prototype._onBarHover = function (point, color, mouseEvent) {
|
|
287
|
+
mouseEvent.persist();
|
|
288
|
+
var _a = this._getCalloutContentForBar(point), YValueHover = _a.YValueHover, hoverXValue = _a.hoverXValue;
|
|
289
|
+
if ((this.state.isLegendSelected === false ||
|
|
290
|
+
(this.state.isLegendSelected && this.state.selectedLegendTitle === point.legend)) &&
|
|
291
|
+
this._calloutAnchorPoint !== point) {
|
|
292
|
+
this._calloutAnchorPoint = point;
|
|
293
|
+
this.setState({
|
|
294
|
+
refSelected: mouseEvent,
|
|
295
|
+
isCalloutVisible: true,
|
|
296
|
+
dataForHoverCard: point.x,
|
|
297
|
+
selectedLegendTitle: point.legend,
|
|
298
|
+
color: this.props.useSingleColor ? color : point.color,
|
|
299
|
+
// To display callout value, if no callout value given, taking given point.x value as a string.
|
|
300
|
+
xCalloutValue: point.yAxisCalloutData || point.y.toString(),
|
|
301
|
+
yCalloutValue: point.xAxisCalloutData || point.x.toString(),
|
|
302
|
+
dataPointCalloutProps: point,
|
|
303
|
+
activeXdataPoint: point.x,
|
|
304
|
+
YValueHover: YValueHover,
|
|
305
|
+
hoverXValue: hoverXValue,
|
|
306
|
+
callOutAccessibilityData: point.callOutAccessibilityData,
|
|
307
|
+
});
|
|
308
|
+
}
|
|
309
|
+
};
|
|
310
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
311
|
+
HorizontalBarChartWithAxisBase.prototype._createNumericBars = function (containerHeight, containerWidth, xElement, yElement) {
|
|
312
|
+
var _this = this;
|
|
313
|
+
var _a = this.props.useSingleColor, useSingleColor = _a === void 0 ? false : _a;
|
|
314
|
+
var _b = this._getScales(containerHeight, containerWidth, true), xBarScale = _b.xBarScale, yBarScale = _b.yBarScale;
|
|
315
|
+
var sortedBars = tslib_1.__spreadArray([], this._points);
|
|
316
|
+
sortedBars.sort(function (a, b) {
|
|
317
|
+
var aValue = typeof a.y === 'number' ? a.y : parseFloat(a.y);
|
|
318
|
+
var bValue = typeof b.y === 'number' ? b.y : parseFloat(b.y);
|
|
319
|
+
return bValue - aValue;
|
|
320
|
+
});
|
|
321
|
+
var bars = sortedBars.map(function (point, index) {
|
|
322
|
+
var _a, _b;
|
|
323
|
+
var shouldHighlight = true;
|
|
324
|
+
if (_this.state.isLegendHovered || _this.state.isLegendSelected) {
|
|
325
|
+
shouldHighlight = _this.state.selectedLegendTitle === point.legend;
|
|
326
|
+
}
|
|
327
|
+
_this._classNames = getClassNames(_this.props.styles, {
|
|
328
|
+
theme: _this.props.theme,
|
|
329
|
+
legendColor: _this.state.color,
|
|
330
|
+
shouldHighlight: shouldHighlight,
|
|
331
|
+
});
|
|
332
|
+
var barHeight = Math.max(yBarScale(point.y), 0);
|
|
333
|
+
if (barHeight < 1) {
|
|
334
|
+
return React.createElement(React.Fragment, { key: point.x }, " ");
|
|
335
|
+
}
|
|
336
|
+
var color;
|
|
337
|
+
if (useSingleColor) {
|
|
338
|
+
//if useSingle color , then check if user has given a palette or not
|
|
339
|
+
// and pick the first color from that or else from our paltette.
|
|
340
|
+
color = _this.props.colors ? _this._createColors()(1) : index_2.getNextColor(1, 0, (_a = _this.props.theme) === null || _a === void 0 ? void 0 : _a.isInverted);
|
|
341
|
+
}
|
|
342
|
+
else {
|
|
343
|
+
color = _this.props.colors
|
|
344
|
+
? _this._createColors()(point.x)
|
|
345
|
+
: index_2.getNextColor(index, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted);
|
|
346
|
+
}
|
|
347
|
+
return (React.createElement("rect", { key: point.y, x: _this._isRtl ? xBarScale(point.x) : _this.margins.left, className: _this._classNames.opacityChangeOnHover, y: yBarScale(point.y) - _this._barHeight / 2, "data-is-focusable": true, width: _this._isRtl
|
|
348
|
+
? containerWidth - _this.margins.right - Math.max(xBarScale(point.x), 0)
|
|
349
|
+
: Math.max(xBarScale(point.x), 0) - _this.margins.left, height: _this._barHeight, ref: function (e) {
|
|
350
|
+
_this._refCallback(e, point.legend);
|
|
351
|
+
}, onClick: point.onClick, onMouseOver: _this._onBarHover.bind(_this, point, color), "aria-label": _this._getAriaLabel(point), role: "img", "aria-labelledby": "toolTip" + _this._calloutId, onMouseLeave: _this._onBarLeave, onFocus: _this._onBarFocus.bind(_this, point, index, color), onBlur: _this._onBarLeave, fill: point.color && !useSingleColor ? point.color : color }));
|
|
352
|
+
});
|
|
353
|
+
return bars;
|
|
354
|
+
};
|
|
355
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
356
|
+
HorizontalBarChartWithAxisBase.prototype._tooltipOfYAxislabels = function (ytooltipProps) {
|
|
357
|
+
var _this = this;
|
|
358
|
+
var tooltipCls = ytooltipProps.tooltipCls, yAxis = ytooltipProps.yAxis, id = ytooltipProps.id;
|
|
359
|
+
if (yAxis === null) {
|
|
360
|
+
return null;
|
|
361
|
+
}
|
|
362
|
+
var div = d3_selection_1.select('body').append('div').attr('id', id).attr('class', tooltipCls).style('opacity', 0);
|
|
363
|
+
var aa = yAxis.selectAll('#BaseSpan')._groups[0];
|
|
364
|
+
var baseSpanLength = aa && Object.keys(aa).length;
|
|
365
|
+
var originalDataArray = [];
|
|
366
|
+
for (var i = 0; i < baseSpanLength; i++) {
|
|
367
|
+
var originalData = aa[i].dataset && Object.values(aa[i].dataset)[0];
|
|
368
|
+
originalDataArray.push(originalData);
|
|
369
|
+
}
|
|
370
|
+
var tickObject = yAxis.selectAll('.tick')._groups[0];
|
|
371
|
+
var tickObjectLength = tickObject && Object.keys(tickObject).length;
|
|
372
|
+
var _loop_1 = function (i) {
|
|
373
|
+
var d1 = tickObject[i];
|
|
374
|
+
d3_selection_1.select(d1)
|
|
375
|
+
.on('mouseover', function (d) {
|
|
376
|
+
if (!_this.state.tooltipElement) {
|
|
377
|
+
div.style('opacity', 0.9);
|
|
378
|
+
div
|
|
379
|
+
.html(originalDataArray[i])
|
|
380
|
+
.style('left', d3_selection_1.event.pageX + 'px')
|
|
381
|
+
.style('top', d3_selection_1.event.pageY - 28 + 'px');
|
|
382
|
+
}
|
|
383
|
+
})
|
|
384
|
+
.on('mouseout', function (d) {
|
|
385
|
+
div.style('opacity', 0);
|
|
386
|
+
});
|
|
387
|
+
};
|
|
388
|
+
for (var i = 0; i < tickObjectLength; i++) {
|
|
389
|
+
_loop_1(i);
|
|
390
|
+
}
|
|
391
|
+
};
|
|
392
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
393
|
+
HorizontalBarChartWithAxisBase.prototype._createStringBars = function (containerHeight, containerWidth, xElement, yElement) {
|
|
394
|
+
var _this = this;
|
|
395
|
+
var _a = this._getScales(containerHeight, containerWidth, false), xBarScale = _a.xBarScale, yBarScale = _a.yBarScale;
|
|
396
|
+
var _b = this.props.useSingleColor, useSingleColor = _b === void 0 ? false : _b;
|
|
397
|
+
var bars = this._points.map(function (point, index) {
|
|
398
|
+
var _a, _b;
|
|
399
|
+
var barHeight = Math.max(yBarScale(point.y), 0);
|
|
400
|
+
if (barHeight < 1) {
|
|
401
|
+
return React.createElement(React.Fragment, { key: point.x }, " ");
|
|
402
|
+
}
|
|
403
|
+
var color;
|
|
404
|
+
if (useSingleColor) {
|
|
405
|
+
//if useSingle color , then check if user has given a palette or not
|
|
406
|
+
// and pick the first color from that or else from our paltette.
|
|
407
|
+
color = _this.props.colors ? _this._createColors()(1) : index_2.getNextColor(1, 0, (_a = _this.props.theme) === null || _a === void 0 ? void 0 : _a.isInverted);
|
|
408
|
+
}
|
|
409
|
+
else {
|
|
410
|
+
color = _this.props.colors
|
|
411
|
+
? _this._createColors()(point.x)
|
|
412
|
+
: index_2.getNextColor(index, 0, (_b = _this.props.theme) === null || _b === void 0 ? void 0 : _b.isInverted);
|
|
413
|
+
}
|
|
414
|
+
return (React.createElement("rect", { key: point.x, x: _this._isRtl ? xBarScale(point.x) : _this.margins.left, y: yBarScale(point.y) + _this._barHeight / 2, width: _this._isRtl
|
|
415
|
+
? containerWidth - _this.margins.right - Math.max(xBarScale(point.x), 0)
|
|
416
|
+
: Math.max(xBarScale(point.x), 0) - _this.margins.left, height: _this._barHeight, "aria-labelledby": "toolTip" + _this._calloutId, "aria-label": _this._getAriaLabel(point), role: "img", ref: function (e) {
|
|
417
|
+
_this._refCallback(e, point.legend);
|
|
418
|
+
}, onClick: point.onClick, onMouseOver: _this._onBarHover.bind(_this, point, color), onMouseLeave: _this._onBarLeave, onBlur: _this._onBarLeave, "data-is-focusable": true, onFocus: _this._onBarFocus.bind(_this, point, index, color), fill: point.color && !useSingleColor ? point.color : color }));
|
|
419
|
+
});
|
|
420
|
+
// Removing un wanted tooltip div from DOM, when prop not provided, for proper cleanup
|
|
421
|
+
// of unwanted DOM elements, to prevent flacky behaviour in tooltips , that might occur
|
|
422
|
+
// in creating tooltips when tooltips are enabled( as we try to recreate a tspan with this._tooltipId)
|
|
423
|
+
if (!this.props.showYAxisLablesTooltip) {
|
|
424
|
+
try {
|
|
425
|
+
document.getElementById(this._tooltipId) && document.getElementById(this._tooltipId).remove();
|
|
426
|
+
//eslint-disable-next-line no-empty
|
|
427
|
+
}
|
|
428
|
+
catch (e) { }
|
|
429
|
+
}
|
|
430
|
+
// Used to display tooltip at y axis labels.
|
|
431
|
+
if (this.props.showYAxisLablesTooltip) {
|
|
432
|
+
var yAxisElement = d3_selection_1.select(yElement).call(yBarScale);
|
|
433
|
+
if (!this.state.tooltipElement) {
|
|
434
|
+
try {
|
|
435
|
+
document.getElementById(this._tooltipId) && document.getElementById(this._tooltipId).remove();
|
|
436
|
+
//eslint-disable-next-line no-empty
|
|
437
|
+
}
|
|
438
|
+
catch (e) { }
|
|
439
|
+
}
|
|
440
|
+
var ytooltipProps = {
|
|
441
|
+
tooltipCls: this._classNames.tooltip,
|
|
442
|
+
id: this._tooltipId,
|
|
443
|
+
yAxis: yAxisElement,
|
|
444
|
+
};
|
|
445
|
+
yAxisElement && this._tooltipOfYAxislabels(ytooltipProps);
|
|
446
|
+
}
|
|
447
|
+
return bars;
|
|
448
|
+
};
|
|
449
|
+
HorizontalBarChartWithAxisBase.prototype._onLegendClick = function (customMessage) {
|
|
450
|
+
if (this.state.isLegendSelected) {
|
|
451
|
+
if (this.state.selectedLegendTitle === customMessage) {
|
|
452
|
+
this.setState({
|
|
453
|
+
isLegendSelected: false,
|
|
454
|
+
selectedLegendTitle: customMessage,
|
|
455
|
+
});
|
|
456
|
+
}
|
|
457
|
+
else {
|
|
458
|
+
this.setState({
|
|
459
|
+
selectedLegendTitle: customMessage,
|
|
460
|
+
});
|
|
461
|
+
}
|
|
462
|
+
}
|
|
463
|
+
else {
|
|
464
|
+
this.setState({
|
|
465
|
+
isLegendSelected: true,
|
|
466
|
+
selectedLegendTitle: customMessage,
|
|
467
|
+
});
|
|
468
|
+
}
|
|
469
|
+
};
|
|
470
|
+
HorizontalBarChartWithAxisBase.prototype._onLegendHover = function (customMessage) {
|
|
471
|
+
if (this.state.isLegendSelected === false) {
|
|
472
|
+
this.setState({
|
|
473
|
+
isLegendHovered: true,
|
|
474
|
+
selectedLegendTitle: customMessage,
|
|
475
|
+
});
|
|
476
|
+
}
|
|
477
|
+
};
|
|
478
|
+
HorizontalBarChartWithAxisBase.prototype._onLegendLeave = function (isLegendFocused) {
|
|
479
|
+
if (!!isLegendFocused || this.state.isLegendSelected === false) {
|
|
480
|
+
this.setState({
|
|
481
|
+
isLegendHovered: false,
|
|
482
|
+
selectedLegendTitle: '',
|
|
483
|
+
isLegendSelected: isLegendFocused ? false : this.state.isLegendSelected,
|
|
484
|
+
});
|
|
485
|
+
}
|
|
486
|
+
};
|
|
487
|
+
return HorizontalBarChartWithAxisBase;
|
|
488
|
+
}(React.Component));
|
|
489
|
+
exports.HorizontalBarChartWithAxisBase = HorizontalBarChartWithAxisBase;
|
|
490
|
+
//# sourceMappingURL=HorizontalBarChartWithAxis.base.js.map
|
package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HorizontalBarChartWithAxis.base.js","sourceRoot":"../src/","sources":["components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.base.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { max as d3Max } from 'd3-array';\nimport { select as d3Select, event as d3Event } from 'd3-selection';\nimport { scaleLinear as d3ScaleLinear, ScaleLinear as D3ScaleLinear, scaleBand as d3ScaleBand } from 'd3-scale';\nimport { classNamesFunction, getId, getRTL } from '@fluentui/react/lib/Utilities';\nimport { IProcessedStyleSet, IPalette } from '@fluentui/react/lib/Styling';\nimport { DirectionalHint } from '@fluentui/react/lib/Callout';\nimport {\n IAccessibilityProps,\n CartesianChart,\n ChartHoverCard,\n IBasestate,\n IMargins,\n ILegend,\n IRefArrayData,\n IHorizontalBarChartWithAxisProps,\n IHorizontalBarChartWithAxisStyleProps,\n IHorizontalBarChartWithAxisStyles,\n IHorizontalBarChartWithAxisDataPoint,\n Legends,\n IChildProps,\n IYValueHover,\n} from '../../index';\nimport { FocusZoneDirection } from '@fluentui/react-focus';\nimport {\n ChartTypes,\n IAxisData,\n getAccessibleDataObject,\n YAxisType,\n XAxisTypes,\n NumericAxis,\n StringAxis,\n getTypeOfAxis,\n getNextColor,\n} from '../../utilities/index';\n\nconst getClassNames = classNamesFunction<IHorizontalBarChartWithAxisStyleProps, IHorizontalBarChartWithAxisStyles>();\nexport interface IHorizontalBarChartWithAxisState extends IBasestate {\n selectedLegendTitle: string;\n dataPointCalloutProps?: IHorizontalBarChartWithAxisDataPoint; // define this in hover and focus\n /**\n * data point of x, where rectangle is hovered or focused\n */\n activeXdataPoint: number | null;\n YValueHover: IYValueHover[];\n hoverXValue?: string | number | null;\n callOutAccessibilityData?: IAccessibilityProps;\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n tooltipElement?: any;\n}\n\ntype ColorScale = (_p?: number) => string;\n\nexport class HorizontalBarChartWithAxisBase extends React.Component<\n IHorizontalBarChartWithAxisProps,\n IHorizontalBarChartWithAxisState\n> {\n private _points: IHorizontalBarChartWithAxisDataPoint[];\n private _barHeight: number;\n private _colors: string[];\n private _classNames: IProcessedStyleSet<IHorizontalBarChartWithAxisStyles>;\n private _refArray: IRefArrayData[];\n private _calloutId: string;\n private margins: IMargins;\n private _isRtl: boolean = getRTL();\n private _bars: JSX.Element[];\n private _yAxisLabels: string[];\n private _xMax: number;\n private _tooltipId: string;\n private _xAxisType: XAxisTypes;\n private _yAxisType: YAxisType;\n private _calloutAnchorPoint: IHorizontalBarChartWithAxisDataPoint | null;\n\n public constructor(props: IHorizontalBarChartWithAxisProps) {\n super(props);\n this.state = {\n color: '',\n dataForHoverCard: 0,\n isCalloutVisible: false,\n isLegendSelected: false,\n isLegendHovered: false,\n refSelected: null,\n selectedLegendTitle: '',\n xCalloutValue: '',\n yCalloutValue: '',\n activeXdataPoint: null,\n YValueHover: [],\n hoverXValue: '',\n };\n this._calloutId = getId('callout');\n this._tooltipId = getId('HBCWATooltipID_');\n this._refArray = [];\n this._xAxisType =\n this.props.data! && this.props.data!.length > 0\n ? (getTypeOfAxis(this.props.data![0].x, true) as XAxisTypes)\n : XAxisTypes.NumericAxis;\n this._yAxisType =\n this.props.data! && this.props.data!.length > 0\n ? (getTypeOfAxis(this.props.data![0].y, false) as YAxisType)\n : YAxisType.StringAxis;\n }\n\n public render(): JSX.Element {\n this._adjustProps();\n const reversedBars = [...this._points].reverse();\n this._yAxisLabels = reversedBars.map((point: IHorizontalBarChartWithAxisDataPoint) => point.y as string);\n this._xMax = Math.max(\n d3Max(this._points, (point: IHorizontalBarChartWithAxisDataPoint) => point.x)!,\n this.props.xMaxValue || 0,\n );\n const legendBars: JSX.Element = this._getLegendData(this._points, this.props.theme!.palette);\n this._classNames = getClassNames(this.props.styles!, {\n theme: this.props.theme!,\n legendColor: this.state.color,\n });\n const calloutProps = {\n isCalloutVisible: this.state.isCalloutVisible,\n directionalHint: DirectionalHint.topAutoEdge,\n id: `toolTip${this._calloutId}`,\n target: this.state.refSelected,\n isBeakVisible: false,\n gapSpace: 15,\n color: this.state.color,\n legend: this.state.selectedLegendTitle,\n XValue: this.state.xCalloutValue,\n YValue: this.state.yCalloutValue ? this.state.yCalloutValue : this.state.dataForHoverCard,\n onDismiss: this._closeCallout,\n preventDismissOnLostFocus: true,\n ...this.props.calloutProps,\n ...getAccessibleDataObject(this.state.callOutAccessibilityData),\n };\n const tickParams = {\n tickValues: this.props.tickValues,\n tickFormat: this.props.tickFormat,\n };\n return (\n <CartesianChart\n {...this.props}\n points={this._points}\n chartType={ChartTypes.HorizontalBarChartWithAxis}\n xAxisType={this._xAxisType}\n yAxisType={this._yAxisType}\n stringDatasetForYAxisDomain={this._yAxisLabels}\n calloutProps={calloutProps}\n tickParams={tickParams}\n legendBars={legendBars}\n barwidth={this._barHeight}\n focusZoneDirection={FocusZoneDirection.vertical}\n customizedCallout={this._getCustomizedCallout()}\n getmargins={this._getMargins}\n getGraphData={this._getGraphData}\n getAxisData={this._getAxisData}\n onChartMouseLeave={this._handleChartMouseLeave}\n /* eslint-disable react/jsx-no-bind */\n // eslint-disable-next-line react/no-children-prop\n children={(props: IChildProps) => {\n return (\n <>\n <g>{this._bars}</g>\n </>\n );\n }}\n />\n );\n }\n\n private _adjustProps(): void {\n this._points = this.props.data || [];\n this._barHeight = this.props.barHeight || 32;\n const { palette } = this.props.theme!;\n this._colors = this.props.colors || [palette.blueLight, palette.blue, palette.blueMid, palette.blueDark];\n }\n\n private _getMargins = (margins: IMargins) => {\n this.margins = margins;\n };\n\n private _renderContentForOnlyBars = (point: IHorizontalBarChartWithAxisDataPoint): JSX.Element => {\n const { useSingleColor = false } = this.props;\n let selectedPointIndex = 0;\n this.props.data!.forEach((yDataPoint: IHorizontalBarChartWithAxisDataPoint, index: number) => {\n if (yDataPoint.y === point.y) {\n selectedPointIndex = index;\n }\n });\n let color: string;\n if (useSingleColor) {\n //if useSingle color , then check if user has given a palette or not\n // and pick the first color from that or else from our paltette.\n color = this.props.colors ? this._createColors()(1) : getNextColor(1, 0, this.props.theme?.isInverted);\n } else {\n color = point.color\n ? point.color\n : this.props.colors\n ? this._createColors()(point.x)\n : getNextColor(selectedPointIndex, 0, this.props.theme?.isInverted);\n }\n return (\n <>\n <ChartHoverCard\n XValue={point.xAxisCalloutData || point.x.toString()}\n Legend={point.legend}\n YValue={point.yAxisCalloutData || point.y}\n color={color}\n culture={this.props.culture}\n />\n </>\n );\n };\n\n private _renderCallout = (props?: IHorizontalBarChartWithAxisDataPoint): JSX.Element | null => {\n return props ? this._renderContentForOnlyBars(props) : null;\n };\n\n private _getCustomizedCallout = () => {\n return this.props.onRenderCalloutPerDataPoint\n ? this.props.onRenderCalloutPerDataPoint(this.state.dataPointCalloutProps, this._renderCallout)\n : null;\n };\n\n private _getGraphData = (\n xScale: NumericAxis,\n yScale: NumericAxis | StringAxis,\n containerHeight: number,\n containerWidth: number,\n xElement?: SVGElement | null,\n yElement?: SVGElement | null,\n ) => {\n return (this._bars =\n this._yAxisType === YAxisType.NumericAxis\n ? this._createNumericBars(containerHeight, containerWidth, xElement!, yElement!)\n : this._createStringBars(containerHeight, containerWidth, xElement!, yElement!));\n };\n\n private _createColors(): D3ScaleLinear<string, string> | ColorScale {\n const increment = this._colors.length <= 1 ? 1 : 1 / (this._colors.length - 1);\n const { useSingleColor = false } = this.props;\n if (useSingleColor) {\n return (_p?: number) => {\n const { theme, colors } = this.props;\n return colors && colors.length > 0 ? colors[0] : theme!.palette.blueLight;\n };\n }\n const domainValues = [];\n for (let i = 0; i < this._colors.length; i++) {\n domainValues.push(increment * i * this._xMax);\n }\n const colorScale = d3ScaleLinear<string>().domain(domainValues).range(this._colors);\n return colorScale;\n }\n\n private _refCallback = (element: SVGRectElement, legendTitle: string): void => {\n this._refArray.push({ index: legendTitle, refElement: element });\n };\n\n private _getCalloutContentForBar = (\n point: IHorizontalBarChartWithAxisDataPoint,\n ): { YValueHover: IYValueHover[]; hoverXValue: string | number | null } => {\n const YValueHover: IYValueHover[] = [];\n const { useSingleColor = false } = this.props;\n const { data } = this.props;\n const selectedPoint = data!.filter((yDataPoint: IHorizontalBarChartWithAxisDataPoint) => yDataPoint.y === point.y);\n let selectedPointIndex = 0;\n data!.forEach((yDataPoint: IHorizontalBarChartWithAxisDataPoint, index: number) => {\n if (yDataPoint.y === point.y) {\n selectedPointIndex = index;\n }\n });\n let color: string;\n if (useSingleColor) {\n //if useSingle color , then check if user has given a palette or not\n // and pick the first color from that or else from our paltette.\n color = this.props.colors ? this._createColors()(1) : getNextColor(1, 0, this.props.theme?.isInverted);\n } else {\n color = selectedPoint[0].color\n ? selectedPoint[0].color\n : this.props.colors\n ? this._createColors()(selectedPoint[0].x)\n : getNextColor(selectedPointIndex, 0, this.props.theme?.isInverted);\n }\n // callout data for the bar\n YValueHover.push({\n legend: selectedPoint[0].legend,\n // For HBCWA x and y Values are swapped\n y: selectedPoint[0].x,\n color,\n data: selectedPoint[0].yAxisCalloutData,\n yAxisCalloutData: selectedPoint[0].yAxisCalloutData,\n });\n return { YValueHover, hoverXValue: point.yAxisCalloutData || point.y.toString() };\n };\n\n private _onBarHover(\n point: IHorizontalBarChartWithAxisDataPoint,\n color: string,\n mouseEvent: React.MouseEvent<SVGElement>,\n ): void {\n mouseEvent.persist();\n\n const { YValueHover, hoverXValue } = this._getCalloutContentForBar(point);\n if (\n (this.state.isLegendSelected === false ||\n (this.state.isLegendSelected && this.state.selectedLegendTitle === point.legend)) &&\n this._calloutAnchorPoint !== point\n ) {\n this._calloutAnchorPoint = point;\n this.setState({\n refSelected: mouseEvent,\n isCalloutVisible: true,\n dataForHoverCard: point.x,\n selectedLegendTitle: point.legend!,\n color: this.props.useSingleColor ? color : point.color,\n // To display callout value, if no callout value given, taking given point.x value as a string.\n xCalloutValue: point.yAxisCalloutData! || point.y.toString(),\n yCalloutValue: point.xAxisCalloutData || point.x.toString(),\n dataPointCalloutProps: point,\n activeXdataPoint: point.x,\n YValueHover,\n hoverXValue,\n callOutAccessibilityData: point.callOutAccessibilityData,\n });\n }\n }\n\n private _onBarLeave = (): void => {\n /**/\n };\n\n private _handleChartMouseLeave = (): void => {\n this._calloutAnchorPoint = null;\n this.setState({\n isCalloutVisible: false,\n activeXdataPoint: null,\n YValueHover: [],\n hoverXValue: '',\n });\n };\n\n private _onBarFocus = (\n point: IHorizontalBarChartWithAxisDataPoint,\n refArrayIndexNumber: number,\n color: string,\n ): void => {\n if (\n this.state.isLegendSelected === false ||\n (this.state.isLegendSelected && this.state.selectedLegendTitle === point.legend)\n ) {\n const { YValueHover, hoverXValue } = this._getCalloutContentForBar(point);\n this._refArray.forEach((obj: IRefArrayData, index: number) => {\n if (refArrayIndexNumber === index) {\n this.setState({\n refSelected: obj.refElement,\n isCalloutVisible: true,\n selectedLegendTitle: point.legend!,\n dataForHoverCard: point.x,\n color: this.props.useSingleColor ? color : point.color,\n xCalloutValue: point.yAxisCalloutData || point.y.toString(),\n yCalloutValue: point.xAxisCalloutData! || point.x.toString(),\n dataPointCalloutProps: point,\n activeXdataPoint: point.x,\n YValueHover,\n hoverXValue,\n callOutAccessibilityData: point.callOutAccessibilityData,\n });\n }\n });\n }\n };\n\n private _getScales = (\n containerHeight: number,\n containerWidth: number,\n isNumericScale: boolean,\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ): { xBarScale: any; yBarScale: any } => {\n if (isNumericScale) {\n const xMax = d3Max(this._points, (point: IHorizontalBarChartWithAxisDataPoint) => point.x as number)!;\n const yMax = d3Max(this._points, (point: IHorizontalBarChartWithAxisDataPoint) => point.y as number)!;\n const xBarScale = d3ScaleLinear()\n .domain(this._isRtl ? [xMax, 0] : [0, xMax])\n .nice()\n .range([this.margins.left!, containerWidth - this.margins.right!]);\n const yBarScale = d3ScaleLinear()\n .domain([0, yMax])\n .range([containerHeight - this.margins.bottom!, this.margins.top!]);\n return { xBarScale, yBarScale };\n } else {\n const xMax = d3Max(this._points, (point: IHorizontalBarChartWithAxisDataPoint) => point.x as number)!;\n // please note these padding default values must be consistent in here\n // and CatrtesianChartBase w for more details refer example\n // http://using-d3js.com/04_07_ordinal_scales.html\n const yBarScale = d3ScaleBand()\n .domain(this._yAxisLabels)\n .range([containerHeight - this.margins.bottom! - this._barHeight / 2, this.margins.top! + this._barHeight / 2])\n .padding(this.props.yAxisPadding || 0);\n\n const xBarScale = d3ScaleLinear()\n .domain(this._isRtl ? [xMax, 0] : [0, xMax])\n .range([this.margins.left!, containerWidth - this.margins.right!]);\n return { xBarScale, yBarScale };\n }\n };\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _createNumericBars(\n containerHeight: number,\n containerWidth: number,\n xElement: SVGElement,\n yElement: SVGElement,\n ): JSX.Element[] {\n const { useSingleColor = false } = this.props;\n const { xBarScale, yBarScale } = this._getScales(containerHeight, containerWidth, true);\n const sortedBars: IHorizontalBarChartWithAxisDataPoint[] = [...this._points];\n sortedBars.sort((a, b) => {\n const aValue = typeof a.y === 'number' ? a.y : parseFloat(a.y);\n const bValue = typeof b.y === 'number' ? b.y : parseFloat(b.y);\n return bValue - aValue;\n });\n const bars = sortedBars.map((point: IHorizontalBarChartWithAxisDataPoint, index: number) => {\n let shouldHighlight = true;\n if (this.state.isLegendHovered || this.state.isLegendSelected) {\n shouldHighlight = this.state.selectedLegendTitle === point.legend;\n }\n this._classNames = getClassNames(this.props.styles!, {\n theme: this.props.theme!,\n legendColor: this.state.color,\n shouldHighlight: shouldHighlight,\n });\n const barHeight: number = Math.max(yBarScale(point.y), 0);\n if (barHeight < 1) {\n return <React.Fragment key={point.x}> </React.Fragment>;\n }\n let color: string;\n if (useSingleColor) {\n //if useSingle color , then check if user has given a palette or not\n // and pick the first color from that or else from our paltette.\n color = this.props.colors ? this._createColors()(1) : getNextColor(1, 0, this.props.theme?.isInverted);\n } else {\n color = this.props.colors\n ? this._createColors()(point.x)\n : getNextColor(index, 0, this.props.theme?.isInverted);\n }\n return (\n <rect\n key={point.y}\n x={this._isRtl ? xBarScale(point.x) : this.margins.left!}\n className={this._classNames.opacityChangeOnHover}\n y={yBarScale(point.y) - this._barHeight / 2}\n data-is-focusable={true}\n width={\n this._isRtl\n ? containerWidth - this.margins.right! - Math.max(xBarScale(point.x), 0)\n : Math.max(xBarScale(point.x), 0) - this.margins.left!\n }\n height={this._barHeight}\n ref={(e: SVGRectElement) => {\n this._refCallback(e, point.legend!);\n }}\n onClick={point.onClick}\n onMouseOver={this._onBarHover.bind(this, point, color)}\n aria-label={this._getAriaLabel(point)}\n role=\"img\"\n aria-labelledby={`toolTip${this._calloutId}`}\n onMouseLeave={this._onBarLeave}\n onFocus={this._onBarFocus.bind(this, point, index, color)}\n onBlur={this._onBarLeave}\n fill={point.color && !useSingleColor ? point.color : color}\n />\n );\n });\n return bars;\n }\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _tooltipOfYAxislabels(ytooltipProps: any) {\n const { tooltipCls, yAxis, id } = ytooltipProps;\n if (yAxis === null) {\n return null;\n }\n const div = d3Select('body').append('div').attr('id', id).attr('class', tooltipCls).style('opacity', 0);\n const aa = yAxis!.selectAll('#BaseSpan')._groups[0];\n const baseSpanLength = aa && Object.keys(aa)!.length;\n const originalDataArray: string[] = [];\n for (let i = 0; i < baseSpanLength; i++) {\n const originalData = aa[i].dataset && (Object.values(aa[i].dataset)[0] as string);\n originalDataArray.push(originalData);\n }\n const tickObject = yAxis!.selectAll('.tick')._groups[0];\n const tickObjectLength = tickObject && Object.keys(tickObject)!.length;\n for (let i = 0; i < tickObjectLength; i++) {\n const d1 = tickObject[i];\n d3Select(d1)\n .on('mouseover', d => {\n if (!this.state.tooltipElement) {\n div.style('opacity', 0.9);\n div\n .html(originalDataArray[i])\n .style('left', d3Event.pageX + 'px')\n .style('top', d3Event.pageY - 28 + 'px');\n }\n })\n .on('mouseout', d => {\n div.style('opacity', 0);\n });\n }\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n private _createStringBars(\n containerHeight: number,\n containerWidth: number,\n xElement: SVGElement,\n yElement: SVGElement,\n ): JSX.Element[] {\n const { xBarScale, yBarScale } = this._getScales(containerHeight, containerWidth, false);\n const { useSingleColor = false } = this.props;\n const bars = this._points.map((point: IHorizontalBarChartWithAxisDataPoint, index: number) => {\n const barHeight: number = Math.max(yBarScale(point.y), 0);\n if (barHeight < 1) {\n return <React.Fragment key={point.x}> </React.Fragment>;\n }\n let color: string;\n if (useSingleColor) {\n //if useSingle color , then check if user has given a palette or not\n // and pick the first color from that or else from our paltette.\n color = this.props.colors ? this._createColors()(1) : getNextColor(1, 0, this.props.theme?.isInverted);\n } else {\n color = this.props.colors\n ? this._createColors()(point.x)\n : getNextColor(index, 0, this.props.theme?.isInverted);\n }\n\n return (\n <rect\n key={point.x}\n x={this._isRtl ? xBarScale(point.x) : this.margins.left!}\n y={yBarScale(point.y) + this._barHeight / 2}\n width={\n this._isRtl\n ? containerWidth - this.margins.right! - Math.max(xBarScale(point.x), 0)\n : Math.max(xBarScale(point.x), 0) - this.margins.left!\n }\n height={this._barHeight}\n aria-labelledby={`toolTip${this._calloutId}`}\n aria-label={this._getAriaLabel(point)}\n role=\"img\"\n ref={(e: SVGRectElement) => {\n this._refCallback(e, point.legend!);\n }}\n onClick={point.onClick}\n onMouseOver={this._onBarHover.bind(this, point, color)}\n onMouseLeave={this._onBarLeave}\n onBlur={this._onBarLeave}\n data-is-focusable={true}\n onFocus={this._onBarFocus.bind(this, point, index, color)}\n fill={point.color && !useSingleColor ? point.color : color}\n />\n );\n });\n\n // Removing un wanted tooltip div from DOM, when prop not provided, for proper cleanup\n // of unwanted DOM elements, to prevent flacky behaviour in tooltips , that might occur\n // in creating tooltips when tooltips are enabled( as we try to recreate a tspan with this._tooltipId)\n if (!this.props.showYAxisLablesTooltip) {\n try {\n document.getElementById(this._tooltipId) && document.getElementById(this._tooltipId)!.remove();\n //eslint-disable-next-line no-empty\n } catch (e) {}\n }\n // Used to display tooltip at y axis labels.\n if (this.props.showYAxisLablesTooltip) {\n const yAxisElement = d3Select(yElement).call(yBarScale);\n if (!this.state.tooltipElement) {\n try {\n document.getElementById(this._tooltipId) && document.getElementById(this._tooltipId)!.remove();\n //eslint-disable-next-line no-empty\n } catch (e) {}\n }\n const ytooltipProps = {\n tooltipCls: this._classNames.tooltip!,\n id: this._tooltipId,\n yAxis: yAxisElement,\n };\n yAxisElement && this._tooltipOfYAxislabels(ytooltipProps);\n }\n return bars;\n }\n\n private _closeCallout = () => {\n this.setState({\n isCalloutVisible: false,\n });\n };\n\n private _onLegendClick(customMessage: string): void {\n if (this.state.isLegendSelected) {\n if (this.state.selectedLegendTitle === customMessage) {\n this.setState({\n isLegendSelected: false,\n selectedLegendTitle: customMessage,\n });\n } else {\n this.setState({\n selectedLegendTitle: customMessage,\n });\n }\n } else {\n this.setState({\n isLegendSelected: true,\n selectedLegendTitle: customMessage,\n });\n }\n }\n\n private _onLegendHover(customMessage: string): void {\n if (this.state.isLegendSelected === false) {\n this.setState({\n isLegendHovered: true,\n selectedLegendTitle: customMessage,\n });\n }\n }\n\n private _onLegendLeave(isLegendFocused?: boolean): void {\n if (!!isLegendFocused || this.state.isLegendSelected === false) {\n this.setState({\n isLegendHovered: false,\n selectedLegendTitle: '',\n isLegendSelected: isLegendFocused ? false : this.state.isLegendSelected,\n });\n }\n }\n\n private _getLegendData = (data: IHorizontalBarChartWithAxisDataPoint[], palette: IPalette): JSX.Element => {\n const { useSingleColor } = this.props;\n const actions: ILegend[] = [];\n data.forEach((point: IHorizontalBarChartWithAxisDataPoint, _index: number) => {\n const color: string = useSingleColor\n ? this.props.colors\n ? this._createColors()(1)\n : getNextColor(1, 0, this.props.theme?.isInverted)\n : point.color!;\n // mapping data to the format Legends component needs\n const legend: ILegend = {\n title: point.legend!,\n color: color,\n action: () => {\n this._onLegendClick(point.legend!);\n },\n hoverAction: () => {\n this._onLegendHover(point.legend!);\n },\n onMouseOutAction: (isLegendSelected?: boolean) => {\n this._onLegendLeave(isLegendSelected);\n },\n };\n actions.push(legend);\n });\n const legends = (\n <Legends\n legends={actions}\n enabledWrapLines={this.props.enabledLegendsWrapLines}\n overflowProps={this.props.legendsOverflowProps}\n focusZonePropsInHoverCard={this.props.focusZonePropsForLegendsInHoverCard}\n overflowText={this.props.legendsOverflowText}\n {...this.props.legendProps}\n />\n );\n return legends;\n };\n\n private _getAxisData = (yAxisData: IAxisData) => {\n if (yAxisData && yAxisData.yAxisDomainValues.length) {\n // For HBCWA x and y Values are swapped\n const { yAxisDomainValues: domainValue } = yAxisData;\n this._xMax = Math.max(domainValue[domainValue.length - 1], this.props.xMaxValue || 0);\n }\n };\n private _getAriaLabel = (point: IHorizontalBarChartWithAxisDataPoint): string => {\n const xValue = point.xAxisCalloutData || point.x;\n const yValue = point.yAxisCalloutData || point.y;\n return point.callOutAccessibilityData?.ariaLabel || `${xValue}. ` + `${yValue}.`;\n };\n}\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.HorizontalBarChartWithAxis = void 0;
|
|
4
|
+
var Utilities_1 = require("../../Utilities");
|
|
5
|
+
var HorizontalBarChartWithAxis_base_1 = require("./HorizontalBarChartWithAxis.base");
|
|
6
|
+
var HorizontalBarChartWithAxis_styles_1 = require("./HorizontalBarChartWithAxis.styles");
|
|
7
|
+
// Create a HorizontalBarChartWithAxis variant which uses these default styles and this styled subcomponent.
|
|
8
|
+
exports.HorizontalBarChartWithAxis = Utilities_1.styled(HorizontalBarChartWithAxis_base_1.HorizontalBarChartWithAxisBase, HorizontalBarChartWithAxis_styles_1.getStyles);
|
|
9
|
+
//# sourceMappingURL=HorizontalBarChartWithAxis.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"HorizontalBarChartWithAxis.js","sourceRoot":"../src/","sources":["components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.tsx"],"names":[],"mappings":";;;AACA,6CAAyC;AAMzC,qFAAmF;AACnF,yFAAgE;AAEhE,4GAA4G;AAC/F,QAAA,0BAA0B,GAA8D,kBAAM,CAIzG,gEAA8B,EAAE,6CAAS,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { styled } from '../../Utilities';\nimport {\n IHorizontalBarChartWithAxisProps,\n IHorizontalBarChartWithAxisStyleProps,\n IHorizontalBarChartWithAxisStyles,\n} from '../../index';\nimport { HorizontalBarChartWithAxisBase } from './HorizontalBarChartWithAxis.base';\nimport { getStyles } from './HorizontalBarChartWithAxis.styles';\n\n// Create a HorizontalBarChartWithAxis variant which uses these default styles and this styled subcomponent.\nexport const HorizontalBarChartWithAxis: React.FunctionComponent<IHorizontalBarChartWithAxisProps> = styled<\n IHorizontalBarChartWithAxisProps,\n IHorizontalBarChartWithAxisStyleProps,\n IHorizontalBarChartWithAxisStyles\n>(HorizontalBarChartWithAxisBase, getStyles);\n"]}
|
package/lib-commonjs/components/HorizontalBarChartWithAxis/HorizontalBarChartWithAxis.styles.js
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getStyles = void 0;
|
|
4
|
+
var tslib_1 = require("tslib");
|
|
5
|
+
var getStyles = function (props) {
|
|
6
|
+
var shouldHighlight = props.shouldHighlight, theme = props.theme;
|
|
7
|
+
return {
|
|
8
|
+
opacityChangeOnHover: {
|
|
9
|
+
opacity: shouldHighlight ? '' : '0.1',
|
|
10
|
+
},
|
|
11
|
+
xAxisTicks: [],
|
|
12
|
+
tooltip: tslib_1.__assign(tslib_1.__assign({}, theme.fonts.medium), { display: 'flex', flexDirection: 'column', padding: '8px', position: 'absolute', textAlign: 'center', top: '0px', background: theme.semanticColors.bodyBackground, borderRadius: '2px', pointerEvents: 'none' }),
|
|
13
|
+
};
|
|
14
|
+
};
|
|
15
|
+
exports.getStyles = getStyles;
|
|
16
|
+
//# sourceMappingURL=HorizontalBarChartWithAxis.styles.js.map
|