bento-charts 2.4.1 → 2.5.0
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/dist/ChartConfigProvider.js +1 -12
- package/dist/ChartConfigProvider.js.map +1 -1
- package/dist/Components/Charts/BentoBarChart.d.ts +1 -1
- package/dist/Components/Charts/BentoBarChart.js +25 -37
- package/dist/Components/Charts/BentoBarChart.js.map +1 -1
- package/dist/Components/Charts/BentoPie.d.ts +1 -1
- package/dist/Components/Charts/BentoPie.js +55 -47
- package/dist/Components/Charts/BentoPie.js.map +1 -1
- package/dist/Components/Charts/ChartWrapper.d.ts +6 -0
- package/dist/Components/Charts/ChartWrapper.js +10 -0
- package/dist/Components/Charts/ChartWrapper.js.map +1 -0
- package/dist/Components/Maps/BentoChoroplethMap.d.ts +1 -1
- package/dist/Components/Maps/BentoChoroplethMap.js +15 -32
- package/dist/Components/Maps/BentoChoroplethMap.js.map +1 -1
- package/dist/Components/Maps/BentoMapContainer.js +1 -12
- package/dist/Components/Maps/BentoMapContainer.js.map +1 -1
- package/dist/Components/Maps/BentoPointMap.js +4 -15
- package/dist/Components/Maps/BentoPointMap.js.map +1 -1
- package/dist/Components/Maps/controls/MapLegendContinuous.js +1 -12
- package/dist/Components/Maps/controls/MapLegendContinuous.js.map +1 -1
- package/dist/Components/Maps/controls/MapLegendDiscrete.js +2 -13
- package/dist/Components/Maps/controls/MapLegendDiscrete.js.map +1 -1
- package/dist/Components/NoData.js +2 -13
- package/dist/Components/NoData.js.map +1 -1
- package/dist/constants/chartConstants.d.ts +0 -3
- package/dist/constants/chartConstants.js +2 -3
- package/dist/constants/chartConstants.js.map +1 -1
- package/dist/types/chartTypes.d.ts +10 -6
- package/dist/types/mapTypes.d.ts +2 -3
- package/dist/util/chartUtils.d.ts +2 -0
- package/dist/util/chartUtils.js +30 -0
- package/dist/util/chartUtils.js.map +1 -1
- package/package.json +17 -16
- package/src/Components/Charts/BentoBarChart.tsx +46 -53
- package/src/Components/Charts/BentoPie.tsx +63 -56
- package/src/Components/Charts/ChartWrapper.tsx +15 -0
- package/src/Components/Maps/BentoChoroplethMap.tsx +4 -12
- package/src/Components/Maps/BentoPointMap.tsx +13 -4
- package/src/constants/chartConstants.ts +2 -3
- package/src/types/chartTypes.ts +13 -7
- package/src/types/mapTypes.ts +3 -3
- package/src/util/chartUtils.ts +29 -0
- package/webpack.config.js +9 -1
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import React, { useContext } from 'react';
|
|
14
3
|
import { DEFAULT_CHART_THEME, defaultTranslationObject } from './constants/chartConstants';
|
|
@@ -47,7 +36,7 @@ var ChartConfigProvider = function (_a) {
|
|
|
47
36
|
threshold: globalThreshold !== null && globalThreshold !== void 0 ? globalThreshold : DEFAULT_CONTEXT.threshold,
|
|
48
37
|
maxLabelChars: maxLabelChars !== null && maxLabelChars !== void 0 ? maxLabelChars : DEFAULT_CONTEXT.maxLabelChars,
|
|
49
38
|
};
|
|
50
|
-
return _jsx(ChartContext.Provider,
|
|
39
|
+
return _jsx(ChartContext.Provider, { value: contextValue, children: children });
|
|
51
40
|
};
|
|
52
41
|
export default ChartConfigProvider;
|
|
53
42
|
//# sourceMappingURL=ChartConfigProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartConfigProvider.js","sourceRoot":"","sources":["../src/ChartConfigProvider.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ChartConfigProvider.js","sourceRoot":"","sources":["../src/ChartConfigProvider.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,4BAA4B,CAAC;AAU3F,IAAM,eAAe,GAAqB;IACxC,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,wBAAwB,CAAC,EAAE;IACxC,SAAS,EAAE,CAAC;IACZ,aAAa,EAAE,EAAE;CAClB,CAAC;AAEF,IAAM,YAAY,GAAG,KAAK,CAAC,aAAa,CAAmB,eAAe,CAAC,CAAC;AAE5E,MAAM,UAAU,aAAa;IAC3B,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC,KAAK,CAAC;AACxC,CAAC;AAED,MAAM,UAAU,mBAAmB;IACjC,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC,WAAW,CAAC;AAC9C,CAAC;AAED,MAAM,UAAU,iBAAiB;IAC/B,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC;AAC5C,CAAC;AAED,MAAM,UAAU,qBAAqB;IACnC,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC,aAAa,CAAC;AAChD,CAAC;AAED,IAAM,mBAAmB,GAAG,UAAC,EAOF;QANzB,KAAK,WAAA,EACL,GAAG,SAAA,EACH,cAAc,oBAAA,EACd,QAAQ,cAAA,EACR,eAAe,qBAAA,EACf,aAAa,mBAAA;IAEb,IAAI,IAAI,GAAiB,IAAI,CAAC;IAC9B,IAAI;QACF,IAAI,GAAG,GAAmB,CAAC;KAC5B;IAAC,OAAO,CAAC,EAAE;QACV,OAAO,CAAC,KAAK,CAAC,iCAAiC,CAAC,CAAC;QACjD,OAAO,IAAI,CAAC;KACb;IACD,IAAM,YAAY,GAAG;QACnB,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,eAAe,CAAC,KAAK;QACrC,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,wBAAwB,CAAC,IAAI,CAAC;QACnF,SAAS,EAAE,eAAe,aAAf,eAAe,cAAf,eAAe,GAAI,eAAe,CAAC,SAAS;QACvD,aAAa,EAAE,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,eAAe,CAAC,aAAa;KAC9D,CAAC;IACF,OAAO,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YAAG,QAAQ,GAAyB,CAAC;AACxF,CAAC,CAAC;AAWF,eAAe,mBAAmB,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { BarChartProps } from '../../types/chartTypes';
|
|
2
|
-
declare const BentoBarChart: ({
|
|
2
|
+
declare const BentoBarChart: ({ height, width, units, title, onClick, colorTheme, ...params }: BarChartProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default BentoBarChart;
|
|
@@ -1,62 +1,50 @@
|
|
|
1
|
-
var
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
7
9
|
}
|
|
8
|
-
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
13
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
14
|
-
if (ar || !(i in from)) {
|
|
15
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
16
|
-
ar[i] = from[i];
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
10
|
+
return t;
|
|
20
11
|
};
|
|
21
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
22
|
-
import {
|
|
23
|
-
import {
|
|
13
|
+
import { useCallback } from 'react';
|
|
14
|
+
import { BarChart, Bar, Cell, XAxis, YAxis, Tooltip, Label, ResponsiveContainer } from 'recharts';
|
|
15
|
+
import { TOOL_TIP_STYLE, COUNT_STYLE, LABEL_STYLE, MAX_TICK_LABEL_CHARS, TITLE_STYLE, TICKS_SHOW_ALL_LABELS_BELOW, UNITS_LABEL_OFFSET, TICK_MARGIN, } from '../../constants/chartConstants';
|
|
24
16
|
import { useChartTheme, useChartTranslation } from '../../ChartConfigProvider';
|
|
25
17
|
import NoData from '../NoData';
|
|
18
|
+
import { useTransformedChartData } from '../../util/chartUtils';
|
|
19
|
+
import ChartWrapper from './ChartWrapper';
|
|
26
20
|
var tickFormatter = function (tickLabel) {
|
|
27
21
|
if (tickLabel.length <= MAX_TICK_LABEL_CHARS) {
|
|
28
22
|
return tickLabel;
|
|
29
23
|
}
|
|
30
24
|
return "".concat(tickLabel.substring(0, MAX_TICK_LABEL_CHARS), "...");
|
|
31
25
|
};
|
|
26
|
+
var BAR_CHART_MARGINS = { top: 10, bottom: 100, right: 20 };
|
|
32
27
|
var BentoBarChart = function (_a) {
|
|
33
|
-
var
|
|
28
|
+
var height = _a.height, width = _a.width, units = _a.units, title = _a.title, onClick = _a.onClick, _b = _a.colorTheme, colorTheme = _b === void 0 ? 'default' : _b, params = __rest(_a, ["height", "width", "units", "title", "onClick", "colorTheme"]);
|
|
34
29
|
var t = useChartTranslation();
|
|
35
|
-
var
|
|
30
|
+
var _c = useChartTheme().bar[colorTheme], chartFill = _c.fill, missing = _c.missing;
|
|
36
31
|
var fill = function (entry) { return (entry.x === 'missing' ? missing : chartFill); };
|
|
37
|
-
data =
|
|
38
|
-
if (preFilter)
|
|
39
|
-
data = data.filter(preFilter);
|
|
40
|
-
if (dataMap)
|
|
41
|
-
data = data.map(dataMap);
|
|
42
|
-
if (postFilter)
|
|
43
|
-
data = data.filter(postFilter);
|
|
44
|
-
if (removeEmpty)
|
|
45
|
-
data = data.filter(function (d) { return d.y !== 0; });
|
|
46
|
-
if (data.length === 0)
|
|
47
|
-
return _jsx(NoData, { height: height });
|
|
32
|
+
var data = useTransformedChartData(params, true);
|
|
48
33
|
var totalCount = data.reduce(function (sum, e) { return sum + e.y; }, 0);
|
|
49
|
-
var onHover = function (_data, _index, e) {
|
|
34
|
+
var onHover = useCallback(function (_data, _index, e) {
|
|
50
35
|
var target = e.target;
|
|
51
36
|
if (onClick && target)
|
|
52
37
|
target.style.cursor = 'pointer';
|
|
53
|
-
};
|
|
38
|
+
}, [onClick]);
|
|
39
|
+
if (data.length === 0) {
|
|
40
|
+
return _jsx(NoData, { height: height });
|
|
41
|
+
}
|
|
54
42
|
// Regarding XAxis.ticks below:
|
|
55
43
|
// The weird conditional is added from https://github.com/recharts/recharts/issues/2593#issuecomment-1311678397
|
|
56
44
|
// Basically, if data is empty, Recharts will default to a domain of [0, "auto"] and our tickFormatter trips up
|
|
57
45
|
// on formatting a non-string. This hack manually overrides the ticks for the axis and blanks it out.
|
|
58
46
|
// - David L, 2023-01-03
|
|
59
|
-
return (_jsxs(
|
|
47
|
+
return (_jsxs(ChartWrapper, { children: [_jsx("div", { style: TITLE_STYLE, children: title }), _jsx(ResponsiveContainer, { width: width !== null && width !== void 0 ? width : "100%", height: height, children: _jsxs(BarChart, { data: data, margin: BAR_CHART_MARGINS, children: [_jsx(XAxis, { dataKey: "x", height: 20, angle: -45, ticks: data.length ? undefined : [''], tickFormatter: tickFormatter, tickMargin: TICK_MARGIN, textAnchor: "end", interval: data.length < TICKS_SHOW_ALL_LABELS_BELOW ? 0 : 'preserveStartEnd', children: _jsx(Label, { value: units, offset: UNITS_LABEL_OFFSET, position: "insideBottom" }) }), _jsx(YAxis, { children: _jsx(Label, { value: t['Count'], offset: -10, position: "left", angle: 270 }) }), _jsx(Tooltip, { content: _jsx(BarTooltip, { totalCount: totalCount }) }), _jsx(Bar, { dataKey: "y", isAnimationActive: false, onClick: onClick, onMouseEnter: onHover, children: data.map(function (entry) { return (_jsx(Cell, { fill: fill(entry) }, entry.x)); }) })] }) })] }));
|
|
60
48
|
};
|
|
61
49
|
var BarTooltip = function (_a) {
|
|
62
50
|
var _b, _c, _d;
|
|
@@ -67,7 +55,7 @@ var BarTooltip = function (_a) {
|
|
|
67
55
|
var name = (payload && ((_c = (_b = payload[0]) === null || _b === void 0 ? void 0 : _b.payload) === null || _c === void 0 ? void 0 : _c.x)) || '';
|
|
68
56
|
var value = (payload && ((_d = payload[0]) === null || _d === void 0 ? void 0 : _d.value)) || 0;
|
|
69
57
|
var percentage = totalCount ? Math.round((value / totalCount) * 100) : 0;
|
|
70
|
-
return (_jsxs("div",
|
|
58
|
+
return (_jsxs("div", { style: TOOL_TIP_STYLE, children: [_jsx("p", { style: LABEL_STYLE, children: name }), _jsxs("p", { style: COUNT_STYLE, children: [value, " (", percentage, "%)"] })] }));
|
|
71
59
|
};
|
|
72
60
|
export default BentoBarChart;
|
|
73
61
|
//# sourceMappingURL=BentoBarChart.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BentoBarChart.js","sourceRoot":"","sources":["../../../src/Components/Charts/BentoBarChart.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BentoBarChart.js","sourceRoot":"","sources":["../../../src/Components/Charts/BentoBarChart.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { PieChartProps } from '../../types/chartTypes';
|
|
2
|
-
declare const BentoPie: ({
|
|
2
|
+
declare const BentoPie: ({ height, width, onClick, sort, colorTheme, chartThreshold, maxLabelChars, ...params }: PieChartProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default BentoPie;
|
|
@@ -9,6 +9,17 @@ var __assign = (this && this.__assign) || function () {
|
|
|
9
9
|
};
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
+
var t = {};
|
|
14
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
+
t[p] = s[p];
|
|
16
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
+
t[p[i]] = s[p[i]];
|
|
20
|
+
}
|
|
21
|
+
return t;
|
|
22
|
+
};
|
|
12
23
|
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
13
24
|
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
14
25
|
if (ar || !(i in from)) {
|
|
@@ -18,13 +29,14 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
18
29
|
}
|
|
19
30
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
20
31
|
};
|
|
21
|
-
import { jsx as _jsx, jsxs as _jsxs
|
|
22
|
-
import { useState } from 'react';
|
|
23
|
-
import { PieChart, Pie, Cell, Curve, Tooltip, Sector } from 'recharts';
|
|
24
|
-
import { TOOL_TIP_STYLE, LABEL_STYLE, COUNT_STYLE, CHART_MISSING_FILL,
|
|
32
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
33
|
+
import { useCallback, useMemo, useState } from 'react';
|
|
34
|
+
import { PieChart, Pie, Cell, Curve, Tooltip, Sector, ResponsiveContainer, } from 'recharts';
|
|
35
|
+
import { TOOL_TIP_STYLE, LABEL_STYLE, COUNT_STYLE, CHART_MISSING_FILL, RADIAN, LABEL_THRESHOLD, COUNT_TEXT_STYLE, TEXT_STYLE, } from '../../constants/chartConstants';
|
|
25
36
|
import { useChartTheme, useChartTranslation, useChartThreshold, useChartMaxLabelChars, } from '../../ChartConfigProvider';
|
|
26
|
-
import { polarToCartesian } from '../../util/chartUtils';
|
|
37
|
+
import { polarToCartesian, useTransformedChartData } from '../../util/chartUtils';
|
|
27
38
|
import NoData from '../NoData';
|
|
39
|
+
import ChartWrapper from './ChartWrapper';
|
|
28
40
|
var labelShortName = function (name, maxChars) {
|
|
29
41
|
if (name.length <= maxChars) {
|
|
30
42
|
return name;
|
|
@@ -33,57 +45,51 @@ var labelShortName = function (name, maxChars) {
|
|
|
33
45
|
return "".concat(name.substring(0, maxChars - 3), "\u2026");
|
|
34
46
|
};
|
|
35
47
|
var BentoPie = function (_a) {
|
|
36
|
-
var
|
|
48
|
+
var height = _a.height, width = _a.width, onClick = _a.onClick, _b = _a.sort, sort = _b === void 0 ? true : _b, _c = _a.colorTheme, colorTheme = _c === void 0 ? 'default' : _c, _d = _a.chartThreshold, chartThreshold = _d === void 0 ? useChartThreshold() : _d, _e = _a.maxLabelChars, maxLabelChars = _e === void 0 ? useChartMaxLabelChars() : _e, params = __rest(_a, ["height", "width", "onClick", "sort", "colorTheme", "chartThreshold", "maxLabelChars"]);
|
|
37
49
|
var t = useChartTranslation();
|
|
38
50
|
var theme = useChartTheme().pie[colorTheme];
|
|
39
|
-
var
|
|
51
|
+
var _f = useState(undefined), activeIndex = _f[0], setActiveIndex = _f[1];
|
|
40
52
|
// ##################### Data processing #####################
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
data =
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
data =
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
x: t['Other'],
|
|
63
|
-
y: sum - data.reduce(function (acc, e) { return acc + e.y; }, 0),
|
|
64
|
-
});
|
|
65
|
-
}
|
|
53
|
+
var transformedData = useTransformedChartData(params, true, sort);
|
|
54
|
+
var _g = useMemo(function () {
|
|
55
|
+
var data = __spreadArray([], transformedData, true);
|
|
56
|
+
// combining sections with less than chartThreshold
|
|
57
|
+
var sum = data.reduce(function (acc, e) { return acc + e.y; }, 0);
|
|
58
|
+
var length = data.length;
|
|
59
|
+
var threshold = chartThreshold * sum;
|
|
60
|
+
var dataAboveThreshold = data.filter(function (e) { return e.y > threshold; });
|
|
61
|
+
// length - 1 intentional: if there is just one category below threshold, the "Other" category is not necessary.
|
|
62
|
+
data = dataAboveThreshold.length === length - 1 ? data : dataAboveThreshold;
|
|
63
|
+
if (data.length !== length) {
|
|
64
|
+
data.push({
|
|
65
|
+
x: t['Other'],
|
|
66
|
+
y: sum - data.reduce(function (acc, e) { return acc + e.y; }, 0),
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
return {
|
|
70
|
+
data: data.map(function (e) { return ({ name: e.x, value: e.y }); }),
|
|
71
|
+
sum: sum,
|
|
72
|
+
};
|
|
73
|
+
}, [transformedData, sort, chartThreshold]), data = _g.data, sum = _g.sum;
|
|
66
74
|
if (data.length === 0) {
|
|
67
75
|
return _jsx(NoData, { height: height });
|
|
68
76
|
}
|
|
69
|
-
var bentoFormatData = data.map(function (e) { return ({ name: e.x, value: e.y }); });
|
|
70
77
|
// ##################### Rendering #####################
|
|
71
|
-
var onEnter = function (_data, index) {
|
|
78
|
+
var onEnter = useCallback(function (_data, index) {
|
|
72
79
|
setActiveIndex(index);
|
|
73
|
-
};
|
|
74
|
-
var onHover = function (data, _index, e) {
|
|
80
|
+
}, []);
|
|
81
|
+
var onHover = useCallback(function (data, _index, e) {
|
|
75
82
|
var target = e.target;
|
|
76
83
|
if (onClick && target && data.name !== t['Other'])
|
|
77
84
|
target.style.cursor = 'pointer';
|
|
78
|
-
};
|
|
79
|
-
var onLeave = function () {
|
|
85
|
+
}, [onClick]);
|
|
86
|
+
var onLeave = useCallback(function () {
|
|
80
87
|
setActiveIndex(undefined);
|
|
81
|
-
};
|
|
82
|
-
return (_jsx(
|
|
83
|
-
var fill = theme[index % theme.length];
|
|
84
|
-
fill = entry.x.toLowerCase() === 'missing' ? CHART_MISSING_FILL : fill;
|
|
88
|
+
}, []);
|
|
89
|
+
return (_jsx(ChartWrapper, { children: _jsx(ResponsiveContainer, { width: width !== null && width !== void 0 ? width : "100%", height: height, children: _jsxs(PieChart, { children: [_jsx(Pie, { data: data, dataKey: "value", cx: "50%", cy: "50%", innerRadius: "25%", outerRadius: "55%", label: renderLabel(maxLabelChars), labelLine: false, isAnimationActive: false, onMouseEnter: onEnter, onMouseLeave: onLeave, onMouseOver: onHover, activeIndex: activeIndex, activeShape: RenderActiveLabel, onClick: onClick, children: data.map(function (entry, index) {
|
|
90
|
+
var fill = entry.name.toLowerCase() === 'missing' ? CHART_MISSING_FILL : theme[index % theme.length];
|
|
85
91
|
return _jsx(Cell, { fill: fill }, index);
|
|
86
|
-
}) })
|
|
92
|
+
}) }), _jsx(Tooltip, { content: _jsx(CustomTooltip, { totalCount: sum }), isAnimationActive: false, allowEscapeViewBox: { x: true, y: true } })] }) }) }));
|
|
87
93
|
};
|
|
88
94
|
var toNumber = function (val, defaultValue) {
|
|
89
95
|
if (val && typeof val === 'string') {
|
|
@@ -94,8 +100,8 @@ var toNumber = function (val, defaultValue) {
|
|
|
94
100
|
}
|
|
95
101
|
return defaultValue || 0;
|
|
96
102
|
};
|
|
97
|
-
var
|
|
98
|
-
|
|
103
|
+
var renderLabel = function (maxLabelChars) {
|
|
104
|
+
var BentoPieLabel = function (params) {
|
|
99
105
|
var fill = params.fill, payload = params.payload, index = params.index, activeIndex = params.activeIndex;
|
|
100
106
|
var percent = params.percent || 0;
|
|
101
107
|
var midAngle = params.midAngle || 0;
|
|
@@ -123,8 +129,10 @@ var RenderLabel = function (maxLabelChars) {
|
|
|
123
129
|
var startPoint = polarToCartesian(cx, cy, outerRadius, midAngle);
|
|
124
130
|
var endPoint = polarToCartesian(cx, cy, outerRadius + offsetRadius, midAngle);
|
|
125
131
|
var lineProps = __assign(__assign({}, params), { fill: 'none', stroke: fill, points: [startPoint, endPoint] });
|
|
126
|
-
return (_jsxs("g", { children: [_jsx(Curve, __assign({}, lineProps, { type: "linear", className: "recharts-pie-label-line" })), _jsx("path", { d: "M".concat(sx, ",").concat(sy, "L").concat(mx, ",").concat(my, "L").concat(ex, ",").concat(ey), stroke: fill, fill: "none" }), _jsx("circle", { cx: ex, cy: ey, r: 2, fill: fill, stroke: "none" }), _jsx("text",
|
|
132
|
+
return (_jsxs("g", { children: [_jsx(Curve, __assign({}, lineProps, { type: "linear", className: "recharts-pie-label-line" })), _jsx("path", { d: "M".concat(sx, ",").concat(sy, "L").concat(mx, ",").concat(my, "L").concat(ex, ",").concat(ey), stroke: fill, fill: "none" }), _jsx("circle", { cx: ex, cy: ey, r: 2, fill: fill, stroke: "none" }), _jsx("text", { x: ex + (cos >= 0 ? 1 : -1) * 12, y: ey + 3, textAnchor: textAnchor, style: currentTextStyle, children: labelShortName(name, maxLabelChars) }), _jsx("text", { x: ex + (cos >= 0 ? 1 : -1) * 12, y: ey, dy: 14, textAnchor: textAnchor, style: COUNT_TEXT_STYLE, children: "(".concat(payload.value, ")") })] }));
|
|
127
133
|
};
|
|
134
|
+
BentoPieLabel.displayName = BentoPieLabel;
|
|
135
|
+
return BentoPieLabel;
|
|
128
136
|
};
|
|
129
137
|
var RenderActiveLabel = function (params) {
|
|
130
138
|
var cx = params.cx, cy = params.cy, innerRadius = params.innerRadius, outerRadius = params.outerRadius, startAngle = params.startAngle, endAngle = params.endAngle, fill = params.fill;
|
|
@@ -139,7 +147,7 @@ var CustomTooltip = function (_a) {
|
|
|
139
147
|
var name = payload ? payload[0].name : '';
|
|
140
148
|
var value = payload ? payload[0].value : 0;
|
|
141
149
|
var percentage = totalCount ? Math.round((value / totalCount) * 100) : 0;
|
|
142
|
-
return name !== 'other' ? (_jsxs("div",
|
|
150
|
+
return name !== 'other' ? (_jsxs("div", { style: TOOL_TIP_STYLE, children: [_jsx("p", { style: LABEL_STYLE, children: name }), _jsxs("p", { style: COUNT_STYLE, children: [' ', value, " (", percentage, "%)"] })] })) : (_jsx("div", { children: "No data" }));
|
|
143
151
|
};
|
|
144
152
|
export default BentoPie;
|
|
145
153
|
//# sourceMappingURL=BentoPie.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BentoPie.js","sourceRoot":"","sources":["../../../src/Components/Charts/BentoPie.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BentoPie.js","sourceRoot":"","sources":["../../../src/Components/Charts/BentoPie.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef } from 'react';
|
|
3
|
+
import { CHART_WRAPPER_STYLE } from '../../constants/chartConstants';
|
|
4
|
+
var ChartWrapper = forwardRef(function (_a, ref) {
|
|
5
|
+
var children = _a.children;
|
|
6
|
+
return (_jsx("div", { style: CHART_WRAPPER_STYLE, ref: ref, children: children }));
|
|
7
|
+
});
|
|
8
|
+
ChartWrapper.displayName = "ChartWrapper";
|
|
9
|
+
export default ChartWrapper;
|
|
10
|
+
//# sourceMappingURL=ChartWrapper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartWrapper.js","sourceRoot":"","sources":["../../../src/Components/Charts/ChartWrapper.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAgB,UAAU,EAAa,MAAM,OAAO,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAAgC,CAAC;AAMrE,IAAM,YAAY,GAAG,UAAU,CAAC,UAAC,EAA6B,EAAE,GAAiC;QAA/D,QAAQ,cAAA;IAA4D,OAAA,CACpG,cAAK,KAAK,EAAE,mBAAmB,EAAE,GAAG,EAAE,GAAG,YACtC,QAAQ,GACL,CACP;AAJqG,CAIrG,CAAC,CAAC;AACH,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC;AAE1C,eAAe,YAAY,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { ChoroplethMapProps } from '../../types/mapTypes';
|
|
2
|
-
declare const BentoChoroplethMap: ({ height,
|
|
2
|
+
declare const BentoChoroplethMap: ({ height, center, zoom, tileLayer, colorMode, features, categoryProp, onClick, renderPopupBody, ...params }: ChoroplethMapProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
export default BentoChoroplethMap;
|
|
@@ -1,22 +1,13 @@
|
|
|
1
|
-
var
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
1
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
2
|
+
var t = {};
|
|
3
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
4
|
+
t[p] = s[p];
|
|
5
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
6
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
8
|
+
t[p[i]] = s[p[i]];
|
|
7
9
|
}
|
|
8
|
-
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
13
|
-
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
|
14
|
-
if (ar || !(i in from)) {
|
|
15
|
-
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
|
16
|
-
ar[i] = from[i];
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
return to.concat(ar || Array.prototype.slice.call(from));
|
|
10
|
+
return t;
|
|
20
11
|
};
|
|
21
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
22
13
|
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
@@ -25,20 +16,12 @@ import { interpolateRgb } from 'd3-interpolate';
|
|
|
25
16
|
import BentoMapContainer from './BentoMapContainer';
|
|
26
17
|
import MapLegendContinuous from './controls/MapLegendContinuous';
|
|
27
18
|
import MapLegendDiscrete from './controls/MapLegendDiscrete';
|
|
19
|
+
import { useTransformedChartData } from '../../util/chartUtils';
|
|
28
20
|
var DEFAULT_CATEGORY = '';
|
|
29
21
|
var POS_BOTTOM_RIGHT = 'bottomright';
|
|
30
22
|
var BentoChoroplethMap = function (_a) {
|
|
31
|
-
var height = _a.height,
|
|
32
|
-
var data =
|
|
33
|
-
var data = __spreadArray([], originalData, true);
|
|
34
|
-
if (preFilter)
|
|
35
|
-
data = data.filter(preFilter);
|
|
36
|
-
if (dataMap)
|
|
37
|
-
data = data.map(dataMap);
|
|
38
|
-
if (postFilter)
|
|
39
|
-
data = data.filter(postFilter);
|
|
40
|
-
return data;
|
|
41
|
-
}, [originalData]);
|
|
23
|
+
var height = _a.height, center = _a.center, zoom = _a.zoom, tileLayer = _a.tileLayer, colorMode = _a.colorMode, features = _a.features, categoryProp = _a.categoryProp, onClick = _a.onClick, renderPopupBody = _a.renderPopupBody, params = __rest(_a, ["height", "center", "zoom", "tileLayer", "colorMode", "features", "categoryProp", "onClick", "renderPopupBody"]);
|
|
24
|
+
var data = useTransformedChartData(params);
|
|
42
25
|
var dataByFeatureCat = useMemo(function () { return Object.fromEntries(data.map(function (d) { return [d.x, d.y]; })); }, [data]);
|
|
43
26
|
var minYVal = useMemo(function () { return Math.min.apply(Math, data.map(function (d) { return d.y; })); }, [data]);
|
|
44
27
|
var maxYVal = useMemo(function () { return Math.max.apply(Math, data.map(function (d) { return d.y; })); }, [data]);
|
|
@@ -69,11 +52,11 @@ var BentoChoroplethMap = function (_a) {
|
|
|
69
52
|
var feature = e.sourceTarget.feature;
|
|
70
53
|
var fProps = (_a = feature.properties) !== null && _a !== void 0 ? _a : {};
|
|
71
54
|
var title = fProps.title ? "".concat(fProps.title, " (").concat(fProps[categoryProp], ")") : fProps[categoryProp];
|
|
72
|
-
setPopupContents(_jsxs("div", { children: [_jsx("h4",
|
|
55
|
+
setPopupContents(_jsxs("div", { children: [_jsx("h4", { style: { marginBottom: renderPopupBody ? 6 : 0 }, children: onClick ? (_jsx("a", { href: "#", onClick: function (e) {
|
|
73
56
|
if (onClick)
|
|
74
57
|
onClick(feature);
|
|
75
58
|
e.preventDefault();
|
|
76
|
-
}
|
|
59
|
+
}, children: title })) : (_jsx("span", { children: title })) }), renderPopupBody ? renderPopupBody(feature, dataByFeatureCat[fProps[categoryProp]]) : null] }));
|
|
77
60
|
},
|
|
78
61
|
});
|
|
79
62
|
}, [onClick, categoryProp, renderPopupBody]);
|
|
@@ -85,7 +68,7 @@ var BentoChoroplethMap = function (_a) {
|
|
|
85
68
|
geoJsonLayer.current.clearLayers().addData(features);
|
|
86
69
|
}
|
|
87
70
|
}, [features]);
|
|
88
|
-
return (_jsxs(BentoMapContainer,
|
|
71
|
+
return (_jsxs(BentoMapContainer, { height: height, center: center, zoom: zoom, tileLayer: tileLayer, children: [_jsx(GeoJSON, { ref: geoJsonLayer, data: features, style: shapeStyle, eventHandlers: eventHandlers, children: _jsx(Popup, { children: popupContents }) }), colorMode.mode === 'continuous' ? (_jsx(MapLegendContinuous, { position: POS_BOTTOM_RIGHT, minColor: colorMode.minColor, minValue: minYVal, maxColor: colorMode.maxColor, maxValue: maxYVal })) : (_jsx(MapLegendDiscrete, { position: POS_BOTTOM_RIGHT, legendItems: colorMode.legendItems }))] }));
|
|
89
72
|
};
|
|
90
73
|
export default BentoChoroplethMap;
|
|
91
74
|
//# sourceMappingURL=BentoChoroplethMap.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BentoChoroplethMap.js","sourceRoot":"","sources":["../../../src/Components/Maps/BentoChoroplethMap.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BentoChoroplethMap.js","sourceRoot":"","sources":["../../../src/Components/Maps/BentoChoroplethMap.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
2
|
import { MapContainer } from 'react-leaflet';
|
|
14
3
|
import L, { Point } from 'leaflet';
|
|
@@ -27,7 +16,7 @@ var defaultIcon = L.icon({
|
|
|
27
16
|
L.Marker.prototype.options.icon = defaultIcon;
|
|
28
17
|
var BentoMapContainer = function (_a) {
|
|
29
18
|
var height = _a.height, center = _a.center, zoom = _a.zoom, children = _a.children, tileLayer = _a.tileLayer;
|
|
30
|
-
return (_jsxs(MapContainer,
|
|
19
|
+
return (_jsxs(MapContainer, { style: { height: height }, center: center, zoom: zoom, children: [tileLayer !== null && tileLayer !== void 0 ? tileLayer : _jsx(BentoOSMTileLayer, {}), children] }));
|
|
31
20
|
};
|
|
32
21
|
export default BentoMapContainer;
|
|
33
22
|
//# sourceMappingURL=BentoMapContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BentoMapContainer.js","sourceRoot":"","sources":["../../../src/Components/Maps/BentoMapContainer.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BentoMapContainer.js","sourceRoot":"","sources":["../../../src/Components/Maps/BentoMapContainer.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,CAAC,EAAE,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;AAEnC,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AAGpD,OAAO,OAAO,MAAM,qCAAqC,CAAC;AAC1D,OAAO,SAAS,MAAM,wCAAwC,CAAC;AAC/D,OAAO,aAAa,MAAM,uCAAuC,CAAC;AAElE,IAAM,WAAW,GAAG,CAAC,CAAC,IAAI,CAAC;IACzB,OAAO,EAAE,OAAO;IAChB,aAAa,EAAE,SAAS;IACxB,QAAQ,EAAE,IAAI,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC;IAC3B,UAAU,EAAE,IAAI,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC;IAC7B,WAAW,EAAE,IAAI,KAAK,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC;IAC9B,SAAS,EAAE,aAAa;CACzB,CAAC,CAAC;AAEH,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,OAAO,CAAC,IAAI,GAAG,WAAW,CAAC;AAM9C,IAAM,iBAAiB,GAAG,UAAC,EAAgE;QAA9D,MAAM,YAAA,EAAE,MAAM,YAAA,EAAE,IAAI,UAAA,EAAE,QAAQ,cAAA,EAAE,SAAS,eAAA;IAA0B,OAAA,CAC9F,MAAC,YAAY,IAAC,KAAK,EAAE,EAAE,MAAM,QAAA,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,aACxD,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,KAAC,iBAAiB,KAAG,EAClC,QAAQ,IACI,CAChB;AAL+F,CAK/F,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -1,28 +1,17 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
2
|
import { Marker, Popup } from 'react-leaflet';
|
|
14
3
|
import BentoMapContainer from './BentoMapContainer';
|
|
15
4
|
var BentoPointMap = function (_a) {
|
|
16
5
|
var height = _a.height, center = _a.center, zoom = _a.zoom, tileLayer = _a.tileLayer, data = _a.data, onClick = _a.onClick, renderPopupBody = _a.renderPopupBody;
|
|
17
|
-
return (_jsx(BentoMapContainer,
|
|
6
|
+
return (_jsx(BentoMapContainer, { height: height, center: center, zoom: zoom, tileLayer: tileLayer, children: data.map(function (point, i) {
|
|
18
7
|
var coordinates = point.coordinates, title = point.title;
|
|
19
8
|
// We expect points in [long, lat] order (consistent with GeoJSON), but Leaflet wants them in [lat, long].
|
|
20
9
|
var coordinatesLatLongOrder = [coordinates[1], coordinates[0]];
|
|
21
|
-
return (_jsx(Marker,
|
|
10
|
+
return (_jsx(Marker, { position: coordinatesLatLongOrder, children: _jsxs(Popup, { children: [_jsx("h4", { style: { marginBottom: renderPopupBody ? 6 : 0 }, children: onClick ? (_jsx("a", { href: "#", onClick: function (e) {
|
|
22
11
|
onClick(point);
|
|
23
12
|
e.preventDefault();
|
|
24
|
-
}
|
|
25
|
-
}) }))
|
|
13
|
+
}, children: title })) : (_jsx(_Fragment, { children: title })) }), renderPopupBody ? renderPopupBody(point) : null] }) }, i));
|
|
14
|
+
}) }));
|
|
26
15
|
};
|
|
27
16
|
export default BentoPointMap;
|
|
28
17
|
//# sourceMappingURL=BentoPointMap.js.map
|