@fluentui/react-charting 5.24.11 → 5.24.13
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 +61 -1
- package/CHANGELOG.md +25 -2
- package/bundle-size/GanttChart.fixture.js +7 -0
- package/dist/react-charting.d.ts +128 -3
- package/dist/react-charting.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/etc/react-charting.api.md +44 -2
- package/lib/GanttChart.d.ts +1 -0
- package/lib/GanttChart.js +2 -0
- package/lib/GanttChart.js.map +1 -0
- package/lib/components/CommonComponents/CartesianChart.base.js +2 -1
- package/lib/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib/components/CommonComponents/CartesianChart.types.d.ts +3 -3
- package/lib/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib/components/DeclarativeChart/DeclarativeChart.js +22 -4
- package/lib/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.d.ts +2 -1
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js +23 -0
- package/lib/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.d.ts +2 -0
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +173 -63
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/GanttChart/GanttChart.base.d.ts +3 -0
- package/lib/components/GanttChart/GanttChart.base.js +329 -0
- package/lib/components/GanttChart/GanttChart.base.js.map +1 -0
- package/lib/components/GanttChart/GanttChart.d.ts +7 -0
- package/lib/components/GanttChart/GanttChart.js +10 -0
- package/lib/components/GanttChart/GanttChart.js.map +1 -0
- package/lib/components/GanttChart/GanttChart.styles.d.ts +2 -0
- package/lib/components/GanttChart/GanttChart.styles.js +4 -0
- package/lib/components/GanttChart/GanttChart.styles.js.map +1 -0
- package/lib/components/GanttChart/GanttChart.types.d.ts +67 -0
- package/lib/components/GanttChart/GanttChart.types.js +2 -0
- package/lib/components/GanttChart/GanttChart.types.js.map +1 -0
- package/lib/components/GanttChart/index.d.ts +2 -0
- package/lib/components/GanttChart/index.js +3 -0
- package/lib/components/GanttChart/index.js.map +1 -0
- package/lib/components/LineChart/LineChart.base.d.ts +1 -0
- package/lib/components/LineChart/LineChart.base.js +34 -11
- package/lib/components/LineChart/LineChart.base.js.map +1 -1
- package/lib/components/ScatterChart/ScatterChart.base.js +37 -23
- package/lib/components/ScatterChart/ScatterChart.base.js.map +1 -1
- package/lib/index.d.ts +3 -1
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib/types/IDataPoint.d.ts +49 -0
- package/lib/types/IDataPoint.js.map +1 -1
- package/lib/utilities/scatterpolar-utils.d.ts +22 -0
- package/lib/utilities/scatterpolar-utils.js +38 -0
- package/lib/utilities/scatterpolar-utils.js.map +1 -0
- package/lib/utilities/test-data.d.ts +4 -1
- package/lib/utilities/test-data.js +213 -0
- package/lib/utilities/test-data.js.map +1 -1
- package/lib/utilities/utilities.d.ts +14 -6
- package/lib/utilities/utilities.js +25 -9
- package/lib/utilities/utilities.js.map +1 -1
- package/lib-amd/GanttChart.d.ts +1 -0
- package/lib-amd/GanttChart.js +6 -0
- package/lib-amd/GanttChart.js.map +1 -0
- package/lib-amd/components/CommonComponents/CartesianChart.base.js +2 -1
- package/lib-amd/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib-amd/components/CommonComponents/CartesianChart.types.d.ts +3 -3
- package/lib-amd/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/DeclarativeChart.js +22 -5
- package/lib-amd/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/PlotlyColorAdapter.d.ts +2 -1
- package/lib-amd/components/DeclarativeChart/PlotlyColorAdapter.js +25 -2
- package/lib-amd/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.d.ts +2 -0
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js +173 -62
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-amd/components/GanttChart/GanttChart.base.d.ts +3 -0
- package/lib-amd/components/GanttChart/GanttChart.base.js +325 -0
- package/lib-amd/components/GanttChart/GanttChart.base.js.map +1 -0
- package/lib-amd/components/GanttChart/GanttChart.d.ts +7 -0
- package/lib-amd/components/GanttChart/GanttChart.js +12 -0
- package/lib-amd/components/GanttChart/GanttChart.js.map +1 -0
- package/lib-amd/components/GanttChart/GanttChart.styles.d.ts +2 -0
- package/lib-amd/components/GanttChart/GanttChart.styles.js +10 -0
- package/lib-amd/components/GanttChart/GanttChart.styles.js.map +1 -0
- package/lib-amd/components/GanttChart/GanttChart.types.d.ts +67 -0
- package/lib-amd/components/GanttChart/GanttChart.types.js +5 -0
- package/lib-amd/components/GanttChart/GanttChart.types.js.map +1 -0
- package/lib-amd/components/GanttChart/index.d.ts +2 -0
- package/lib-amd/components/GanttChart/index.js +7 -0
- package/lib-amd/components/GanttChart/index.js.map +1 -0
- package/lib-amd/components/LineChart/LineChart.base.d.ts +1 -0
- package/lib-amd/components/LineChart/LineChart.base.js +33 -11
- package/lib-amd/components/LineChart/LineChart.base.js.map +1 -1
- package/lib-amd/components/ScatterChart/ScatterChart.base.js +36 -23
- package/lib-amd/components/ScatterChart/ScatterChart.base.js.map +1 -1
- package/lib-amd/index.d.ts +3 -1
- package/lib-amd/index.js +3 -2
- package/lib-amd/index.js.map +1 -1
- package/lib-amd/types/IDataPoint.d.ts +49 -0
- package/lib-amd/types/IDataPoint.js.map +1 -1
- package/lib-amd/utilities/scatterpolar-utils.d.ts +22 -0
- package/lib-amd/utilities/scatterpolar-utils.js +43 -0
- package/lib-amd/utilities/scatterpolar-utils.js.map +1 -0
- package/lib-amd/utilities/test-data.d.ts +4 -1
- package/lib-amd/utilities/test-data.js +214 -2
- package/lib-amd/utilities/test-data.js.map +1 -1
- package/lib-amd/utilities/utilities.d.ts +14 -6
- package/lib-amd/utilities/utilities.js +27 -9
- package/lib-amd/utilities/utilities.js.map +1 -1
- package/lib-commonjs/GanttChart.d.ts +1 -0
- package/lib-commonjs/GanttChart.js +5 -0
- package/lib-commonjs/GanttChart.js.map +1 -0
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.js +2 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.d.ts +3 -3
- package/lib-commonjs/components/CommonComponents/CartesianChart.types.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js +23 -5
- package/lib-commonjs/components/DeclarativeChart/DeclarativeChart.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.d.ts +2 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js +25 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlyColorAdapter.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.d.ts +2 -0
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +173 -62
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/GanttChart/GanttChart.base.d.ts +3 -0
- package/lib-commonjs/components/GanttChart/GanttChart.base.js +332 -0
- package/lib-commonjs/components/GanttChart/GanttChart.base.js.map +1 -0
- package/lib-commonjs/components/GanttChart/GanttChart.d.ts +7 -0
- package/lib-commonjs/components/GanttChart/GanttChart.js +13 -0
- package/lib-commonjs/components/GanttChart/GanttChart.js.map +1 -0
- package/lib-commonjs/components/GanttChart/GanttChart.styles.d.ts +2 -0
- package/lib-commonjs/components/GanttChart/GanttChart.styles.js +8 -0
- package/lib-commonjs/components/GanttChart/GanttChart.styles.js.map +1 -0
- package/lib-commonjs/components/GanttChart/GanttChart.types.d.ts +67 -0
- package/lib-commonjs/components/GanttChart/GanttChart.types.js +3 -0
- package/lib-commonjs/components/GanttChart/GanttChart.types.js.map +1 -0
- package/lib-commonjs/components/GanttChart/index.d.ts +2 -0
- package/lib-commonjs/components/GanttChart/index.js +6 -0
- package/lib-commonjs/components/GanttChart/index.js.map +1 -0
- package/lib-commonjs/components/LineChart/LineChart.base.d.ts +1 -0
- package/lib-commonjs/components/LineChart/LineChart.base.js +33 -10
- package/lib-commonjs/components/LineChart/LineChart.base.js.map +1 -1
- package/lib-commonjs/components/ScatterChart/ScatterChart.base.js +36 -22
- package/lib-commonjs/components/ScatterChart/ScatterChart.base.js.map +1 -1
- package/lib-commonjs/index.d.ts +3 -1
- package/lib-commonjs/index.js +3 -1
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/types/IDataPoint.d.ts +49 -0
- package/lib-commonjs/types/IDataPoint.js.map +1 -1
- package/lib-commonjs/utilities/scatterpolar-utils.d.ts +22 -0
- package/lib-commonjs/utilities/scatterpolar-utils.js +42 -0
- package/lib-commonjs/utilities/scatterpolar-utils.js.map +1 -0
- package/lib-commonjs/utilities/test-data.d.ts +4 -1
- package/lib-commonjs/utilities/test-data.js +214 -1
- package/lib-commonjs/utilities/test-data.js.map +1 -1
- package/lib-commonjs/utilities/utilities.d.ts +14 -6
- package/lib-commonjs/utilities/utilities.js +28 -10
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/package.json +2 -2
- package/src/components/CommonComponents/CartesianChart.types.ts +5 -2
- package/src/components/GanttChart/GanttChart.types.ts +83 -0
|
@@ -0,0 +1,329 @@
|
|
|
1
|
+
import { __assign, __rest } from "tslib";
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import { max as d3Max, min as d3Min } from 'd3-array';
|
|
4
|
+
import { DirectionalHint, FocusZoneDirection, getId, getRTL } from '@fluentui/react';
|
|
5
|
+
import { Legends } from '../Legends/index';
|
|
6
|
+
import { CartesianChart } from '../CommonComponents/index';
|
|
7
|
+
import { ChartHoverCard, ChartTypes, YAxisType, XAxisTypes, getTypeOfAxis, getNextColor, findHBCWANumericMinMaxOfY, createYAxisForHorizontalBarChartWithAxis, createStringYAxisForHorizontalBarChartWithAxis, getNextGradient, areArraysEqual, MIN_DOMAIN_MARGIN, sortAxisCategories, calculateAppropriateBarWidth, getColorFromToken, getScalePadding, getDateFormatLevel, } from '../../utilities/index';
|
|
8
|
+
import { toImage } from '../../utilities/image-export-utils';
|
|
9
|
+
import { formatDateToLocaleString, getMultiLevelDateTimeFormatOptions } from '@fluentui/chart-utilities';
|
|
10
|
+
export var GanttChartBase = React.forwardRef(function (_a, forwardedRef) {
|
|
11
|
+
var _b, _c;
|
|
12
|
+
var _d = _a.useUTC, useUTC = _d === void 0 ? true : _d, _e = _a.yAxisCategoryOrder, yAxisCategoryOrder = _e === void 0 ? 'default' : _e, props = __rest(_a, ["useUTC", "yAxisCategoryOrder"]);
|
|
13
|
+
var _barHeight = React.useRef(0);
|
|
14
|
+
var _calloutId = React.useRef(getId('callout'));
|
|
15
|
+
var margins = React.useRef({});
|
|
16
|
+
var _bars = React.useRef([]);
|
|
17
|
+
var _xAxisType = React.useRef(XAxisTypes.DateAxis);
|
|
18
|
+
var _yAxisType = React.useRef(YAxisType.StringAxis);
|
|
19
|
+
var _calloutAnchorPoint = React.useRef(null);
|
|
20
|
+
var _cartesianChartRef = React.useRef(null);
|
|
21
|
+
var _legendsRef = React.useRef(null);
|
|
22
|
+
var _domainMargin = React.useRef(MIN_DOMAIN_MARGIN);
|
|
23
|
+
var _yAxisPadding = React.useRef(0);
|
|
24
|
+
var _emptyChartId = React.useRef(getId('Gantt_empty'));
|
|
25
|
+
var _legendColorMap = React.useRef({});
|
|
26
|
+
var _gradientId = React.useRef(getId('Gantt_gradient'));
|
|
27
|
+
var prevProps = React.useRef({});
|
|
28
|
+
var _f = React.useState(''), calloutColor = _f[0], setCalloutColor = _f[1];
|
|
29
|
+
var _g = React.useState(false), isCalloutVisible = _g[0], setCalloutVisible = _g[1];
|
|
30
|
+
var _h = React.useState(''), hoveredLegend = _h[0], setHoveredLegend = _h[1];
|
|
31
|
+
var _j = React.useState(null), calloutTarget = _j[0], setCalloutTarget = _j[1];
|
|
32
|
+
var _k = React.useState(''), calloutLegend = _k[0], setCalloutLegend = _k[1];
|
|
33
|
+
var _l = React.useState(''), xCalloutValue = _l[0], setXCalloutValue = _l[1];
|
|
34
|
+
var _m = React.useState(''), yCalloutValue = _m[0], setYCalloutValue = _m[1];
|
|
35
|
+
var _o = React.useState(((_b = props.legendProps) === null || _b === void 0 ? void 0 : _b.selectedLegends) || []), selectedLegends = _o[0], setSelectedLegends = _o[1];
|
|
36
|
+
var _p = React.useState(), dataPointCalloutProps = _p[0], setDataPointCalloutProps = _p[1];
|
|
37
|
+
React.useEffect(function () {
|
|
38
|
+
var _a, _b, _c;
|
|
39
|
+
if (!areArraysEqual((_a = prevProps.current.legendProps) === null || _a === void 0 ? void 0 : _a.selectedLegends, (_b = props.legendProps) === null || _b === void 0 ? void 0 : _b.selectedLegends)) {
|
|
40
|
+
setSelectedLegends(((_c = props.legendProps) === null || _c === void 0 ? void 0 : _c.selectedLegends) || []);
|
|
41
|
+
}
|
|
42
|
+
prevProps.current = props;
|
|
43
|
+
}, [props]);
|
|
44
|
+
React.useImperativeHandle(props.componentRef, function () {
|
|
45
|
+
var _a, _b;
|
|
46
|
+
return ({
|
|
47
|
+
chartContainer: (_b = (_a = _cartesianChartRef.current) === null || _a === void 0 ? void 0 : _a.chartContainer) !== null && _b !== void 0 ? _b : null,
|
|
48
|
+
toImage: function (opts) {
|
|
49
|
+
var _a, _b;
|
|
50
|
+
return toImage((_a = _cartesianChartRef.current) === null || _a === void 0 ? void 0 : _a.chartContainer, (_b = _legendsRef.current) === null || _b === void 0 ? void 0 : _b.toSVG, getRTL(), opts);
|
|
51
|
+
},
|
|
52
|
+
});
|
|
53
|
+
}, []);
|
|
54
|
+
var _points = React.useMemo(function () {
|
|
55
|
+
var _a, _b;
|
|
56
|
+
_legendColorMap.current = {};
|
|
57
|
+
var colorIndex = 0;
|
|
58
|
+
return ((_b = (_a = props.data) === null || _a === void 0 ? void 0 : _a.map(function (point) {
|
|
59
|
+
var _a, _b, _c, _d, _e;
|
|
60
|
+
var legend = "".concat(point.legend);
|
|
61
|
+
if (!_legendColorMap.current[legend]) {
|
|
62
|
+
var startColor = point.color
|
|
63
|
+
? getColorFromToken(point.color, (_a = props.theme) === null || _a === void 0 ? void 0 : _a.isInverted)
|
|
64
|
+
: getNextColor(colorIndex, 0, (_b = props.theme) === null || _b === void 0 ? void 0 : _b.isInverted);
|
|
65
|
+
var endColor = startColor;
|
|
66
|
+
if (props.enableGradient) {
|
|
67
|
+
var nextGradient = getNextGradient(colorIndex, 0, (_c = props.theme) === null || _c === void 0 ? void 0 : _c.isInverted);
|
|
68
|
+
startColor = ((_d = point.gradient) === null || _d === void 0 ? void 0 : _d[0]) || nextGradient[0];
|
|
69
|
+
endColor = ((_e = point.gradient) === null || _e === void 0 ? void 0 : _e[1]) || nextGradient[1];
|
|
70
|
+
}
|
|
71
|
+
_legendColorMap.current[legend] = [startColor, endColor];
|
|
72
|
+
colorIndex += 1;
|
|
73
|
+
}
|
|
74
|
+
return __assign(__assign(__assign({}, point), { color: _legendColorMap.current[legend][0] }), (props.enableGradient ? { gradient: _legendColorMap.current[legend] } : {}));
|
|
75
|
+
})) !== null && _b !== void 0 ? _b : []);
|
|
76
|
+
}, [props.data, (_c = props.theme) === null || _c === void 0 ? void 0 : _c.isInverted, props.enableGradient]);
|
|
77
|
+
var _dateFormatOptions = React.useMemo(function () {
|
|
78
|
+
if (_xAxisType.current !== XAxisTypes.DateAxis) {
|
|
79
|
+
return undefined;
|
|
80
|
+
}
|
|
81
|
+
var lowestFormatLevel = 100;
|
|
82
|
+
var highestFormatLevel = -1;
|
|
83
|
+
_points.forEach(function (p) {
|
|
84
|
+
var startFormatLevel = getDateFormatLevel(p.x.start, useUTC);
|
|
85
|
+
var endFormatLevel = getDateFormatLevel(p.x.end, useUTC);
|
|
86
|
+
lowestFormatLevel = Math.min(lowestFormatLevel, startFormatLevel, endFormatLevel);
|
|
87
|
+
highestFormatLevel = Math.max(highestFormatLevel, startFormatLevel, endFormatLevel);
|
|
88
|
+
});
|
|
89
|
+
return getMultiLevelDateTimeFormatOptions(lowestFormatLevel, highestFormatLevel);
|
|
90
|
+
}, [useUTC, _points]);
|
|
91
|
+
var _getDomainNRangeValues = React.useCallback(function (points, _margins, containerWidth, chartType, isRTL, xAxisType, barWidth, tickValues, shiftX) {
|
|
92
|
+
var xValues = [];
|
|
93
|
+
points.forEach(function (point) {
|
|
94
|
+
xValues.push(point.x.start, point.x.end);
|
|
95
|
+
});
|
|
96
|
+
var xMin = d3Min(xValues) || 0;
|
|
97
|
+
var xMax = d3Max(xValues) || 0;
|
|
98
|
+
return {
|
|
99
|
+
dStartValue: isRTL ? xMax : xMin,
|
|
100
|
+
dEndValue: isRTL ? xMin : xMax,
|
|
101
|
+
rStartValue: _margins.left + (isRTL ? 0 : shiftX),
|
|
102
|
+
rEndValue: containerWidth - _margins.right - (isRTL ? shiftX : 0),
|
|
103
|
+
};
|
|
104
|
+
}, []);
|
|
105
|
+
var _adjustProps = function () {
|
|
106
|
+
_barHeight.current = Math.max(props.barHeight || 24, 1);
|
|
107
|
+
if (props.data && props.data.length > 0) {
|
|
108
|
+
_xAxisType.current = getTypeOfAxis(props.data[0].x.start, true);
|
|
109
|
+
_yAxisType.current = getTypeOfAxis(props.data[0].y, false);
|
|
110
|
+
}
|
|
111
|
+
_yAxisPadding.current = getScalePadding(props.yAxisPadding, undefined, 1 / 2);
|
|
112
|
+
};
|
|
113
|
+
var _getMargins = React.useCallback(function (_margins) {
|
|
114
|
+
margins.current = _margins;
|
|
115
|
+
}, []);
|
|
116
|
+
var _renderContentForOnlyBars = function (point) {
|
|
117
|
+
return (React.createElement(ChartHoverCard, { XValue: point.yAxisCalloutData || point.y.toString(), Legend: point.legend, YValue: point.xAxisCalloutData || _getFormattedXValue(point), color: point.color, culture: props.culture }));
|
|
118
|
+
};
|
|
119
|
+
var _renderCallout = function (point) {
|
|
120
|
+
return point ? _renderContentForOnlyBars(point) : null;
|
|
121
|
+
};
|
|
122
|
+
var _getCustomizedCallout = function () {
|
|
123
|
+
return props.onRenderCalloutPerDataPoint
|
|
124
|
+
? props.onRenderCalloutPerDataPoint(dataPointCalloutProps, _renderCallout)
|
|
125
|
+
: null;
|
|
126
|
+
};
|
|
127
|
+
var _getFormattedXValue = React.useCallback(function (point) {
|
|
128
|
+
var formattedStartX;
|
|
129
|
+
var formattedEndX;
|
|
130
|
+
if (_xAxisType.current === XAxisTypes.DateAxis) {
|
|
131
|
+
formattedStartX = formatDateToLocaleString(point.x.start, props.culture, useUTC, false, _dateFormatOptions);
|
|
132
|
+
formattedEndX = formatDateToLocaleString(point.x.end, props.culture, useUTC, false, _dateFormatOptions);
|
|
133
|
+
}
|
|
134
|
+
else {
|
|
135
|
+
formattedStartX = point.x.start.toString();
|
|
136
|
+
formattedEndX = point.x.end.toString();
|
|
137
|
+
}
|
|
138
|
+
return "".concat(formattedStartX, " - ").concat(formattedEndX);
|
|
139
|
+
}, [props.culture, useUTC, _dateFormatOptions]);
|
|
140
|
+
var _getAriaLabel = React.useCallback(function (point) {
|
|
141
|
+
var _a;
|
|
142
|
+
var xValue = point.xAxisCalloutData || _getFormattedXValue(point);
|
|
143
|
+
var yValue = point.yAxisCalloutData || point.y;
|
|
144
|
+
return ((_a = point.callOutAccessibilityData) === null || _a === void 0 ? void 0 : _a.ariaLabel) || "".concat(yValue, ". ") + "".concat(xValue, ".");
|
|
145
|
+
}, [_getFormattedXValue]);
|
|
146
|
+
var _getHighlightedLegend = React.useCallback(function () {
|
|
147
|
+
return selectedLegends.length > 0 ? selectedLegends : hoveredLegend ? [hoveredLegend] : [];
|
|
148
|
+
}, [hoveredLegend, selectedLegends]);
|
|
149
|
+
/**
|
|
150
|
+
* This function checks if the given legend is highlighted or not.
|
|
151
|
+
* A legend can be highlighted in 2 ways:
|
|
152
|
+
* 1. selection: if the user clicks on it
|
|
153
|
+
* 2. hovering: if there is no selected legend and the user hovers over it
|
|
154
|
+
*/
|
|
155
|
+
var _legendHighlighted = React.useCallback(function (legend) {
|
|
156
|
+
return _getHighlightedLegend().includes("".concat(legend));
|
|
157
|
+
}, [_getHighlightedLegend]);
|
|
158
|
+
/**
|
|
159
|
+
* This function checks if none of the legends is selected or hovered.
|
|
160
|
+
*/
|
|
161
|
+
var _noLegendHighlighted = React.useCallback(function () {
|
|
162
|
+
return _getHighlightedLegend().length === 0;
|
|
163
|
+
}, [_getHighlightedLegend]);
|
|
164
|
+
var _showCallout = React.useCallback(function (target, point) {
|
|
165
|
+
if (!(_noLegendHighlighted() || _legendHighlighted(point.legend)) || _calloutAnchorPoint.current === point) {
|
|
166
|
+
return;
|
|
167
|
+
}
|
|
168
|
+
_calloutAnchorPoint.current = point;
|
|
169
|
+
setCalloutTarget(target);
|
|
170
|
+
setCalloutVisible(true);
|
|
171
|
+
setCalloutLegend(point.legend);
|
|
172
|
+
setCalloutColor(point.color);
|
|
173
|
+
setXCalloutValue(point.yAxisCalloutData || point.y.toString());
|
|
174
|
+
setYCalloutValue(point.xAxisCalloutData || _getFormattedXValue(point));
|
|
175
|
+
setDataPointCalloutProps(point);
|
|
176
|
+
}, [_getFormattedXValue, _legendHighlighted, _noLegendHighlighted]);
|
|
177
|
+
var _onBarFocus = React.useCallback(function (point, focusEvent) {
|
|
178
|
+
_showCallout(focusEvent.currentTarget, point);
|
|
179
|
+
}, [_showCallout]);
|
|
180
|
+
var _onBarHover = React.useCallback(function (point, mouseEvent) {
|
|
181
|
+
_showCallout(mouseEvent.currentTarget, point);
|
|
182
|
+
}, [_showCallout]);
|
|
183
|
+
var _createBars = React.useCallback(function (xScale, yScale) {
|
|
184
|
+
var bars = _points.map(function (point, index) {
|
|
185
|
+
var shouldHighlight = _noLegendHighlighted() || _legendHighlighted(point.legend);
|
|
186
|
+
var startColor = point.color;
|
|
187
|
+
var endColor = startColor;
|
|
188
|
+
if (props.enableGradient) {
|
|
189
|
+
startColor = point.gradient[0];
|
|
190
|
+
endColor = point.gradient[1];
|
|
191
|
+
}
|
|
192
|
+
var gradientId = "".concat(_gradientId.current, "_").concat(index);
|
|
193
|
+
var startX = xScale(point.x.start);
|
|
194
|
+
var endX = xScale(point.x.end);
|
|
195
|
+
var y = (_yAxisType.current === YAxisType.StringAxis
|
|
196
|
+
? yScale(point.y) + yScale.bandwidth() / 2
|
|
197
|
+
: yScale(point.y)) -
|
|
198
|
+
_barHeight.current / 2;
|
|
199
|
+
return (React.createElement(React.Fragment, { key: index },
|
|
200
|
+
props.enableGradient && (React.createElement("defs", null,
|
|
201
|
+
React.createElement("linearGradient", { id: gradientId },
|
|
202
|
+
React.createElement("stop", { offset: "0", stopColor: startColor }),
|
|
203
|
+
React.createElement("stop", { offset: "100%", stopColor: endColor })))),
|
|
204
|
+
React.createElement("rect", { x: Math.min(startX, endX), y: y, width: Math.abs(endX - startX), height: _barHeight.current, rx: props.roundCorners ? 3 : 0, fill: props.enableGradient ? "url(#".concat(gradientId, ")") : startColor, opacity: shouldHighlight ? 1 : 0.1, onClick: point.onClick, onMouseOver: function (event) { return _onBarHover(point, event); }, onMouseLeave: _onBarLeave, onFocus: function (event) { return _onBarFocus(point, event); }, onBlur: _onBarLeave, "data-is-focusable": shouldHighlight, role: "img", "aria-label": _getAriaLabel(point) })));
|
|
205
|
+
});
|
|
206
|
+
return bars;
|
|
207
|
+
}, [
|
|
208
|
+
_getAriaLabel,
|
|
209
|
+
_legendHighlighted,
|
|
210
|
+
_noLegendHighlighted,
|
|
211
|
+
_onBarFocus,
|
|
212
|
+
_onBarHover,
|
|
213
|
+
props.enableGradient,
|
|
214
|
+
props.roundCorners,
|
|
215
|
+
_points,
|
|
216
|
+
]);
|
|
217
|
+
var _getGraphData = React.useCallback(function (xScale, yScale, containerHeight, containerWidth, xAxisElement, yAxisElement) {
|
|
218
|
+
return (_bars.current = _createBars(xScale, yScale));
|
|
219
|
+
}, [_createBars]);
|
|
220
|
+
var _onBarLeave = function () {
|
|
221
|
+
// do nothing
|
|
222
|
+
};
|
|
223
|
+
var _handleChartMouseLeave = React.useCallback(function () {
|
|
224
|
+
_calloutAnchorPoint.current = null;
|
|
225
|
+
setCalloutTarget(null);
|
|
226
|
+
setCalloutVisible(false);
|
|
227
|
+
setCalloutLegend('');
|
|
228
|
+
setCalloutColor('');
|
|
229
|
+
setXCalloutValue('');
|
|
230
|
+
setYCalloutValue('');
|
|
231
|
+
setDataPointCalloutProps(undefined);
|
|
232
|
+
}, []);
|
|
233
|
+
var _closeCallout = function () {
|
|
234
|
+
setCalloutVisible(false);
|
|
235
|
+
};
|
|
236
|
+
var _onLegendHover = function (legend) {
|
|
237
|
+
setHoveredLegend(legend);
|
|
238
|
+
};
|
|
239
|
+
var _onLegendLeave = function () {
|
|
240
|
+
setHoveredLegend('');
|
|
241
|
+
};
|
|
242
|
+
var _getLegendData = function () {
|
|
243
|
+
var actions = [];
|
|
244
|
+
Object.keys(_legendColorMap.current).forEach(function (legendTitle) {
|
|
245
|
+
var legend = {
|
|
246
|
+
title: legendTitle,
|
|
247
|
+
color: _legendColorMap.current[legendTitle][0],
|
|
248
|
+
hoverAction: function () {
|
|
249
|
+
_handleChartMouseLeave();
|
|
250
|
+
_onLegendHover(legendTitle);
|
|
251
|
+
},
|
|
252
|
+
onMouseOutAction: function () {
|
|
253
|
+
_onLegendLeave();
|
|
254
|
+
},
|
|
255
|
+
};
|
|
256
|
+
actions.push(legend);
|
|
257
|
+
});
|
|
258
|
+
var legends = (React.createElement(Legends, __assign({ legends: actions, enabledWrapLines: props.enabledLegendsWrapLines, overflowProps: props.legendsOverflowProps, focusZonePropsInHoverCard: props.focusZonePropsForLegendsInHoverCard, overflowText: props.legendsOverflowText, onChange: _onLegendSelectionChange, ref: _legendsRef }, props.legendProps)));
|
|
259
|
+
return legends;
|
|
260
|
+
};
|
|
261
|
+
var _onLegendSelectionChange = function (_selectedLegends, event, currentLegend) {
|
|
262
|
+
var _a, _b;
|
|
263
|
+
if ((_a = props.legendProps) === null || _a === void 0 ? void 0 : _a.canSelectMultipleLegends) {
|
|
264
|
+
setSelectedLegends(_selectedLegends);
|
|
265
|
+
}
|
|
266
|
+
else {
|
|
267
|
+
setSelectedLegends(_selectedLegends.slice(-1));
|
|
268
|
+
}
|
|
269
|
+
if ((_b = props.legendProps) === null || _b === void 0 ? void 0 : _b.onChange) {
|
|
270
|
+
props.legendProps.onChange(_selectedLegends, event, currentLegend);
|
|
271
|
+
}
|
|
272
|
+
};
|
|
273
|
+
var _getChartTitle = function () {
|
|
274
|
+
var chartTitle = props.chartTitle;
|
|
275
|
+
return (chartTitle ? "".concat(chartTitle, ". ") : '') + "Gantt chart with ".concat(_points.length, " bars. ");
|
|
276
|
+
};
|
|
277
|
+
var _isChartEmpty = function () {
|
|
278
|
+
return !(props.data && props.data.length > 0);
|
|
279
|
+
};
|
|
280
|
+
var _getYDomainMargins = React.useCallback(function (containerHeight) {
|
|
281
|
+
_domainMargin.current = MIN_DOMAIN_MARGIN;
|
|
282
|
+
var ySet = new Set();
|
|
283
|
+
_points.forEach(function (point) {
|
|
284
|
+
ySet.add(point.y);
|
|
285
|
+
});
|
|
286
|
+
var uniqueY = Array.from(ySet);
|
|
287
|
+
/** Total height available to render the bars */
|
|
288
|
+
var totalHeight = containerHeight - (margins.current.top + MIN_DOMAIN_MARGIN) - (margins.current.bottom + MIN_DOMAIN_MARGIN);
|
|
289
|
+
if (_yAxisType.current !== YAxisType.StringAxis) {
|
|
290
|
+
_barHeight.current = Math.max(props.barHeight ||
|
|
291
|
+
calculateAppropriateBarWidth(uniqueY, totalHeight, _yAxisPadding.current), 1);
|
|
292
|
+
_domainMargin.current += _barHeight.current / 2;
|
|
293
|
+
}
|
|
294
|
+
return __assign(__assign({}, margins.current), { top: margins.current.top + _domainMargin.current, bottom: margins.current.bottom + _domainMargin.current });
|
|
295
|
+
}, [props.barHeight, _points]);
|
|
296
|
+
var _getOrderedYAxisLabels = function () {
|
|
297
|
+
return sortAxisCategories(_mapCategoryToValues(), yAxisCategoryOrder);
|
|
298
|
+
};
|
|
299
|
+
var _mapCategoryToValues = function () {
|
|
300
|
+
var categoryToValues = {};
|
|
301
|
+
_points.forEach(function (point) {
|
|
302
|
+
if (!categoryToValues[point.y]) {
|
|
303
|
+
categoryToValues[point.y] = [];
|
|
304
|
+
}
|
|
305
|
+
// FIXME
|
|
306
|
+
// categoryToValues[point.y].push(point.x.end - point.x.start);
|
|
307
|
+
});
|
|
308
|
+
return categoryToValues;
|
|
309
|
+
};
|
|
310
|
+
var _renderBars = React.useCallback(function () {
|
|
311
|
+
return React.createElement("g", null, _bars.current);
|
|
312
|
+
}, []);
|
|
313
|
+
if (!_isChartEmpty()) {
|
|
314
|
+
_adjustProps();
|
|
315
|
+
var yAxisLabels = _getOrderedYAxisLabels();
|
|
316
|
+
var legendBars = _getLegendData();
|
|
317
|
+
var calloutProps = __assign({ isCalloutVisible: isCalloutVisible, directionalHint: DirectionalHint.topAutoEdge, id: "toolTip".concat(_calloutId.current), target: calloutTarget, isBeakVisible: false, gapSpace: 15, color: calloutColor, legend: calloutLegend, XValue: xCalloutValue, YValue: yCalloutValue, onDismiss: _closeCallout, preventDismissOnLostFocus: true }, props.calloutProps);
|
|
318
|
+
var tickParams = {
|
|
319
|
+
tickValues: props.tickValues,
|
|
320
|
+
tickFormat: props.tickFormat,
|
|
321
|
+
};
|
|
322
|
+
return (React.createElement(CartesianChart, __assign({}, props, { yAxisPadding: _yAxisPadding.current, chartTitle: _getChartTitle(), points: _points, chartType: ChartTypes.GanttChart, xAxisType: _xAxisType.current, yAxisType: _yAxisType.current, stringDatasetForYAxisDomain: yAxisLabels, calloutProps: calloutProps, tickParams: tickParams, legendBars: legendBars, createYAxis: createYAxisForHorizontalBarChartWithAxis, getDomainNRangeValues: _getDomainNRangeValues, createStringYAxis: createStringYAxisForHorizontalBarChartWithAxis, getMinMaxOfYAxis: findHBCWANumericMinMaxOfY, focusZoneDirection: FocusZoneDirection.vertical, customizedCallout: _getCustomizedCallout(), getmargins: _getMargins, getYDomainMargins: _getYDomainMargins, getGraphData: _getGraphData, onChartMouseLeave: _handleChartMouseLeave, ref: _cartesianChartRef, useUTC: useUTC, children: _renderBars })));
|
|
323
|
+
}
|
|
324
|
+
else {
|
|
325
|
+
return (React.createElement("div", { id: _emptyChartId.current, role: 'alert', style: { opacity: '0' }, "aria-label": 'Graph has no data to display' }));
|
|
326
|
+
}
|
|
327
|
+
});
|
|
328
|
+
GanttChartBase.displayName = 'GanttChart';
|
|
329
|
+
//# sourceMappingURL=GanttChart.base.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GanttChart.base.js","sourceRoot":"../src/","sources":["components/GanttChart/GanttChart.base.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\nimport { max as d3Max, min as d3Min } from 'd3-array';\nimport { ScaleLinear, ScaleBand, ScaleTime } from 'd3-scale';\nimport { DirectionalHint, FocusZoneDirection, getId, getRTL } from '@fluentui/react';\nimport { ILegend, ILegendContainer, Legends } from '../Legends/index';\nimport { IMargins, IChart, IImageExportOptions, IGanttChartDataPoint } from '../../types/IDataPoint';\nimport { CartesianChart } from '../CommonComponents/index';\nimport { IGanttChartProps } from './GanttChart.types';\nimport {\n ChartHoverCard,\n ChartTypes,\n YAxisType,\n XAxisTypes,\n getTypeOfAxis,\n getNextColor,\n findHBCWANumericMinMaxOfY,\n createYAxisForHorizontalBarChartWithAxis,\n IDomainNRange,\n createStringYAxisForHorizontalBarChartWithAxis,\n getNextGradient,\n areArraysEqual,\n MIN_DOMAIN_MARGIN,\n sortAxisCategories,\n calculateAppropriateBarWidth,\n getColorFromToken,\n getScalePadding,\n getDateFormatLevel,\n} from '../../utilities/index';\nimport { toImage } from '../../utilities/image-export-utils';\nimport { formatDateToLocaleString, getMultiLevelDateTimeFormatOptions } from '@fluentui/chart-utilities';\n\ntype NumberScale = ScaleLinear<number, number>;\ntype StringScale = ScaleBand<string>;\ntype DateScale = ScaleTime<Date, number>;\n\nexport const GanttChartBase: React.FunctionComponent<IGanttChartProps> = React.forwardRef<\n HTMLDivElement,\n IGanttChartProps\n>(({ useUTC = true, yAxisCategoryOrder = 'default', ...props }, forwardedRef) => {\n const _barHeight = React.useRef<number>(0);\n const _calloutId = React.useRef<string>(getId('callout'));\n const margins = React.useRef<IMargins>({});\n const _bars = React.useRef<React.JSX.Element[]>([]);\n const _xAxisType = React.useRef<XAxisTypes>(XAxisTypes.DateAxis);\n const _yAxisType = React.useRef<YAxisType>(YAxisType.StringAxis);\n const _calloutAnchorPoint = React.useRef<IGanttChartDataPoint | null>(null);\n const _cartesianChartRef = React.useRef<IChart>(null);\n const _legendsRef = React.useRef<ILegendContainer>(null);\n const _domainMargin = React.useRef<number>(MIN_DOMAIN_MARGIN);\n const _yAxisPadding = React.useRef<number>(0);\n const _emptyChartId = React.useRef<string>(getId('Gantt_empty'));\n const _legendColorMap = React.useRef<Record<string, [string, string]>>({});\n const _gradientId = React.useRef<string>(getId('Gantt_gradient'));\n const prevProps = React.useRef<Partial<IGanttChartProps>>({});\n\n const [calloutColor, setCalloutColor] = React.useState<string>('');\n const [isCalloutVisible, setCalloutVisible] = React.useState<boolean>(false);\n const [hoveredLegend, setHoveredLegend] = React.useState<string>('');\n const [calloutTarget, setCalloutTarget] = React.useState<SVGElement | null>(null);\n const [calloutLegend, setCalloutLegend] = React.useState<string>('');\n const [xCalloutValue, setXCalloutValue] = React.useState<string>('');\n const [yCalloutValue, setYCalloutValue] = React.useState<string>('');\n const [selectedLegends, setSelectedLegends] = React.useState<string[]>(props.legendProps?.selectedLegends || []);\n const [dataPointCalloutProps, setDataPointCalloutProps] = React.useState<IGanttChartDataPoint>();\n\n React.useEffect(() => {\n if (!areArraysEqual(prevProps.current.legendProps?.selectedLegends, props.legendProps?.selectedLegends)) {\n setSelectedLegends(props.legendProps?.selectedLegends || []);\n }\n prevProps.current = props;\n }, [props]);\n\n React.useImperativeHandle(\n props.componentRef,\n () => ({\n chartContainer: _cartesianChartRef.current?.chartContainer ?? null,\n toImage: (opts?: IImageExportOptions): Promise<string> => {\n return toImage(_cartesianChartRef.current?.chartContainer, _legendsRef.current?.toSVG, getRTL(), opts);\n },\n }),\n [],\n );\n\n const _points = React.useMemo(() => {\n _legendColorMap.current = {};\n let colorIndex = 0;\n\n return (\n props.data?.map(point => {\n const legend = `${point.legend}`;\n if (!_legendColorMap.current[legend]) {\n let startColor = point.color\n ? getColorFromToken(point.color, props.theme?.isInverted)\n : getNextColor(colorIndex, 0, props.theme?.isInverted);\n let endColor = startColor;\n\n if (props.enableGradient) {\n const nextGradient = getNextGradient(colorIndex, 0, props.theme?.isInverted);\n startColor = point.gradient?.[0] || nextGradient[0];\n endColor = point.gradient?.[1] || nextGradient[1];\n }\n\n _legendColorMap.current[legend] = [startColor, endColor];\n colorIndex += 1;\n }\n\n return {\n ...point,\n color: _legendColorMap.current[legend][0],\n ...(props.enableGradient ? { gradient: _legendColorMap.current[legend] } : {}),\n };\n }) ?? []\n );\n }, [props.data, props.theme?.isInverted, props.enableGradient]);\n\n const _dateFormatOptions = React.useMemo(() => {\n if (_xAxisType.current !== XAxisTypes.DateAxis) {\n return undefined;\n }\n\n let lowestFormatLevel = 100;\n let highestFormatLevel = -1;\n _points.forEach(p => {\n const startFormatLevel = getDateFormatLevel(p.x.start as Date, useUTC);\n const endFormatLevel = getDateFormatLevel(p.x.end as Date, useUTC);\n lowestFormatLevel = Math.min(lowestFormatLevel, startFormatLevel, endFormatLevel);\n highestFormatLevel = Math.max(highestFormatLevel, startFormatLevel, endFormatLevel);\n });\n\n return getMultiLevelDateTimeFormatOptions(lowestFormatLevel, highestFormatLevel);\n }, [useUTC, _points]);\n\n const _getDomainNRangeValues = React.useCallback(\n (\n points: IGanttChartDataPoint[],\n _margins: IMargins,\n containerWidth: number,\n chartType: ChartTypes,\n isRTL: boolean,\n xAxisType: XAxisTypes,\n barWidth: number,\n tickValues: Date[] | number[] | undefined,\n shiftX: number,\n ): IDomainNRange => {\n const xValues: (Date | number)[] = [];\n points.forEach(point => {\n xValues.push(point.x.start, point.x.end);\n });\n\n const xMin = d3Min(xValues) || 0;\n const xMax = d3Max(xValues) || 0;\n\n return {\n dStartValue: isRTL ? xMax : xMin,\n dEndValue: isRTL ? xMin : xMax,\n rStartValue: _margins.left! + (isRTL ? 0 : shiftX),\n rEndValue: containerWidth - _margins.right! - (isRTL ? shiftX : 0),\n };\n },\n [],\n );\n\n const _adjustProps = (): void => {\n _barHeight.current = Math.max(props.barHeight || 24, 1);\n\n if (props.data && props.data.length > 0) {\n _xAxisType.current = getTypeOfAxis(props.data[0].x.start, true) as XAxisTypes;\n _yAxisType.current = getTypeOfAxis(props.data[0].y, false) as YAxisType;\n }\n\n _yAxisPadding.current = getScalePadding(props.yAxisPadding, undefined, 1 / 2);\n };\n\n const _getMargins = React.useCallback((_margins: IMargins) => {\n margins.current = _margins;\n }, []);\n\n const _renderContentForOnlyBars = (point: IGanttChartDataPoint): React.JSX.Element => {\n return (\n <ChartHoverCard\n XValue={point.yAxisCalloutData || point.y.toString()}\n Legend={point.legend}\n YValue={point.xAxisCalloutData || _getFormattedXValue(point)}\n color={point.color}\n culture={props.culture}\n />\n );\n };\n\n const _renderCallout = (point?: IGanttChartDataPoint): React.JSX.Element | null => {\n return point ? _renderContentForOnlyBars(point) : null;\n };\n\n const _getCustomizedCallout = () => {\n return props.onRenderCalloutPerDataPoint\n ? props.onRenderCalloutPerDataPoint(dataPointCalloutProps, _renderCallout)\n : null;\n };\n\n const _getFormattedXValue = React.useCallback(\n (point: IGanttChartDataPoint): string => {\n let formattedStartX: string;\n let formattedEndX: string;\n\n if (_xAxisType.current === XAxisTypes.DateAxis) {\n formattedStartX = formatDateToLocaleString(\n point.x.start as Date,\n props.culture,\n useUTC,\n false,\n _dateFormatOptions,\n );\n formattedEndX = formatDateToLocaleString(point.x.end as Date, props.culture, useUTC, false, _dateFormatOptions);\n } else {\n formattedStartX = point.x.start.toString();\n formattedEndX = point.x.end.toString();\n }\n\n return `${formattedStartX} - ${formattedEndX}`;\n },\n [props.culture, useUTC, _dateFormatOptions],\n );\n\n const _getAriaLabel = React.useCallback(\n (point: IGanttChartDataPoint): string => {\n const xValue = point.xAxisCalloutData || _getFormattedXValue(point);\n const yValue = point.yAxisCalloutData || point.y;\n return point.callOutAccessibilityData?.ariaLabel || `${yValue}. ` + `${xValue}.`;\n },\n [_getFormattedXValue],\n );\n\n const _getHighlightedLegend = React.useCallback(() => {\n return selectedLegends.length > 0 ? selectedLegends : hoveredLegend ? [hoveredLegend] : [];\n }, [hoveredLegend, selectedLegends]);\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 const _legendHighlighted = React.useCallback(\n (legend: string | undefined) => {\n return _getHighlightedLegend().includes(`${legend}`);\n },\n [_getHighlightedLegend],\n );\n\n /**\n * This function checks if none of the legends is selected or hovered.\n */\n const _noLegendHighlighted = React.useCallback(() => {\n return _getHighlightedLegend().length === 0;\n }, [_getHighlightedLegend]);\n\n const _showCallout = React.useCallback(\n (target: SVGElement, point: IGanttChartDataPoint) => {\n if (!(_noLegendHighlighted() || _legendHighlighted(point.legend)) || _calloutAnchorPoint.current === point) {\n return;\n }\n\n _calloutAnchorPoint.current = point;\n setCalloutTarget(target);\n setCalloutVisible(true);\n setCalloutLegend(point.legend!);\n setCalloutColor(point.color!);\n setXCalloutValue(point.yAxisCalloutData || point.y.toString());\n setYCalloutValue(point.xAxisCalloutData! || _getFormattedXValue(point));\n setDataPointCalloutProps(point);\n },\n [_getFormattedXValue, _legendHighlighted, _noLegendHighlighted],\n );\n\n const _onBarFocus = React.useCallback(\n (point: IGanttChartDataPoint, focusEvent: React.FocusEvent<SVGElement>): void => {\n _showCallout(focusEvent.currentTarget, point);\n },\n [_showCallout],\n );\n\n const _onBarHover = React.useCallback(\n (point: IGanttChartDataPoint, mouseEvent: React.MouseEvent<SVGElement>): void => {\n _showCallout(mouseEvent.currentTarget, point);\n },\n [_showCallout],\n );\n\n const _createBars = React.useCallback(\n (xScale: DateScale | NumberScale, yScale: NumberScale | StringScale): React.JSX.Element[] => {\n const bars = _points.map((point: IGanttChartDataPoint, index: number) => {\n const shouldHighlight = _noLegendHighlighted() || _legendHighlighted(point.legend);\n\n let startColor = point.color!;\n let endColor = startColor;\n if (props.enableGradient) {\n startColor = point.gradient![0];\n endColor = point.gradient![1];\n }\n const gradientId = `${_gradientId.current}_${index}`;\n\n const startX = xScale(point.x.start);\n const endX = xScale(point.x.end);\n const y =\n (_yAxisType.current === YAxisType.StringAxis\n ? (yScale as StringScale)(point.y as string)! + (yScale as StringScale).bandwidth() / 2\n : (yScale as NumberScale)(point.y as number)) -\n _barHeight.current / 2;\n\n return (\n <React.Fragment key={index}>\n {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 x={Math.min(startX, endX)}\n y={y}\n width={Math.abs(endX - startX)}\n height={_barHeight.current}\n rx={props.roundCorners ? 3 : 0}\n fill={props.enableGradient ? `url(#${gradientId})` : startColor}\n opacity={shouldHighlight ? 1 : 0.1}\n onClick={point.onClick}\n onMouseOver={event => _onBarHover(point, event)}\n onMouseLeave={_onBarLeave}\n onFocus={event => _onBarFocus(point, event)}\n onBlur={_onBarLeave}\n data-is-focusable={shouldHighlight}\n role=\"img\"\n aria-label={_getAriaLabel(point)}\n />\n </React.Fragment>\n );\n });\n return bars;\n },\n [\n _getAriaLabel,\n _legendHighlighted,\n _noLegendHighlighted,\n _onBarFocus,\n _onBarHover,\n props.enableGradient,\n props.roundCorners,\n _points,\n ],\n );\n\n const _getGraphData = React.useCallback(\n (\n xScale: DateScale | NumberScale,\n yScale: NumberScale | StringScale,\n containerHeight: number,\n containerWidth: number,\n xAxisElement: SVGElement | null,\n yAxisElement: SVGElement | null,\n ) => {\n return (_bars.current = _createBars(xScale, yScale));\n },\n [_createBars],\n );\n\n const _onBarLeave = (): void => {\n // do nothing\n };\n\n const _handleChartMouseLeave = React.useCallback((): void => {\n _calloutAnchorPoint.current = null;\n setCalloutTarget(null);\n setCalloutVisible(false);\n setCalloutLegend('');\n setCalloutColor('');\n setXCalloutValue('');\n setYCalloutValue('');\n setDataPointCalloutProps(undefined);\n }, []);\n\n const _closeCallout = () => {\n setCalloutVisible(false);\n };\n\n const _onLegendHover = (legend: string): void => {\n setHoveredLegend(legend);\n };\n\n const _onLegendLeave = (): void => {\n setHoveredLegend('');\n };\n\n const _getLegendData = (): React.JSX.Element => {\n const actions: ILegend[] = [];\n\n Object.keys(_legendColorMap.current).forEach((legendTitle: string) => {\n const legend: ILegend = {\n title: legendTitle,\n color: _legendColorMap.current[legendTitle][0],\n hoverAction: () => {\n _handleChartMouseLeave();\n _onLegendHover(legendTitle);\n },\n onMouseOutAction: () => {\n _onLegendLeave();\n },\n };\n\n actions.push(legend);\n });\n\n const legends = (\n <Legends\n legends={actions}\n enabledWrapLines={props.enabledLegendsWrapLines}\n overflowProps={props.legendsOverflowProps}\n focusZonePropsInHoverCard={props.focusZonePropsForLegendsInHoverCard}\n overflowText={props.legendsOverflowText}\n onChange={_onLegendSelectionChange}\n ref={_legendsRef}\n {...props.legendProps}\n />\n );\n return legends;\n };\n\n const _onLegendSelectionChange = (\n _selectedLegends: string[],\n event: React.MouseEvent<HTMLButtonElement>,\n currentLegend?: ILegend,\n ): void => {\n if (props.legendProps?.canSelectMultipleLegends) {\n setSelectedLegends(_selectedLegends);\n } else {\n setSelectedLegends(_selectedLegends.slice(-1));\n }\n if (props.legendProps?.onChange) {\n props.legendProps.onChange(_selectedLegends, event, currentLegend);\n }\n };\n\n const _getChartTitle = (): string => {\n const { chartTitle } = props;\n return (chartTitle ? `${chartTitle}. ` : '') + `Gantt chart with ${_points.length} bars. `;\n };\n\n const _isChartEmpty = (): boolean => {\n return !(props.data && props.data.length > 0);\n };\n\n const _getYDomainMargins = React.useCallback(\n (containerHeight: number): IMargins => {\n _domainMargin.current = MIN_DOMAIN_MARGIN;\n\n const ySet = new Set<string | number>();\n _points.forEach((point: IGanttChartDataPoint) => {\n ySet.add(point.y);\n });\n const uniqueY = Array.from(ySet);\n\n /** Total height available to render the bars */\n const totalHeight =\n containerHeight - (margins.current.top! + MIN_DOMAIN_MARGIN) - (margins.current.bottom! + MIN_DOMAIN_MARGIN);\n\n if (_yAxisType.current !== YAxisType.StringAxis) {\n _barHeight.current = Math.max(\n props.barHeight ||\n calculateAppropriateBarWidth(uniqueY as number[] | Date[], totalHeight, _yAxisPadding.current),\n 1,\n );\n _domainMargin.current += _barHeight.current / 2;\n }\n\n return {\n ...margins.current,\n top: margins.current.top! + _domainMargin.current,\n bottom: margins.current.bottom! + _domainMargin.current,\n };\n },\n [props.barHeight, _points],\n );\n\n const _getOrderedYAxisLabels = () => {\n return sortAxisCategories(_mapCategoryToValues(), yAxisCategoryOrder);\n };\n\n const _mapCategoryToValues = () => {\n const categoryToValues: Record<string, number[]> = {};\n _points.forEach(point => {\n if (!categoryToValues[point.y]) {\n categoryToValues[point.y] = [];\n }\n // FIXME\n // categoryToValues[point.y].push(point.x.end - point.x.start);\n });\n return categoryToValues;\n };\n\n const _renderBars = React.useCallback(() => {\n return <g>{_bars.current}</g>;\n }, []);\n\n if (!_isChartEmpty()) {\n _adjustProps();\n\n const yAxisLabels = _getOrderedYAxisLabels();\n const legendBars: React.JSX.Element = _getLegendData();\n const calloutProps = {\n isCalloutVisible,\n directionalHint: DirectionalHint.topAutoEdge,\n id: `toolTip${_calloutId.current}`,\n target: calloutTarget,\n isBeakVisible: false,\n gapSpace: 15,\n color: calloutColor,\n legend: calloutLegend,\n XValue: xCalloutValue,\n YValue: yCalloutValue,\n onDismiss: _closeCallout,\n preventDismissOnLostFocus: true,\n ...props.calloutProps,\n };\n const tickParams = {\n tickValues: props.tickValues,\n tickFormat: props.tickFormat,\n };\n\n return (\n <CartesianChart\n {...props}\n yAxisPadding={_yAxisPadding.current}\n chartTitle={_getChartTitle()}\n points={_points}\n chartType={ChartTypes.GanttChart}\n xAxisType={_xAxisType.current}\n yAxisType={_yAxisType.current}\n stringDatasetForYAxisDomain={yAxisLabels}\n calloutProps={calloutProps}\n tickParams={tickParams}\n legendBars={legendBars}\n createYAxis={createYAxisForHorizontalBarChartWithAxis}\n getDomainNRangeValues={_getDomainNRangeValues}\n createStringYAxis={createStringYAxisForHorizontalBarChartWithAxis}\n getMinMaxOfYAxis={findHBCWANumericMinMaxOfY}\n focusZoneDirection={FocusZoneDirection.vertical}\n customizedCallout={_getCustomizedCallout()}\n getmargins={_getMargins}\n getYDomainMargins={_getYDomainMargins}\n getGraphData={_getGraphData}\n onChartMouseLeave={_handleChartMouseLeave}\n ref={_cartesianChartRef}\n useUTC={useUTC}\n children={_renderBars}\n />\n );\n } else {\n return (\n <div\n id={_emptyChartId.current}\n role={'alert'}\n style={{ opacity: '0' }}\n aria-label={'Graph has no data to display'}\n />\n );\n }\n});\n\nGanttChartBase.displayName = 'GanttChart';\n"]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { styled } from '@fluentui/react/lib/Utilities';
|
|
2
|
+
import { GanttChartBase } from './GanttChart.base';
|
|
3
|
+
import { getStyles } from './GanttChart.styles';
|
|
4
|
+
// Create a GanttChart variant which uses these default styles and this styled subcomponent.
|
|
5
|
+
/**
|
|
6
|
+
* GanttChart component.
|
|
7
|
+
* {@docCategory GanttChart}
|
|
8
|
+
*/
|
|
9
|
+
export var GanttChart = styled(GanttChartBase, getStyles);
|
|
10
|
+
//# sourceMappingURL=GanttChart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GanttChart.js","sourceRoot":"../src/","sources":["components/GanttChart/GanttChart.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,+BAA+B,CAAC;AAEvD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAEhD,4FAA4F;AAC5F;;;GAGG;AACH,MAAM,CAAC,IAAM,UAAU,GAA8C,MAAM,CAIzE,cAAc,EAAE,SAAS,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { styled } from '@fluentui/react/lib/Utilities';\nimport { IGanttChartProps, IGanttChartStyleProps, IGanttChartStyles } from '../../index';\nimport { GanttChartBase } from './GanttChart.base';\nimport { getStyles } from './GanttChart.styles';\n\n// Create a GanttChart variant which uses these default styles and this styled subcomponent.\n/**\n * GanttChart component.\n * {@docCategory GanttChart}\n */\nexport const GanttChart: React.FunctionComponent<IGanttChartProps> = styled<\n IGanttChartProps,\n IGanttChartStyleProps,\n IGanttChartStyles\n>(GanttChartBase, getStyles);\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GanttChart.styles.js","sourceRoot":"../src/","sources":["components/GanttChart/GanttChart.styles.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,IAAM,SAAS,GAAG,UAAC,KAA4B;IACpD,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC","sourcesContent":["import { IGanttChartStyleProps, IGanttChartStyles } from '../../index';\n\nexport const getStyles = (props: IGanttChartStyleProps): IGanttChartStyles => {\n return {};\n};\n"]}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import { IRenderFunction, IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';
|
|
2
|
+
import { ICartesianChartProps, ICartesianChartStyleProps, ICartesianChartStyles, IGanttChartDataPoint } from '../../index';
|
|
3
|
+
/**
|
|
4
|
+
* Gantt Chart properties
|
|
5
|
+
* {@docCategory GanttChart}
|
|
6
|
+
*/
|
|
7
|
+
export interface IGanttChartProps extends ICartesianChartProps {
|
|
8
|
+
/**
|
|
9
|
+
* Data to render in the chart.
|
|
10
|
+
*/
|
|
11
|
+
data?: IGanttChartDataPoint[];
|
|
12
|
+
/**
|
|
13
|
+
* Define a custom callout renderer for a data point.
|
|
14
|
+
*/
|
|
15
|
+
onRenderCalloutPerDataPoint?: IRenderFunction<IGanttChartDataPoint>;
|
|
16
|
+
/**
|
|
17
|
+
* Width of each bar in the chart.
|
|
18
|
+
*/
|
|
19
|
+
barHeight?: number;
|
|
20
|
+
/**
|
|
21
|
+
* chart title for the chart
|
|
22
|
+
*/
|
|
23
|
+
chartTitle?: string;
|
|
24
|
+
/**
|
|
25
|
+
* Call to provide customized styling that will layer on top of the variant rules.
|
|
26
|
+
*/
|
|
27
|
+
styles?: IStyleFunctionOrObject<IGanttChartStyleProps, IGanttChartStyles>;
|
|
28
|
+
/**
|
|
29
|
+
* The prop used to define the culture to localized the numbers
|
|
30
|
+
*/
|
|
31
|
+
culture?: string;
|
|
32
|
+
/**
|
|
33
|
+
* it's padding between bar's or lines in the graph
|
|
34
|
+
*/
|
|
35
|
+
yAxisPadding?: number;
|
|
36
|
+
/**
|
|
37
|
+
*@default false
|
|
38
|
+
*Used for to elipse y axis labes and show tooltip on x axis labels
|
|
39
|
+
*/
|
|
40
|
+
showYAxisLablesTooltip?: boolean;
|
|
41
|
+
/**
|
|
42
|
+
*@default false
|
|
43
|
+
*Used for showing complete y axis lables */
|
|
44
|
+
showYAxisLables?: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* @default false
|
|
47
|
+
* The prop used to enable gradient fill color for the chart.
|
|
48
|
+
*/
|
|
49
|
+
enableGradient?: boolean;
|
|
50
|
+
/**
|
|
51
|
+
* @default false
|
|
52
|
+
* The prop used to enable rounded corners for the bars.
|
|
53
|
+
*/
|
|
54
|
+
roundCorners?: boolean;
|
|
55
|
+
}
|
|
56
|
+
/**
|
|
57
|
+
* Gantt Chart style properties
|
|
58
|
+
* {@docCategory GanttChart}
|
|
59
|
+
*/
|
|
60
|
+
export interface IGanttChartStyleProps extends ICartesianChartStyleProps {
|
|
61
|
+
}
|
|
62
|
+
/**
|
|
63
|
+
* Gantt Chart styles
|
|
64
|
+
* {@docCategory GanttChart}
|
|
65
|
+
*/
|
|
66
|
+
export interface IGanttChartStyles extends ICartesianChartStyles {
|
|
67
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GanttChart.types.js","sourceRoot":"../src/","sources":["components/GanttChart/GanttChart.types.ts"],"names":[],"mappings":"","sourcesContent":["import { IRenderFunction, IStyleFunctionOrObject } from '@fluentui/react/lib/Utilities';\nimport {\n ICartesianChartProps,\n ICartesianChartStyleProps,\n ICartesianChartStyles,\n IGanttChartDataPoint,\n} from '../../index';\n\n/**\n * Gantt Chart properties\n * {@docCategory GanttChart}\n */\nexport interface IGanttChartProps extends ICartesianChartProps {\n /**\n * Data to render in the chart.\n */\n data?: IGanttChartDataPoint[];\n\n /**\n * Define a custom callout renderer for a data point.\n */\n onRenderCalloutPerDataPoint?: IRenderFunction<IGanttChartDataPoint>;\n\n /**\n * Width of each bar in the chart.\n */\n barHeight?: number;\n\n /**\n * chart title for the chart\n */\n chartTitle?: string;\n\n /**\n * Call to provide customized styling that will layer on top of the variant rules.\n */\n styles?: IStyleFunctionOrObject<IGanttChartStyleProps, IGanttChartStyles>;\n\n /**\n * The prop used to define the culture to localized the numbers\n */\n culture?: string;\n\n /**\n * it's padding between bar's or lines in the graph\n */\n yAxisPadding?: number;\n\n /**\n *@default false\n *Used for to elipse y axis labes and show tooltip on x axis labels\n */\n showYAxisLablesTooltip?: boolean;\n\n /**\n *@default false\n *Used for showing complete y axis lables */\n showYAxisLables?: 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 bars.\n */\n roundCorners?: boolean;\n}\n\n/**\n * Gantt Chart style properties\n * {@docCategory GanttChart}\n */\nexport interface IGanttChartStyleProps extends ICartesianChartStyleProps {}\n\n/**\n * Gantt Chart styles\n * {@docCategory GanttChart}\n */\nexport interface IGanttChartStyles extends ICartesianChartStyles {}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/GanttChart/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './GanttChart';\nexport * from './GanttChart.types';\n"]}
|
|
@@ -52,6 +52,7 @@ export declare class LineChartBase extends React.Component<ILineChartProps, ILin
|
|
|
52
52
|
private _yPaddingSecondary;
|
|
53
53
|
private _hasMarkersMode;
|
|
54
54
|
private _isXAxisDateType;
|
|
55
|
+
private _isScatterPolar;
|
|
55
56
|
constructor(props: ILineChartProps);
|
|
56
57
|
componentDidUpdate(prevProps: ILineChartProps): void;
|
|
57
58
|
render(): JSX.Element;
|