gifted-charts-core 0.1.75 → 0.1.76
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.
|
@@ -40,8 +40,8 @@ import { computeMaxAndMinXForBubble, computeMaxAndMinYForBubble, getAxesAndRules
|
|
|
40
40
|
} from '../utils';
|
|
41
41
|
import { AxesAndRulesDefaults, BubbleDefaults, chartTypes, LineDefaults } from '../utils/constants';
|
|
42
42
|
export var useBubbleChart = function (props) {
|
|
43
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49;
|
|
44
|
-
var
|
|
43
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18, _19, _20, _21, _22, _23, _24, _25, _26, _27, _28, _29, _30, _31, _32, _33, _34, _35, _36, _37, _38, _39, _40, _41, _42, _43, _44, _45, _46, _47, _48, _49, _50, _51, _52, _53, _54;
|
|
44
|
+
var _55 = props.data, data = _55 === void 0 ? [] : _55, formatXLabel = props.formatXLabel;
|
|
45
45
|
var yNoOfSections = getNoOfSections(props.yNoOfSections, props.maxY, props.yStepValue);
|
|
46
46
|
var containerHeight = (_a = props.height) !== null && _a !== void 0 ? _a : (((_b = props.yStepHeight) !== null && _b !== void 0 ? _b : 0) * yNoOfSections ||
|
|
47
47
|
AxesAndRulesDefaults.containerHeight);
|
|
@@ -50,84 +50,128 @@ export var useBubbleChart = function (props) {
|
|
|
50
50
|
Math, __spreadArray([], __read(data.map(function (i) { return Math.max(i.y, 0); })), false)); // find the smallest +ve number
|
|
51
51
|
var showFractionalYAxis = (_c = props.showFractionalYAxis) !== null && _c !== void 0 ? _c : (isFinite(yRange) && yRange <= 1);
|
|
52
52
|
var roundToDigits = (_d = props.yRoundToDigits) !== null && _d !== void 0 ? _d : (showFractionalYAxis ? indexOfFirstNonZeroDigit(yRange) + 1 : 0);
|
|
53
|
-
var
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
var
|
|
53
|
+
var bubblesRadius = (_e = props.bubblesRadius) !== null && _e !== void 0 ? _e : BubbleDefaults.bubblesRadius;
|
|
54
|
+
var _56 = computeMaxAndMinYForBubble(data, false, // extrapolateMissingValues
|
|
55
|
+
roundToDigits, showFractionalYAxis, data), yMaxItem = _56.maxItem, yMinItem = _56.minItem;
|
|
56
|
+
// Find the maximum radius across all bubbles to account for bubble size in chart bounds
|
|
57
|
+
var maxBubbleRadius = props.hideBubbles
|
|
58
|
+
? 0
|
|
59
|
+
: data.length > 0
|
|
60
|
+
? Math.max.apply(Math, __spreadArray([bubblesRadius], __read(data.map(function (item) { var _a; return (_a = item.r) !== null && _a !== void 0 ? _a : bubblesRadius; })), false)) : bubblesRadius;
|
|
61
|
+
var maxYInitial = getMaxValue(props.maxY, props.yStepValue, yNoOfSections, yMaxItem) || 10;
|
|
62
|
+
var mostNegativeYInitial = (_f = props.mostNegativeY) !== null && _f !== void 0 ? _f : yMinItem;
|
|
63
|
+
var onlyPositive = (_g = props.onlyPositive) !== null && _g !== void 0 ? _g : mostNegativeYInitial >= 0;
|
|
58
64
|
var horizSections = [{ value: '0' }];
|
|
59
|
-
var yStepHeight = (
|
|
60
|
-
|
|
61
|
-
|
|
65
|
+
var yStepHeight = (_h = props.yStepHeight) !== null && _h !== void 0 ? _h : containerHeight / yNoOfSections;
|
|
66
|
+
// Adjust maxY to account for bubble radius at the top of the chart
|
|
67
|
+
// Convert max bubble radius from screen pixels to Y value space
|
|
68
|
+
var maxYRadiusPadding = containerHeight > 0 ? (maxBubbleRadius * maxYInitial) / containerHeight : 0;
|
|
69
|
+
var maxY = (_j = props.maxY) !== null && _j !== void 0 ? _j : maxYInitial + maxYRadiusPadding;
|
|
70
|
+
var yStepValue = (_k = props.yStepValue) !== null && _k !== void 0 ? _k : maxY / yNoOfSections;
|
|
71
|
+
var yNegativeStepValue = (_l = props.yNegativeStepValue) !== null && _l !== void 0 ? _l : yStepValue;
|
|
72
|
+
// Adjust mostNegativeY to account for bubble radius at the bottom of the chart
|
|
73
|
+
// Convert max bubble radius from screen pixels to Y value space for negative values
|
|
74
|
+
// Use an approximation: assume the negative quadrant height is roughly proportional to the absolute value
|
|
75
|
+
var mostNegativeYRadiusPadding = containerHeight > 0 && mostNegativeYInitial < 0
|
|
76
|
+
? (maxBubbleRadius * Math.abs(mostNegativeYInitial)) / containerHeight
|
|
77
|
+
: 0;
|
|
78
|
+
var mostNegativeY = mostNegativeYInitial < 0
|
|
79
|
+
? mostNegativeYInitial - mostNegativeYRadiusPadding
|
|
80
|
+
: mostNegativeYInitial;
|
|
62
81
|
var xRange = Math.max.apply(Math, __spreadArray([], __read(data.map(function (i) { return Math.max(i.x, 0); })), false)) - // find the largest +ve number
|
|
63
82
|
Math.min.apply(// find the largest +ve number
|
|
64
83
|
Math, __spreadArray([], __read(data.map(function (i) { return Math.max(i.x, 0); })), false)); // find the smallest +ve number
|
|
65
|
-
var showFractionalXAxis = (
|
|
66
|
-
var xRoundToDigits = (
|
|
67
|
-
var
|
|
68
|
-
xRoundToDigits, showFractionalXAxis, data), xMaxItem =
|
|
84
|
+
var showFractionalXAxis = (_m = props.showFractionalXAxis) !== null && _m !== void 0 ? _m : (isFinite(xRange) && xRange <= 1);
|
|
85
|
+
var xRoundToDigits = (_o = props.xRoundToDigits) !== null && _o !== void 0 ? _o : (showFractionalXAxis ? indexOfFirstNonZeroDigit(xRange) + 1 : 0);
|
|
86
|
+
var _57 = computeMaxAndMinXForBubble(data, false, // extrapolateMissingValues
|
|
87
|
+
xRoundToDigits, showFractionalXAxis, data), xMaxItem = _57.maxItem, xMinItem = _57.minItem;
|
|
69
88
|
var xNoOfSections = getNoOfSections(props.xNoOfSections, props.maxX, props.xStepValue, true);
|
|
70
|
-
var
|
|
71
|
-
var
|
|
89
|
+
var maxXInitial = getMaxValue(props.maxX, props.xStepValue, xNoOfSections, xMaxItem) || 10;
|
|
90
|
+
var minXInitial = xMinItem;
|
|
91
|
+
// Adjust minX and maxX to account for bubble radius on left and right sides
|
|
92
|
+
// Convert max bubble radius from screen pixels to X value space
|
|
93
|
+
// We'll need spacing and totalWidth for accurate conversion, but we can use an approximation first
|
|
94
|
+
// For now, we'll adjust after we have spacing calculated
|
|
95
|
+
var xRangeInitial = maxXInitial - minXInitial;
|
|
72
96
|
// const xStepHeight = props.xStepHeight ?? containerHeight / yNoOfSections
|
|
73
|
-
|
|
74
|
-
var
|
|
75
|
-
|
|
97
|
+
// Calculate xStepValue based on the range instead of just maxX
|
|
98
|
+
var xStepValue = (_p = props.xStepValue) !== null && _p !== void 0 ? _p : (xRangeInitial > 0
|
|
99
|
+
? xRangeInitial / xNoOfSections
|
|
100
|
+
: maxXInitial / xNoOfSections);
|
|
101
|
+
var initialSpacing = (_q = props.initialSpacing) !== null && _q !== void 0 ? _q : BubbleDefaults.initialSpacing;
|
|
102
|
+
var endSpacing = (_r = props.endSpacing) !== null && _r !== void 0 ? _r : BubbleDefaults.endSpacing;
|
|
103
|
+
// Calculate initial spacing estimate for radius conversion
|
|
104
|
+
// We'll refine this after adjusting minX/maxX
|
|
105
|
+
var estimatedSpacing = (_s = props.spacing) !== null && _s !== void 0 ? _s : (props.width
|
|
106
|
+
? (props.width - initialSpacing - endSpacing) / xNoOfSections
|
|
107
|
+
: BubbleDefaults.spacing);
|
|
108
|
+
// Adjust minX and maxX to account for bubble radius on left and right sides
|
|
109
|
+
// Convert max bubble radius from screen pixels to X value space
|
|
110
|
+
var estimatedXRange = maxXInitial - minXInitial;
|
|
111
|
+
// Calculate scale: pixels per unit in data space
|
|
112
|
+
// estimatedSpacing is pixels per section, so scale = (pixels/section) / (dataUnits/section)
|
|
113
|
+
var estimatedXScale = estimatedXRange > 0 && estimatedSpacing > 0
|
|
114
|
+
? (estimatedSpacing * xNoOfSections) / estimatedXRange
|
|
115
|
+
: 1;
|
|
116
|
+
var maxXRadiusPadding = estimatedXScale > 0 ? maxBubbleRadius / estimatedXScale : 0;
|
|
117
|
+
var minXRadiusPadding = estimatedXScale > 0 ? maxBubbleRadius / estimatedXScale : 0;
|
|
118
|
+
var minX = minXInitial - minXRadiusPadding;
|
|
119
|
+
var maxX = (_t = props.maxX) !== null && _t !== void 0 ? _t : maxXInitial + maxXRadiusPadding;
|
|
120
|
+
var xRangeAdjusted = maxX - minX;
|
|
121
|
+
// Recalculate xStepValue based on adjusted range
|
|
122
|
+
var xStepValueAdjusted = (_u = props.xStepValue) !== null && _u !== void 0 ? _u : (xRangeAdjusted > 0 ? xRangeAdjusted / xNoOfSections : xStepValue);
|
|
123
|
+
var xAxisLabelTexts = (_v = props.xAxisLabelTexts) !== null && _v !== void 0 ? _v : Array.from({ length: xNoOfSections + 1 }, function (_, i) {
|
|
124
|
+
if (i === 0 && initialSpacing === 0)
|
|
76
125
|
return '';
|
|
77
|
-
var labelText = (
|
|
126
|
+
var labelText = (minX + xStepValueAdjusted * i)
|
|
127
|
+
.toFixed(xRoundToDigits)
|
|
128
|
+
.toString();
|
|
78
129
|
if (formatXLabel) {
|
|
79
130
|
return formatXLabel(labelText);
|
|
80
131
|
}
|
|
81
132
|
return labelText;
|
|
82
133
|
});
|
|
83
|
-
var noOfSectionsBelowXAxis = (
|
|
84
|
-
var labelsExtraHeight = (
|
|
85
|
-
var yAxisLabelWidth = (
|
|
134
|
+
var noOfSectionsBelowXAxis = (_w = props.noOfSectionsBelowXAxis) !== null && _w !== void 0 ? _w : Math.round(Math.ceil(-mostNegativeY / yNegativeStepValue));
|
|
135
|
+
var labelsExtraHeight = (_x = props.labelsExtraHeight) !== null && _x !== void 0 ? _x : 0;
|
|
136
|
+
var yAxisLabelWidth = (_y = props.yAxisLabelWidth) !== null && _y !== void 0 ? _y : (props.hideYAxisText
|
|
86
137
|
? AxesAndRulesDefaults.yAxisEmptyLabelWidth
|
|
87
138
|
: AxesAndRulesDefaults.yAxisLabelWidth);
|
|
88
139
|
var horizontal = false;
|
|
89
140
|
var yAxisAtTop = false;
|
|
90
|
-
var
|
|
91
|
-
var
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
// let space = props.spacing ?? spacing
|
|
96
|
-
// data.forEach((item) => {
|
|
97
|
-
// spacingSum += item.spacing ?? space
|
|
98
|
-
// cumulativeSpacing.push(spacingSum)
|
|
99
|
-
// })
|
|
100
|
-
var endSpacing = (_v = props.endSpacing) !== null && _v !== void 0 ? _v : LineDefaults.endSpacing;
|
|
141
|
+
var xAxisThickness = (_z = props.xAxisThickness) !== null && _z !== void 0 ? _z : AxesAndRulesDefaults.xAxisThickness;
|
|
142
|
+
var spacing = (_0 = props.spacing) !== null && _0 !== void 0 ? _0 : (props.width
|
|
143
|
+
? (props.width - initialSpacing - endSpacing) /
|
|
144
|
+
(xAxisLabelTexts.length - 1)
|
|
145
|
+
: BubbleDefaults.spacing);
|
|
101
146
|
var totalWidth = initialSpacing + spacing * (xAxisLabelTexts.length - 1) + endSpacing;
|
|
102
|
-
var disableScroll = (
|
|
103
|
-
var showScrollIndicator = (
|
|
104
|
-
var scrollToEnd = (
|
|
105
|
-
var scrollAnimation = (
|
|
106
|
-
var scrollEventThrottle = (
|
|
107
|
-
var focusEnabled = (
|
|
108
|
-
var showBubbleOnFocus = (
|
|
109
|
-
var
|
|
110
|
-
var
|
|
111
|
-
var
|
|
112
|
-
var
|
|
113
|
-
var
|
|
114
|
-
var isAnimated = (
|
|
147
|
+
var disableScroll = (_1 = props.disableScroll) !== null && _1 !== void 0 ? _1 : false;
|
|
148
|
+
var showScrollIndicator = (_2 = props.showScrollIndicator) !== null && _2 !== void 0 ? _2 : false;
|
|
149
|
+
var scrollToEnd = (_3 = props.scrollToEnd) !== null && _3 !== void 0 ? _3 : false;
|
|
150
|
+
var scrollAnimation = (_4 = props.scrollAnimation) !== null && _4 !== void 0 ? _4 : false;
|
|
151
|
+
var scrollEventThrottle = (_5 = props.scrollEventThrottle) !== null && _5 !== void 0 ? _5 : 16;
|
|
152
|
+
var focusEnabled = (_6 = props.focusEnabled) !== null && _6 !== void 0 ? _6 : LineDefaults.focusEnabled;
|
|
153
|
+
var showBubbleOnFocus = (_7 = props.showBubbleOnFocus) !== null && _7 !== void 0 ? _7 : BubbleDefaults.showBubbleOnFocus;
|
|
154
|
+
var _58 = __read(useState((_8 = props.focusedBubbleIndex) !== null && _8 !== void 0 ? _8 : -1), 2), selectedIndex = _58[0], setSelectedIndex = _58[1];
|
|
155
|
+
var _59 = __read(useState(''), 2), points = _59[0], setPoints = _59[1];
|
|
156
|
+
var _60 = __read(useState(-1), 2), pointerIndex = _60[0], setPointerIndex = _60[1];
|
|
157
|
+
var _61 = __read(useState(0), 2), pointerX = _61[0], setPointerX = _61[1];
|
|
158
|
+
var _62 = __read(useState(0), 2), pointerY = _62[0], setPointerY = _62[1];
|
|
159
|
+
var isAnimated = (_9 = props.isAnimated) !== null && _9 !== void 0 ? _9 : false;
|
|
115
160
|
var horizontalRulesStyle = props.horizontalRulesStyle;
|
|
116
|
-
var yAxisOffset = (
|
|
117
|
-
var showXAxisIndices = (
|
|
118
|
-
var xAxisIndicesHeight = (
|
|
119
|
-
var xAxisIndicesWidth = (
|
|
120
|
-
var xAxisIndicesColor = (
|
|
161
|
+
var yAxisOffset = (_10 = props.yAxisOffset) !== null && _10 !== void 0 ? _10 : 0;
|
|
162
|
+
var showXAxisIndices = (_11 = props.showXAxisIndices) !== null && _11 !== void 0 ? _11 : AxesAndRulesDefaults.showXAxisIndices;
|
|
163
|
+
var xAxisIndicesHeight = (_12 = props.xAxisIndicesHeight) !== null && _12 !== void 0 ? _12 : AxesAndRulesDefaults.xAxisIndicesHeight;
|
|
164
|
+
var xAxisIndicesWidth = (_13 = props.xAxisIndicesWidth) !== null && _13 !== void 0 ? _13 : AxesAndRulesDefaults.xAxisIndicesWidth;
|
|
165
|
+
var xAxisIndicesColor = (_14 = props.xAxisIndicesColor) !== null && _14 !== void 0 ? _14 : AxesAndRulesDefaults.xAxisIndicesColor;
|
|
121
166
|
// const pointerConfig = props.pointerConfig
|
|
122
|
-
var getPointerProps = (
|
|
123
|
-
var
|
|
124
|
-
var bubblesWidth = (_12 = props.bubblesWidth) !== null && _12 !== void 0 ? _12 : BubbleDefaults.bubblesWidth;
|
|
167
|
+
var getPointerProps = (_15 = props.getPointerProps) !== null && _15 !== void 0 ? _15 : null;
|
|
168
|
+
var bubblesWidth = (_16 = props.bubblesWidth) !== null && _16 !== void 0 ? _16 : BubbleDefaults.bubblesWidth;
|
|
125
169
|
var extraWidthDueToBubble = props.hideBubbles
|
|
126
170
|
? 0
|
|
127
171
|
: bubblesRadius !== null && bubblesRadius !== void 0 ? bubblesRadius : bubblesWidth;
|
|
128
|
-
var xAxisLabelsAtBottom = (
|
|
129
|
-
var allowFontScaling = (
|
|
130
|
-
var animationDuration = (
|
|
172
|
+
var xAxisLabelsAtBottom = (_17 = props.xAxisLabelsAtBottom) !== null && _17 !== void 0 ? _17 : false;
|
|
173
|
+
var allowFontScaling = (_18 = props.allowFontScaling) !== null && _18 !== void 0 ? _18 : AxesAndRulesDefaults.allowFontScaling;
|
|
174
|
+
var animationDuration = (_19 = props.animationDuration) !== null && _19 !== void 0 ? _19 : LineDefaults.animationDuration;
|
|
131
175
|
var secondaryMaxValue = maxY;
|
|
132
176
|
var secondaryMinItem = maxY * -1;
|
|
133
177
|
var showSecondaryFractionalValues = false;
|
|
@@ -137,16 +181,17 @@ export var useBubbleChart = function (props) {
|
|
|
137
181
|
var extendedContainerHeight = getExtendedContainerHeightWithPadding(containerHeight, 0);
|
|
138
182
|
var containerHeightIncludingBelowXAxis = extendedContainerHeight + fourthQuadrantHeight;
|
|
139
183
|
var mostNegativeValueOnYAxis = yNegativeStepValue * noOfSectionsBelowXAxis;
|
|
140
|
-
var containsNegativeValue = ((
|
|
141
|
-
((
|
|
142
|
-
|
|
184
|
+
var containsNegativeValue = ((_20 = props.mostNegativeY) !== null && _20 !== void 0 ? _20 : 0) < 0 ||
|
|
185
|
+
((_21 = props.data) === null || _21 === void 0 ? void 0 : _21.some(function (item) { var _a; return ((_a = item.y) !== null && _a !== void 0 ? _a : 0) < 0; }));
|
|
186
|
+
// Use adjusted xStepValue for scale calculation
|
|
187
|
+
var xScale = spacing / xStepValueAdjusted;
|
|
143
188
|
var getX = function (index) {
|
|
144
189
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
145
190
|
var val = ((_a = props.data) === null || _a === void 0 ? void 0 : _a[index].x) !== undefined
|
|
146
|
-
? ((_c = (_b = props.data) === null || _b === void 0 ? void 0 : _b[index].x) !== null && _c !== void 0 ? _c : 0) * xScale
|
|
191
|
+
? (((_c = (_b = props.data) === null || _b === void 0 ? void 0 : _b[index].x) !== null && _c !== void 0 ? _c : 0) - minX) * xScale // redundant ?? just to avoid lint highlighting
|
|
147
192
|
: Math.min(totalWidth -
|
|
148
193
|
((_e = (_d = props.data) === null || _d === void 0 ? void 0 : _d[index].r) !== null && _e !== void 0 ? _e : BubbleDefaults.bubblesRadius), ((index + 1) * totalWidth) / ((_g = (_f = props.data) === null || _f === void 0 ? void 0 : _f.length) !== null && _g !== void 0 ? _g : 1));
|
|
149
|
-
return val;
|
|
194
|
+
return val + initialSpacing;
|
|
150
195
|
};
|
|
151
196
|
var getY = function (value) {
|
|
152
197
|
if (containsNegativeValue &&
|
|
@@ -157,22 +202,13 @@ export var useBubbleChart = function (props) {
|
|
|
157
202
|
}
|
|
158
203
|
return extendedContainerHeight - (value * containerHeight) / maxY;
|
|
159
204
|
};
|
|
160
|
-
var showTextOnFocus = (
|
|
161
|
-
var showBubbleLabelOnFocus = (
|
|
162
|
-
var focusTogether = (
|
|
163
|
-
var
|
|
205
|
+
var showTextOnFocus = (_22 = props.showTextOnFocus) !== null && _22 !== void 0 ? _22 : LineDefaults.showTextOnFocus;
|
|
206
|
+
var showBubbleLabelOnFocus = (_23 = props.showBubbleLabelOnFocus) !== null && _23 !== void 0 ? _23 : BubbleDefaults.showBubbleLabelOnFocus;
|
|
207
|
+
var focusTogether = (_24 = props.focusTogether) !== null && _24 !== void 0 ? _24 : true;
|
|
208
|
+
var _63 = __read(useState(-1), 2), selectedLineNumber = _63[0], setSelectedLineNumber = _63[1];
|
|
164
209
|
var lastLineNumber = 1;
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
// }
|
|
168
|
-
// if (props.data2) lastLineNumber = 2
|
|
169
|
-
// if (props.data3) lastLineNumber = 3
|
|
170
|
-
// if (props.data4) lastLineNumber = 4
|
|
171
|
-
// if (props.data5) lastLineNumber = 5
|
|
172
|
-
// if ((props.dataSet?.length ?? 0) > lastLineNumber)
|
|
173
|
-
// lastLineNumber = props.dataSet?.length ?? 0
|
|
174
|
-
var unFocusOnPressOut = (_21 = props.unFocusOnPressOut) !== null && _21 !== void 0 ? _21 : LineDefaults.unFocusOnPressOut;
|
|
175
|
-
var delayBeforeUnFocus = (_22 = props.delayBeforeUnFocus) !== null && _22 !== void 0 ? _22 : LineDefaults.delayBeforeUnFocus;
|
|
210
|
+
var unFocusOnPressOut = (_25 = props.unFocusOnPressOut) !== null && _25 !== void 0 ? _25 : LineDefaults.unFocusOnPressOut;
|
|
211
|
+
var delayBeforeUnFocus = (_26 = props.delayBeforeUnFocus) !== null && _26 !== void 0 ? _26 : LineDefaults.delayBeforeUnFocus;
|
|
176
212
|
var handleFocus = function (index) {
|
|
177
213
|
setSelectedIndex(index);
|
|
178
214
|
};
|
|
@@ -181,27 +217,23 @@ export var useBubbleChart = function (props) {
|
|
|
181
217
|
setTimeout(function () { return setSelectedIndex(-1); }, delayBeforeUnFocus);
|
|
182
218
|
}
|
|
183
219
|
};
|
|
184
|
-
var hideBubbles = (
|
|
185
|
-
var bubblesShape = (
|
|
186
|
-
var bubblesHeight = (
|
|
187
|
-
var bubblesColor = (
|
|
188
|
-
// const textFontSize = props.textFontSize ?? LineDefaults.textFontSize
|
|
189
|
-
// const textColor = props.textColor ?? LineDefaults.textColor
|
|
190
|
-
// const textFontFamily = props.textFontFamily
|
|
191
|
-
// const textFontWeight = props.textFontWeight
|
|
220
|
+
var hideBubbles = (_27 = props.hideBubbles) !== null && _27 !== void 0 ? _27 : false;
|
|
221
|
+
var bubblesShape = (_28 = props.bubblesShape) !== null && _28 !== void 0 ? _28 : BubbleDefaults.bubblesShape;
|
|
222
|
+
var bubblesHeight = (_29 = props.bubblesHeight) !== null && _29 !== void 0 ? _29 : BubbleDefaults.bubblesHeight;
|
|
223
|
+
var bubblesColor = (_30 = props.bubblesColor) !== null && _30 !== void 0 ? _30 : BubbleDefaults.bubblesColor;
|
|
192
224
|
var startIndex = 0;
|
|
193
|
-
var endIndex = (
|
|
194
|
-
var labelFontSize = (
|
|
195
|
-
var showValuesAsBubbleLabels = (
|
|
196
|
-
var xAxisLabelsVerticalShift = (
|
|
225
|
+
var endIndex = (_32 = (_31 = props.data) === null || _31 === void 0 ? void 0 : _31.length) !== null && _32 !== void 0 ? _32 : 0;
|
|
226
|
+
var labelFontSize = (_33 = props.labelFontSize) !== null && _33 !== void 0 ? _33 : BubbleDefaults.labelFontSize;
|
|
227
|
+
var showValuesAsBubbleLabels = (_34 = props.showValuesAsBubbleLabels) !== null && _34 !== void 0 ? _34 : BubbleDefaults.showValuesAsBubbleLabels;
|
|
228
|
+
var xAxisLabelsVerticalShift = (_35 = props.xAxisLabelsVerticalShift) !== null && _35 !== void 0 ? _35 : (xAxisLabelsAtBottom
|
|
197
229
|
? fourthQuadrantHeight
|
|
198
230
|
: AxesAndRulesDefaults.xAxisLabelsVerticalShift);
|
|
199
|
-
var xAxisTextNumberOfLines = (
|
|
200
|
-
var rotateLabel = (
|
|
201
|
-
var borderWidth = (
|
|
202
|
-
var borderColor = (
|
|
203
|
-
var opacity = (
|
|
204
|
-
var showRegressionLine = (
|
|
231
|
+
var xAxisTextNumberOfLines = (_36 = props.xAxisTextNumberOfLines) !== null && _36 !== void 0 ? _36 : AxesAndRulesDefaults.xAxisTextNumberOfLines;
|
|
232
|
+
var rotateLabel = (_37 = props.rotateLabel) !== null && _37 !== void 0 ? _37 : false;
|
|
233
|
+
var borderWidth = (_38 = props.borderWidth) !== null && _38 !== void 0 ? _38 : BubbleDefaults.borderWidth;
|
|
234
|
+
var borderColor = (_39 = props.borderColor) !== null && _39 !== void 0 ? _39 : BubbleDefaults.borderColor;
|
|
235
|
+
var opacity = (_40 = props.opacity) !== null && _40 !== void 0 ? _40 : BubbleDefaults.opacity;
|
|
236
|
+
var showRegressionLine = (_41 = props.showRegressionLine) !== null && _41 !== void 0 ? _41 : false;
|
|
205
237
|
var weightedRegression = function () {
|
|
206
238
|
var e_1, _a;
|
|
207
239
|
if (!data)
|
|
@@ -251,21 +283,22 @@ export var useBubbleChart = function (props) {
|
|
|
251
283
|
// Calculate Y values in data space first
|
|
252
284
|
var y1_data = slope * minX + intercept;
|
|
253
285
|
var y2_data = slope * maxX + intercept;
|
|
254
|
-
// Convert X coordinates to screen space
|
|
255
|
-
regressionLineX1 =
|
|
256
|
-
regressionLineX2 = maxX * xScale;
|
|
286
|
+
// Convert X coordinates to screen space (matching getX formula)
|
|
287
|
+
regressionLineX1 = initialSpacing;
|
|
288
|
+
regressionLineX2 = (maxX - minX) * xScale + initialSpacing;
|
|
257
289
|
// Convert Y coordinates to screen space using getY function
|
|
258
290
|
regressionLineY1 = getY(y1_data);
|
|
259
291
|
regressionLineY2 = getY(y2_data);
|
|
260
292
|
}
|
|
261
293
|
var regressionLineConfig = {
|
|
262
|
-
thickness: (
|
|
263
|
-
color: (
|
|
264
|
-
opacity: (
|
|
265
|
-
strokeDashArray: (
|
|
266
|
-
isAnimated: (
|
|
267
|
-
animationDuration: (
|
|
294
|
+
thickness: (_43 = (_42 = props.regressionLineConfig) === null || _42 === void 0 ? void 0 : _42.thickness) !== null && _43 !== void 0 ? _43 : BubbleDefaults.regressionLineConfig.thickness,
|
|
295
|
+
color: (_45 = (_44 = props.regressionLineConfig) === null || _44 === void 0 ? void 0 : _44.color) !== null && _45 !== void 0 ? _45 : BubbleDefaults.regressionLineConfig.color,
|
|
296
|
+
opacity: (_47 = (_46 = props.regressionLineConfig) === null || _46 === void 0 ? void 0 : _46.opacity) !== null && _47 !== void 0 ? _47 : BubbleDefaults.regressionLineConfig.opacity,
|
|
297
|
+
strokeDashArray: (_48 = props.regressionLineConfig) === null || _48 === void 0 ? void 0 : _48.strokeDashArray,
|
|
298
|
+
isAnimated: (_50 = (_49 = props.regressionLineConfig) === null || _49 === void 0 ? void 0 : _49.isAnimated) !== null && _50 !== void 0 ? _50 : isAnimated,
|
|
299
|
+
animationDuration: (_52 = (_51 = props.regressionLineConfig) === null || _51 === void 0 ? void 0 : _51.animationDuration) !== null && _52 !== void 0 ? _52 : animationDuration
|
|
268
300
|
};
|
|
301
|
+
var scatterChart = (_53 = props.scatterChart) !== null && _53 !== void 0 ? _53 : BubbleDefaults.scatterChart;
|
|
269
302
|
var barAndLineChartsWrapperProps = {
|
|
270
303
|
chartType: chartTypes.BUBBLE,
|
|
271
304
|
containerHeight: containerHeight,
|
|
@@ -329,7 +362,7 @@ export var useBubbleChart = function (props) {
|
|
|
329
362
|
pointerY: pointerY,
|
|
330
363
|
onEndReached: props.onEndReached,
|
|
331
364
|
onStartReached: props.onStartReached,
|
|
332
|
-
endReachedOffset: (
|
|
365
|
+
endReachedOffset: (_54 = props.endReachedOffset) !== null && _54 !== void 0 ? _54 : LineDefaults.endReachedOffset,
|
|
333
366
|
onMomentumScrollEnd: props.onMomentumScrollEnd,
|
|
334
367
|
extraWidthDueToDataPoint: extraWidthDueToBubble,
|
|
335
368
|
customBackground: props.customBackground,
|
|
@@ -391,6 +424,7 @@ export var useBubbleChart = function (props) {
|
|
|
391
424
|
regressionLineX1: regressionLineX1,
|
|
392
425
|
regressionLineY1: regressionLineY1,
|
|
393
426
|
regressionLineX2: regressionLineX2,
|
|
394
|
-
regressionLineY2: regressionLineY2
|
|
427
|
+
regressionLineY2: regressionLineY2,
|
|
428
|
+
scatterChart: scatterChart
|
|
395
429
|
};
|
|
396
430
|
};
|
|
@@ -163,6 +163,7 @@ export interface BubbleChartPropsType {
|
|
|
163
163
|
getPointerProps?: Function;
|
|
164
164
|
formatYLabel?: (label: string) => string;
|
|
165
165
|
formatXLabel?: (label: string) => string;
|
|
166
|
+
formatBubbleLabel?: (label: string) => string;
|
|
166
167
|
lineGradient?: boolean;
|
|
167
168
|
lineGradientComponent?: () => any;
|
|
168
169
|
lineGradientId?: string;
|
|
@@ -203,6 +204,7 @@ export interface BubbleChartPropsType {
|
|
|
203
204
|
borderOpacity?: number;
|
|
204
205
|
showRegressionLine?: boolean;
|
|
205
206
|
regressionLineConfig?: RegressionLineConfig;
|
|
207
|
+
scatterChart?: boolean;
|
|
206
208
|
}
|
|
207
209
|
export interface bubbleDataItem {
|
|
208
210
|
y: number;
|
|
@@ -192,11 +192,14 @@ export declare const BubbleDefaults: {
|
|
|
192
192
|
bubblesColor: string;
|
|
193
193
|
focusedBubbleColor: string;
|
|
194
194
|
initialSpacing: number;
|
|
195
|
+
endSpacing: number;
|
|
196
|
+
spacing: number;
|
|
195
197
|
regressionLineConfig: {
|
|
196
198
|
thickness: number;
|
|
197
199
|
color: string;
|
|
198
200
|
opacity: number;
|
|
199
201
|
};
|
|
202
|
+
scatterChart: boolean;
|
|
200
203
|
};
|
|
201
204
|
export declare const defaultLineConfig: defaultLineConfigType;
|
|
202
205
|
export declare const defaultPointerConfig: {
|
package/dist/utils/constants.js
CHANGED
|
@@ -205,11 +205,14 @@ export var BubbleDefaults = {
|
|
|
205
205
|
bubblesColor: 'skyblue',
|
|
206
206
|
focusedBubbleColor: 'orange',
|
|
207
207
|
initialSpacing: 0,
|
|
208
|
+
endSpacing: 20,
|
|
209
|
+
spacing: 50,
|
|
208
210
|
regressionLineConfig: {
|
|
209
211
|
thickness: 1,
|
|
210
212
|
color: 'black',
|
|
211
213
|
opacity: 1
|
|
212
|
-
}
|
|
214
|
+
},
|
|
215
|
+
scatterChart: false
|
|
213
216
|
};
|
|
214
217
|
export var defaultLineConfig = {
|
|
215
218
|
initialSpacing: BarDefaults.spacing, // gets updated to spacing before being used
|