react-native-gifted-charts 1.4.48 → 1.4.50
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/README.md +21 -20
- package/dist/BarChart/RenderBars.js +5 -99
- package/dist/Components/BarSpecificComponents/tooltip.d.ts +1 -13
- package/dist/Components/BarSpecificComponents/tooltip.js +2 -2
- package/dist/LineChart/index.js +77 -142
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
<a href="https://www.npmjs.com/package/react-native-gifted-charts">
|
|
7
7
|
<img src="/demos/npmIcon.png" height="auto" width="28" height="28" />
|
|
8
8
|
</a>
|
|
9
|
-
<a href="https://discord.gg/
|
|
9
|
+
<a href="https://discord.gg/ptdwsw48">
|
|
10
10
|
<img src="/demos/discord.png" height="auto" width="30" height="30" />
|
|
11
11
|
</a>
|
|
12
12
|
</p>
|
|
@@ -16,15 +16,16 @@ The most complete library for Bar, Line, Area, Pie, Donut, Stacked Bar and Popul
|
|
|
16
16
|
|
|
17
17
|
**_To bring Life to your data_**
|
|
18
18
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
19
|
+
* Plenty of features with minimal code
|
|
20
|
+
* Apply animations to your charts on load and on value change, just by adding a prop
|
|
21
|
+
* Smooth animations implemented using LayoutAnimation
|
|
22
|
+
* Clickable and scrollable
|
|
23
|
+
* Three-D and gradient effects
|
|
24
|
+
* Fully customizable (see the [props](docs/doc*md))
|
|
25
|
+
* Detailed [documentation](https://gifted-chart*web.app/) with examples
|
|
26
|
+
* Support for **_combined_** Bar and Line charts
|
|
27
|
+
* Tested to be pixel perfect using [react-native-screenshot-test](https://www.npmjs.com/package/react-native-screenshot-test). See [the screenshot tests here](https://abhinandan-kushwaha.github.io/TestingCharts/ss-test/test.html)
|
|
28
|
+
* Detailed and illustrated [dev docs](docs/dev/index.md) that explain the architecture and working of the library
|
|
28
29
|
|
|
29
30
|
The web counterpart of this library is public now. Try out our new reactJS library- [react-gifted-charts](https://www.npmjs.com/package/react-gifted-charts) <br />
|
|
30
31
|
The exact same piece of code that you write to render charts in react-native, can be used to render charts in reactJS using this library!
|
|
@@ -75,7 +76,8 @@ Please note that `react-native-svg` and `react-native-linear-gradient`/`expo-lin
|
|
|
75
76
|
|
|
76
77
|
# Docs
|
|
77
78
|
|
|
78
|
-
[Documentation and gallery](https://gifted-charts.web.app/)
|
|
79
|
+
* [Documentation and gallery](https://gifted-charts.web.app/) <br />
|
|
80
|
+
* [Architecture and working (dev docs)](docs/dev/index.md)
|
|
79
81
|
|
|
80
82
|
## Usage
|
|
81
83
|
|
|
@@ -107,10 +109,10 @@ const data=[ {value:50}, {value:80}, {value:90}, {value:70} ]
|
|
|
107
109
|
|
|
108
110
|
## Props tables
|
|
109
111
|
|
|
110
|
-
**
|
|
111
|
-
**
|
|
112
|
-
**
|
|
113
|
-
**
|
|
112
|
+
**1. [BarChart, Horizontal BarChart and Stacked Bar Chart props](docs/BarChart/BarChartProps.md)** \
|
|
113
|
+
**2. [LineChart and AreaChart props](docs/LineChart/LineChartProps.md)** \
|
|
114
|
+
**3. [PieChart and DonutChart props](docs/PieChart/PieChartProps.md)** \
|
|
115
|
+
**4. [Population Pyramid props](docs/PopulationPyramid/PopulationPyramid.md)**
|
|
114
116
|
|
|
115
117
|
## Contributing
|
|
116
118
|
|
|
@@ -133,11 +135,10 @@ See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the
|
|
|
133
135
|
|
|
134
136
|
## Test cases
|
|
135
137
|
|
|
136
|
-
Test strategy and cases are discussed here- [TESTS.md](./TESTS.md) <br />
|
|
137
|
-
Pixel perfection is assured using [react-native-screenshot-test](https://www.npmjs.com/package/react-native-screenshot-test). <br/>
|
|
138
|
-
220+ screenshot tests have been written. See the [Reports here](https://abhinandan-kushwaha.github.io/TestingCharts/ss-test/test.html).
|
|
139
|
-
|
|
140
|
-
Screenshot tests are written in a separate repo named [TestingCharts](https://github.com/Abhinandan-Kushwaha/TestingCharts)
|
|
138
|
+
* Test strategy and cases are discussed here- [TESTS.md](./TESTS.md) <br />
|
|
139
|
+
* Pixel perfection is assured using [react-native-screenshot-test](https://www.npmjs.com/package/react-native-screenshot-test). <br/>
|
|
140
|
+
* 220+ screenshot tests have been written. See the [Reports here](https://abhinandan-kushwaha.github.io/TestingCharts/ss-test/test.html).
|
|
141
|
+
* Screenshot tests are written in a separate repo named [TestingCharts](https://github.com/Abhinandan-Kushwaha/TestingCharts)
|
|
141
142
|
|
|
142
143
|
## License
|
|
143
144
|
|
|
@@ -13,21 +13,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
13
13
|
import { View, TouchableOpacity, Animated, Text } from 'react-native';
|
|
14
14
|
import AnimatedThreeDBar from '../Components/AnimatedThreeDBar';
|
|
15
15
|
import Animated2DWithGradient from './Animated2DWithGradient';
|
|
16
|
-
import { getPropsForAnimated2DWithGradient,
|
|
16
|
+
import { getPropsForAnimated2DWithGradient, useRenderBars, } from 'gifted-charts-core';
|
|
17
17
|
import Tooltip from '../Components/BarSpecificComponents/tooltip';
|
|
18
18
|
var RenderBars = function (props) {
|
|
19
|
-
var _a, _b
|
|
20
|
-
var item = props.item, index = props.index, containerHeight = props.containerHeight, maxValue = props.maxValue, minHeight = props.minHeight, spacing = props.spacing,
|
|
21
|
-
var heightFactor =
|
|
22
|
-
|
|
23
|
-
? (secondaryNegativeStepHeight !== null && secondaryNegativeStepHeight !== void 0 ? secondaryNegativeStepHeight : secondaryStepHeight) /
|
|
24
|
-
(secondaryNegativeStepValue !== null && secondaryNegativeStepValue !== void 0 ? secondaryNegativeStepValue : secondaryStepValue)
|
|
25
|
-
: secondaryStepHeight / secondaryStepValue
|
|
26
|
-
: item.value < 0
|
|
27
|
-
? negativeStepHeight / negativeStepValue
|
|
28
|
-
: stepHeight / stepValue;
|
|
29
|
-
var barHeight = Math.max(minHeight, Math.abs(item.value) * heightFactor - xAxisThickness);
|
|
30
|
-
var _j = getPropsForAnimated2DWithGradient(__assign(__assign({}, props), { barHeight: barHeight })), commonStyleForBar = _j.commonStyleForBar, barStyleWithBackground = _j.barStyleWithBackground, commonPropsFor2dAnd3dBars = _j.commonPropsFor2dAnd3dBars, isFocused = _j.isFocused, focusedBarConfig = _j.focusedBarConfig, localFrontColor = _j.localFrontColor;
|
|
19
|
+
var _a, _b;
|
|
20
|
+
var item = props.item, index = props.index, containerHeight = props.containerHeight, maxValue = props.maxValue, minHeight = props.minHeight, spacing = props.spacing, side = props.side, data = props.data, barBorderWidth = props.barBorderWidth, barBorderColor = props.barBorderColor, isThreeD = props.isThreeD, isAnimated = props.isAnimated, rotateLabel = props.rotateLabel, appearingOpacity = props.appearingOpacity, animationDuration = props.animationDuration, autoShiftLabels = props.autoShiftLabels, label = props.label, secondaryLabel = props.secondaryLabel, labelTextStyle = props.labelTextStyle, secondaryLabelTextStyle = props.secondaryLabelTextStyle, xAxisTextNumberOfLines = props.xAxisTextNumberOfLines, xAxisLabelsVerticalShift = props.xAxisLabelsVerticalShift, renderTooltip = props.renderTooltip, selectedIndex = props.selectedIndex, setSelectedIndex = props.setSelectedIndex, horizontal = props.horizontal, rtl = props.rtl, pointerConfig = props.pointerConfig, noOfSectionsBelowXAxis = props.noOfSectionsBelowXAxis, barWidth = props.barWidth, _c = props.labelsDistanceFromXaxis, labelsDistanceFromXaxis = _c === void 0 ? 0 : _c, secondaryXAxis = props.secondaryXAxis, secondaryNoOfSectionsBelowXAxis = props.secondaryNoOfSectionsBelowXAxis, _d = props.barMarginBottom, barMarginBottom = _d === void 0 ? 0 : _d;
|
|
21
|
+
var _e = useRenderBars(props), heightFactor = _e.heightFactor, barHeight = _e.barHeight, tooltipProps = _e.tooltipProps;
|
|
22
|
+
var _f = getPropsForAnimated2DWithGradient(__assign(__assign({}, props), { barHeight: barHeight })), commonStyleForBar = _f.commonStyleForBar, barStyleWithBackground = _f.barStyleWithBackground, commonPropsFor2dAnd3dBars = _f.commonPropsFor2dAnd3dBars, isFocused = _f.isFocused, focusedBarConfig = _f.focusedBarConfig, localFrontColor = _f.localFrontColor;
|
|
31
23
|
var itemOrPropsBarInnerComponent = (_a = item.barInnerComponent) !== null && _a !== void 0 ? _a : props.barInnerComponent;
|
|
32
24
|
var localBarInnerComponent = isFocused
|
|
33
25
|
? ((_b = focusedBarConfig === null || focusedBarConfig === void 0 ? void 0 : focusedBarConfig.barInnerComponent) !== null && _b !== void 0 ? _b : itemOrPropsBarInnerComponent)
|
|
@@ -145,79 +137,6 @@ var RenderBars = function (props) {
|
|
|
145
137
|
labelTextStyle,
|
|
146
138
|
], numberOfLines: xAxisTextNumberOfLines, children: label })) }));
|
|
147
139
|
};
|
|
148
|
-
var leftSpacing = initialSpacing;
|
|
149
|
-
for (var i = 0; i < index; i++) {
|
|
150
|
-
leftSpacing +=
|
|
151
|
-
((_c = data[i].spacing) !== null && _c !== void 0 ? _c : propSpacing) + (data[i].barWidth || barWidth);
|
|
152
|
-
}
|
|
153
|
-
// const static2DWithGradient = (item: barDataItem) => {
|
|
154
|
-
// const localGradientColor =
|
|
155
|
-
// item.gradientColor || props.gradientColor || 'white';
|
|
156
|
-
// return (
|
|
157
|
-
// <>
|
|
158
|
-
// <LinearGradient
|
|
159
|
-
// style={commonStyleForBar}
|
|
160
|
-
// start={{x: 0, y: 0}}
|
|
161
|
-
// end={{x: 0, y: 1}}
|
|
162
|
-
// colors={[
|
|
163
|
-
// isFocused
|
|
164
|
-
// ? (focusedBarConfig?.gradientColor ?? localGradientColor)
|
|
165
|
-
// : localGradientColor,
|
|
166
|
-
// localFrontColor,
|
|
167
|
-
// ]}>
|
|
168
|
-
// {props.cappedBars && item.value ? (
|
|
169
|
-
// <Cap
|
|
170
|
-
// capThicknessFromItem={item.capThickness}
|
|
171
|
-
// capThicknessFromProps={props.capThickness}
|
|
172
|
-
// capColorFromItem={item.capColor}
|
|
173
|
-
// capColorFromProps={props.capColor}
|
|
174
|
-
// capRadiusFromItem={item.capRadius}
|
|
175
|
-
// capRadiusFromProps={props.capRadius}
|
|
176
|
-
// />
|
|
177
|
-
// ) : null}
|
|
178
|
-
// </LinearGradient>
|
|
179
|
-
// {(item.barBackgroundPattern || props.barBackgroundPattern) && (
|
|
180
|
-
// <BarBackgroundPattern
|
|
181
|
-
// barBackgroundPatternFromItem={item.barBackgroundPattern}
|
|
182
|
-
// barBackgroundPatternFromProps={props.barBackgroundPattern}
|
|
183
|
-
// patternIdFromItem={item.patternId}
|
|
184
|
-
// patternIdFromProps={props.patternId}
|
|
185
|
-
// />
|
|
186
|
-
// )}
|
|
187
|
-
// {(item.topLabelComponent || showValuesAsTopLabel) && (
|
|
188
|
-
// <View
|
|
189
|
-
// style={[
|
|
190
|
-
// {
|
|
191
|
-
// position: 'absolute',
|
|
192
|
-
// top: (item.barWidth || barWidth) * -1,
|
|
193
|
-
// height: item.barWidth || barWidth,
|
|
194
|
-
// width: item.barWidth || barWidth,
|
|
195
|
-
// justifyContent:
|
|
196
|
-
// (horizontal && !intactTopLabel) || item.value < 0
|
|
197
|
-
// ? 'center'
|
|
198
|
-
// : 'flex-end',
|
|
199
|
-
// alignItems: 'center',
|
|
200
|
-
// },
|
|
201
|
-
// item.value < 0 && {transform: [{rotate: '180deg'}]},
|
|
202
|
-
// horizontal &&
|
|
203
|
-
// !intactTopLabel && {transform: [{rotate: '270deg'}]},
|
|
204
|
-
// topLabelContainerStyle ?? item.topLabelContainerStyle,
|
|
205
|
-
// ]}>
|
|
206
|
-
// {showValuesAsTopLabel ? (
|
|
207
|
-
// <Text style={topLabelTextStyle}>{item.value + yAxisOffset}</Text>
|
|
208
|
-
// ) : (
|
|
209
|
-
// item.topLabelComponent?.()
|
|
210
|
-
// )}
|
|
211
|
-
// </View>
|
|
212
|
-
// )}
|
|
213
|
-
// {localBarInnerComponent ? (
|
|
214
|
-
// <View style={{height: '100%', width: '100%'}}>
|
|
215
|
-
// {localBarInnerComponent(item, index)}
|
|
216
|
-
// </View>
|
|
217
|
-
// ) : null}
|
|
218
|
-
// </>
|
|
219
|
-
// );
|
|
220
|
-
// };
|
|
221
140
|
var barWrapperStyle = [
|
|
222
141
|
{
|
|
223
142
|
// overflow: 'visible',
|
|
@@ -261,19 +180,6 @@ var RenderBars = function (props) {
|
|
|
261
180
|
: renderLabel(true, secondaryLabel, secondaryLabelTextStyle, item.value)
|
|
262
181
|
: null] }));
|
|
263
182
|
};
|
|
264
|
-
var tooltipProps = {
|
|
265
|
-
barHeight: barHeight,
|
|
266
|
-
barWidth: item.barWidth || barWidth,
|
|
267
|
-
item: item,
|
|
268
|
-
index: index,
|
|
269
|
-
isLast: index === data.length - 1,
|
|
270
|
-
leftSpacing: leftSpacing,
|
|
271
|
-
leftShiftForLastIndexTooltip: leftShiftForLastIndexTooltip,
|
|
272
|
-
leftShiftForTooltip: (_e = (_d = item.leftShiftForTooltip) !== null && _d !== void 0 ? _d : leftShiftForTooltip) !== null && _e !== void 0 ? _e : 0,
|
|
273
|
-
renderTooltip: renderTooltip,
|
|
274
|
-
autoCenterTooltip: autoCenterTooltip,
|
|
275
|
-
horizontal: horizontal,
|
|
276
|
-
};
|
|
277
183
|
return (_jsxs(_Fragment, { children: [pressDisabled ? (_jsx(View, { pointerEvents: "none", style: barWrapperStyle, children: barContent() })) : (_jsx(TouchableOpacity, { activeOpacity: props.activeOpacity || 0.2, onPress: function () {
|
|
278
184
|
if (renderTooltip || props.focusBarOnPress) {
|
|
279
185
|
if (props.focusedBarIndex === undefined || !props.onPress) {
|
|
@@ -1,15 +1,3 @@
|
|
|
1
|
-
|
|
2
|
-
barHeight: number;
|
|
3
|
-
barWidth: number;
|
|
4
|
-
item: any;
|
|
5
|
-
index: number;
|
|
6
|
-
isLast: boolean;
|
|
7
|
-
leftSpacing: number;
|
|
8
|
-
leftShiftForLastIndexTooltip: number;
|
|
9
|
-
leftShiftForTooltip: number;
|
|
10
|
-
renderTooltip?: Function;
|
|
11
|
-
autoCenterTooltip?: boolean;
|
|
12
|
-
horizontal?: boolean;
|
|
13
|
-
}
|
|
1
|
+
import { TooltipProps } from 'gifted-charts-core/dist/utils/types';
|
|
14
2
|
declare const Tooltip: (props: TooltipProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
3
|
export default Tooltip;
|
|
@@ -18,11 +18,11 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
18
18
|
import { useState } from 'react';
|
|
19
19
|
import { View } from 'react-native';
|
|
20
20
|
var Tooltip = function (props) {
|
|
21
|
-
var
|
|
21
|
+
var barWidth = props.barWidth, item = props.item, index = props.index, isLast = props.isLast, leftSpacing = props.leftSpacing, leftShiftForLastIndexTooltip = props.leftShiftForLastIndexTooltip, leftShiftForTooltip = props.leftShiftForTooltip, renderTooltip = props.renderTooltip, autoCenterTooltip = props.autoCenterTooltip, horizontal = props.horizontal, bottom = props.bottom;
|
|
22
22
|
var _a = __read(useState(0), 2), leftShiftTooltipForCentering = _a[0], setLeftShiftTooltipForCentering = _a[1];
|
|
23
23
|
return (_jsx(View, { style: {
|
|
24
24
|
position: 'absolute',
|
|
25
|
-
bottom:
|
|
25
|
+
bottom: bottom,
|
|
26
26
|
left: leftSpacing -
|
|
27
27
|
(isLast ? leftShiftForLastIndexTooltip : leftShiftForTooltip) -
|
|
28
28
|
leftShiftTooltipForCentering,
|
package/dist/LineChart/index.js
CHANGED
|
@@ -35,9 +35,8 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
35
35
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
36
36
|
};
|
|
37
37
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
38
|
-
import { Fragment, useCallback, useEffect, useMemo, useRef,
|
|
38
|
+
import { Fragment, useCallback, useEffect, useMemo, useRef, } from 'react';
|
|
39
39
|
import { View, Animated, Easing, Text, Dimensions, I18nManager, } from 'react-native';
|
|
40
|
-
import { styles } from './styles';
|
|
41
40
|
import { screenWidth, usePrevious } from '../utils';
|
|
42
41
|
import Svg, { Path, LinearGradient, Stop, Circle, Rect, Text as CanvasText, Line, ClipPath, Use, ForeignObject, } from 'react-native-svg';
|
|
43
42
|
import { getSegmentedPathObjects, getRegionPathObjects, RANGE_ENTER, RANGE_EXIT, SEGMENT_END, SEGMENT_START, STOP, useLineChart, adjustToOffset, LineDefaults, pointsWithPaddedRepititions, } from 'gifted-charts-core';
|
|
@@ -55,7 +54,7 @@ export var LineChart = function (props) {
|
|
|
55
54
|
var widthValue3 = useMemo(function () { return new Animated.Value(0); }, []);
|
|
56
55
|
var widthValue4 = useMemo(function () { return new Animated.Value(0); }, []);
|
|
57
56
|
var widthValue5 = useMemo(function () { return new Animated.Value(0); }, []);
|
|
58
|
-
var _d = useLineChart(__assign(__assign({}, props), { parentWidth: (_b = props.parentWidth) !== null && _b !== void 0 ? _b : screenWidth })), curveType = _d.curveType, scrollX = _d.scrollX, setScrollX = _d.setScrollX, arrow1Points = _d.arrow1Points, arrow2Points = _d.arrow2Points, arrow3Points = _d.arrow3Points, arrow4Points = _d.arrow4Points, arrow5Points = _d.arrow5Points, secondaryArrowPoints = _d.secondaryArrowPoints, pointerIndex = _d.pointerIndex, setPointerIndex = _d.setPointerIndex, pointerX = _d.pointerX, setPointerX = _d.setPointerX, pointerY = _d.pointerY, setPointerY = _d.setPointerY, pointerItem = _d.pointerItem, setPointerItem = _d.setPointerItem, pointerY2 = _d.pointerY2, setPointerY2 = _d.setPointerY2, pointerItem2 = _d.pointerItem2, setPointerItem2 = _d.setPointerItem2, pointerY3 = _d.pointerY3, setPointerY3 = _d.setPointerY3, pointerItem3 = _d.pointerItem3, setPointerItem3 = _d.setPointerItem3, pointerY4 = _d.pointerY4, setPointerY4 = _d.setPointerY4, pointerItem4 = _d.pointerItem4, setPointerItem4 = _d.setPointerItem4, pointerY5 = _d.pointerY5, setPointerY5 = _d.setPointerY5, pointerYsForDataSet = _d.pointerYsForDataSet, setPointerYsForDataSet = _d.setPointerYsForDataSet, pointerItem5 = _d.pointerItem5, setPointerItem5 = _d.setPointerItem5, secondaryPointerY = _d.secondaryPointerY, setSecondaryPointerY = _d.setSecondaryPointerY, secondaryPointerItem = _d.secondaryPointerItem, setSecondaryPointerItem = _d.setSecondaryPointerItem, pointerItemsForSet = _d.pointerItemsForSet, setPointerItemsForSet = _d.setPointerItemsForSet, secondaryPointerItemsForSet = _d.secondaryPointerItemsForSet, setSecondaryPointerItemsForSet = _d.setSecondaryPointerItemsForSet, responderStartTime = _d.responderStartTime, setResponderStartTime = _d.setResponderStartTime, setResponderActive = _d.setResponderActive, points = _d.points, points2 = _d.points2, points3 = _d.points3, points4 = _d.points4, points5 = _d.points5, secondaryPoints = _d.secondaryPoints, fillPoints = _d.fillPoints, fillPoints2 = _d.fillPoints2, fillPoints3 = _d.fillPoints3, fillPoints4 = _d.fillPoints4, fillPoints5 = _d.fillPoints5, secondaryFillPoints = _d.secondaryFillPoints, pointsFromSet = _d.pointsFromSet, fillPointsFromSet = _d.fillPointsFromSet, arrowPointsFromSet = _d.arrowPointsFromSet, selectedIndex = _d.selectedIndex, setSelectedIndex = _d.setSelectedIndex, containerHeight = _d.containerHeight, data = _d.data, data2 = _d.data2, data3 = _d.data3, data4 = _d.data4, data5 = _d.data5, secondaryData = _d.secondaryData, dataSet = _d.dataSet, data0 = _d.data0, labelsExtraHeight = _d.labelsExtraHeight, animationDuration = _d.animationDuration, onDataChangeAnimationDuration = _d.onDataChangeAnimationDuration, animateTogether = _d.animateTogether, animateOnDataChange = _d.animateOnDataChange, startIndex1 = _d.startIndex1, startIndex2 = _d.startIndex2, endIndex1 = _d.endIndex1, endIndex2 = _d.endIndex2, startIndex3 = _d.startIndex3, endIndex3 = _d.endIndex3, startIndex4 = _d.startIndex4, endIndex4 = _d.endIndex4, startIndex5 = _d.startIndex5, endIndex5 = _d.endIndex5, initialSpacing = _d.initialSpacing, thickness = _d.thickness, yAxisLabelWidth = _d.yAxisLabelWidth, spacing = _d.spacing, xAxisThickness = _d.xAxisThickness, dataPointsHeight1 = _d.dataPointsHeight1, dataPointsWidth1 = _d.dataPointsWidth1, dataPointsRadius1 = _d.dataPointsRadius1, dataPointsColor1 = _d.dataPointsColor1, dataPointsShape1 = _d.dataPointsShape1, dataPointsHeight2 = _d.dataPointsHeight2, dataPointsWidth2 = _d.dataPointsWidth2, dataPointsRadius2 = _d.dataPointsRadius2, dataPointsColor2 = _d.dataPointsColor2, dataPointsShape2 = _d.dataPointsShape2, dataPointsHeight3 = _d.dataPointsHeight3, dataPointsWidth3 = _d.dataPointsWidth3, dataPointsRadius3 = _d.dataPointsRadius3, dataPointsColor3 = _d.dataPointsColor3, dataPointsShape3 = _d.dataPointsShape3, dataPointsHeight4 = _d.dataPointsHeight4, dataPointsWidth4 = _d.dataPointsWidth4, dataPointsRadius4 = _d.dataPointsRadius4, dataPointsColor4 = _d.dataPointsColor4, dataPointsShape4 = _d.dataPointsShape4, dataPointsHeight5 = _d.dataPointsHeight5, dataPointsWidth5 = _d.dataPointsWidth5, dataPointsRadius5 = _d.dataPointsRadius5, dataPointsColor5 = _d.dataPointsColor5, dataPointsShape5 = _d.dataPointsShape5, getIsNthAreaChart = _d.getIsNthAreaChart, textFontSize1 = _d.textFontSize1, textFontSize2 = _d.textFontSize2, textFontSize3 = _d.textFontSize3, textFontSize4 = _d.textFontSize4, textFontSize5 = _d.textFontSize5, textColor1 = _d.textColor1, textColor2 = _d.textColor2, textColor3 = _d.textColor3, textColor4 = _d.textColor4, textColor5 = _d.textColor5, totalWidth = _d.totalWidth, maxValue = _d.maxValue, overflowTop = _d.overflowTop, extendedContainerHeight = _d.extendedContainerHeight, getX = _d.getX, getY = _d.getY, getSecondaryY = _d.getSecondaryY, secondaryMaxValue = _d.secondaryMaxValue, showValuesAsDataPointsText = _d.showValuesAsDataPointsText, thickness1 = _d.thickness1, thickness2 = _d.thickness2, thickness3 = _d.thickness3, thickness4 = _d.thickness4, thickness5 = _d.thickness5, zIndex1 = _d.zIndex1, zIndex2 = _d.zIndex2, zIndex3 = _d.zIndex3, zIndex4 = _d.zIndex4, zIndex5 = _d.zIndex5, strokeDashArray1 = _d.strokeDashArray1, strokeDashArray2 = _d.strokeDashArray2, strokeDashArray3 = _d.strokeDashArray3, strokeDashArray4 = _d.strokeDashArray4, strokeDashArray5 = _d.strokeDashArray5, rotateLabel = _d.rotateLabel, isAnimated = _d.isAnimated, hideDataPoints1 = _d.hideDataPoints1, hideDataPoints2 = _d.hideDataPoints2, hideDataPoints3 = _d.hideDataPoints3, hideDataPoints4 = _d.hideDataPoints4, hideDataPoints5 = _d.hideDataPoints5, color1 = _d.color1, color2 = _d.color2, color3 = _d.color3, color4 = _d.color4, color5 = _d.color5, startFillColor1 = _d.startFillColor1, endFillColor1 = _d.endFillColor1, startOpacity1 = _d.startOpacity1, endOpacity1 = _d.endOpacity1, startFillColor2 = _d.startFillColor2, endFillColor2 = _d.endFillColor2, startOpacity2 = _d.startOpacity2, endOpacity2 = _d.endOpacity2, startFillColor3 = _d.startFillColor3, endFillColor3 = _d.endFillColor3, startOpacity3 = _d.startOpacity3, endOpacity3 = _d.endOpacity3, startFillColor4 = _d.startFillColor4, endFillColor4 = _d.endFillColor4, startOpacity4 = _d.startOpacity4, endOpacity4 = _d.endOpacity4, startFillColor5 = _d.startFillColor5, endFillColor5 = _d.endFillColor5, startOpacity5 = _d.startOpacity5, endOpacity5 = _d.endOpacity5, arrowStrokeWidth1 = _d.arrowStrokeWidth1, arrowStrokeColor1 = _d.arrowStrokeColor1, arrowFillColor1 = _d.arrowFillColor1, arrowStrokeWidth2 = _d.arrowStrokeWidth2, arrowStrokeColor2 = _d.arrowStrokeColor2, arrowFillColor2 = _d.arrowFillColor2, arrowStrokeWidth3 = _d.arrowStrokeWidth3, arrowStrokeColor3 = _d.arrowStrokeColor3, arrowFillColor3 = _d.arrowFillColor3, arrowStrokeWidth4 = _d.arrowStrokeWidth4, arrowStrokeColor4 = _d.arrowStrokeColor4, arrowFillColor4 = _d.arrowFillColor4, arrowStrokeWidth5 = _d.arrowStrokeWidth5, arrowStrokeColor5 = _d.arrowStrokeColor5, arrowFillColor5 = _d.arrowFillColor5, arrowStrokeWidthsFromSet = _d.arrowStrokeWidthsFromSet, arrowStrokeColorsFromSet = _d.arrowStrokeColorsFromSet, arrowFillColorsFromSet = _d.arrowFillColorsFromSet, secondaryLineConfig = _d.secondaryLineConfig, gradientDirection = _d.gradientDirection, stepHeight = _d.stepHeight, noOfSectionsBelowXAxis = _d.noOfSectionsBelowXAxis, xAxisTextNumberOfLines = _d.xAxisTextNumberOfLines, xAxisLabelsVerticalShift = _d.xAxisLabelsVerticalShift, pointerConfig = _d.pointerConfig, pointerHeight = _d.pointerHeight, pointerWidth = _d.pointerWidth, pointerRadius = _d.pointerRadius, pointerColor = _d.pointerColor, pointerComponent = _d.pointerComponent, showPointerStrip = _d.showPointerStrip, pointerStripHeight = _d.pointerStripHeight, pointerStripWidth = _d.pointerStripWidth, pointerStripColor = _d.pointerStripColor, pointerStripUptoDataPoint = _d.pointerStripUptoDataPoint, pointerLabelComponent = _d.pointerLabelComponent, stripOverPointer = _d.stripOverPointer, shiftPointerLabelX = _d.shiftPointerLabelX, shiftPointerLabelY = _d.shiftPointerLabelY, pointerLabelWidth = _d.pointerLabelWidth, pointerLabelHeight = _d.pointerLabelHeight, autoAdjustPointerLabelPosition = _d.autoAdjustPointerLabelPosition, pointerVanishDelay = _d.pointerVanishDelay, activatePointersOnLongPress = _d.activatePointersOnLongPress, activatePointersInstantlyOnTouch = _d.activatePointersInstantlyOnTouch, activatePointersDelay = _d.activatePointersDelay, persistPointer = _d.persistPointer, resetPointerIndexOnRelease = _d.resetPointerIndexOnRelease, hidePointers = _d.hidePointers, hidePointer1 = _d.hidePointer1, hidePointer2 = _d.hidePointer2, hidePointer3 = _d.hidePointer3, hidePointer4 = _d.hidePointer4, hidePointer5 = _d.hidePointer5, cumulativeSpacing1 = _d.cumulativeSpacing1, cumulativeSpacing2 = _d.cumulativeSpacing2, cumulativeSpacing3 = _d.cumulativeSpacing3, cumulativeSpacing4 = _d.cumulativeSpacing4, cumulativeSpacing5 = _d.cumulativeSpacing5, cumulativeSpacingSecondary = _d.cumulativeSpacingSecondary, cumulativeSpacingForSet = _d.cumulativeSpacingForSet, hideSecondaryPointer = _d.hideSecondaryPointer, hidePointerDataPointForMissingValues = _d.hidePointerDataPointForMissingValues, pointerEvents = _d.pointerEvents, focusEnabled = _d.focusEnabled, showDataPointOnFocus = _d.showDataPointOnFocus, showStripOnFocus = _d.showStripOnFocus, stripOverDataPoints = _d.stripOverDataPoints, showTextOnFocus = _d.showTextOnFocus, showDataPointLabelOnFocus = _d.showDataPointLabelOnFocus, stripHeight = _d.stripHeight, stripWidth = _d.stripWidth, stripColor = _d.stripColor, stripOpacity = _d.stripOpacity, stripStrokeDashArray = _d.stripStrokeDashArray, unFocusOnPressOut = _d.unFocusOnPressOut, delayBeforeUnFocus = _d.delayBeforeUnFocus, _e = _d.containerHeightIncludingBelowXAxis, containerHeightIncludingBelowXAxis = _e === void 0 ? 0 : _e, lineGradient = _d.lineGradient, lineGradientDirection = _d.lineGradientDirection, lineGradientStartColor = _d.lineGradientStartColor, lineGradientEndColor = _d.lineGradientEndColor, barAndLineChartsWrapperProps = _d.barAndLineChartsWrapperProps, areaChart = _d.areaChart, mostNegativeValue = _d.mostNegativeValue, strips = _d.strips, lastLineNumber = _d.lastLineNumber, focusTogether = _d.focusTogether, focusProximity = _d.focusProximity;
|
|
57
|
+
var _d = useLineChart(__assign(__assign({}, props), { parentWidth: (_b = props.parentWidth) !== null && _b !== void 0 ? _b : screenWidth })), curveType = _d.curveType, scrollX = _d.scrollX, setScrollX = _d.setScrollX, arrow1Points = _d.arrow1Points, arrow2Points = _d.arrow2Points, arrow3Points = _d.arrow3Points, arrow4Points = _d.arrow4Points, arrow5Points = _d.arrow5Points, secondaryArrowPoints = _d.secondaryArrowPoints, pointerIndex = _d.pointerIndex, setPointerIndex = _d.setPointerIndex, pointerX = _d.pointerX, setPointerX = _d.setPointerX, pointerY = _d.pointerY, setPointerY = _d.setPointerY, pointerItem = _d.pointerItem, setPointerItem = _d.setPointerItem, pointerY2 = _d.pointerY2, setPointerY2 = _d.setPointerY2, pointerItem2 = _d.pointerItem2, setPointerItem2 = _d.setPointerItem2, pointerY3 = _d.pointerY3, setPointerY3 = _d.setPointerY3, pointerItem3 = _d.pointerItem3, setPointerItem3 = _d.setPointerItem3, pointerY4 = _d.pointerY4, setPointerY4 = _d.setPointerY4, pointerItem4 = _d.pointerItem4, setPointerItem4 = _d.setPointerItem4, pointerY5 = _d.pointerY5, setPointerY5 = _d.setPointerY5, pointerYsForDataSet = _d.pointerYsForDataSet, setPointerYsForDataSet = _d.setPointerYsForDataSet, pointerItem5 = _d.pointerItem5, setPointerItem5 = _d.setPointerItem5, secondaryPointerY = _d.secondaryPointerY, setSecondaryPointerY = _d.setSecondaryPointerY, secondaryPointerItem = _d.secondaryPointerItem, setSecondaryPointerItem = _d.setSecondaryPointerItem, pointerItemsForSet = _d.pointerItemsForSet, setPointerItemsForSet = _d.setPointerItemsForSet, secondaryPointerItemsForSet = _d.secondaryPointerItemsForSet, setSecondaryPointerItemsForSet = _d.setSecondaryPointerItemsForSet, responderStartTime = _d.responderStartTime, setResponderStartTime = _d.setResponderStartTime, setResponderActive = _d.setResponderActive, points = _d.points, points2 = _d.points2, points3 = _d.points3, points4 = _d.points4, points5 = _d.points5, secondaryPoints = _d.secondaryPoints, fillPoints = _d.fillPoints, fillPoints2 = _d.fillPoints2, fillPoints3 = _d.fillPoints3, fillPoints4 = _d.fillPoints4, fillPoints5 = _d.fillPoints5, secondaryFillPoints = _d.secondaryFillPoints, pointsFromSet = _d.pointsFromSet, fillPointsFromSet = _d.fillPointsFromSet, arrowPointsFromSet = _d.arrowPointsFromSet, selectedIndex = _d.selectedIndex, setSelectedIndex = _d.setSelectedIndex, containerHeight = _d.containerHeight, data = _d.data, data2 = _d.data2, data3 = _d.data3, data4 = _d.data4, data5 = _d.data5, secondaryData = _d.secondaryData, dataSet = _d.dataSet, data0 = _d.data0, labelsExtraHeight = _d.labelsExtraHeight, animationDuration = _d.animationDuration, onDataChangeAnimationDuration = _d.onDataChangeAnimationDuration, animateTogether = _d.animateTogether, renderDataPointsAfterAnimationEnds = _d.renderDataPointsAfterAnimationEnds, animateOnDataChange = _d.animateOnDataChange, startIndex1 = _d.startIndex1, startIndex2 = _d.startIndex2, endIndex1 = _d.endIndex1, endIndex2 = _d.endIndex2, startIndex3 = _d.startIndex3, endIndex3 = _d.endIndex3, startIndex4 = _d.startIndex4, endIndex4 = _d.endIndex4, startIndex5 = _d.startIndex5, endIndex5 = _d.endIndex5, initialSpacing = _d.initialSpacing, thickness = _d.thickness, yAxisLabelWidth = _d.yAxisLabelWidth, spacing = _d.spacing, xAxisThickness = _d.xAxisThickness, dataPointsHeight1 = _d.dataPointsHeight1, dataPointsWidth1 = _d.dataPointsWidth1, dataPointsRadius1 = _d.dataPointsRadius1, dataPointsColor1 = _d.dataPointsColor1, dataPointsShape1 = _d.dataPointsShape1, dataPointsHeight2 = _d.dataPointsHeight2, dataPointsWidth2 = _d.dataPointsWidth2, dataPointsRadius2 = _d.dataPointsRadius2, dataPointsColor2 = _d.dataPointsColor2, dataPointsShape2 = _d.dataPointsShape2, dataPointsHeight3 = _d.dataPointsHeight3, dataPointsWidth3 = _d.dataPointsWidth3, dataPointsRadius3 = _d.dataPointsRadius3, dataPointsColor3 = _d.dataPointsColor3, dataPointsShape3 = _d.dataPointsShape3, dataPointsHeight4 = _d.dataPointsHeight4, dataPointsWidth4 = _d.dataPointsWidth4, dataPointsRadius4 = _d.dataPointsRadius4, dataPointsColor4 = _d.dataPointsColor4, dataPointsShape4 = _d.dataPointsShape4, dataPointsHeight5 = _d.dataPointsHeight5, dataPointsWidth5 = _d.dataPointsWidth5, dataPointsRadius5 = _d.dataPointsRadius5, dataPointsColor5 = _d.dataPointsColor5, dataPointsShape5 = _d.dataPointsShape5, getIsNthAreaChart = _d.getIsNthAreaChart, textFontSize1 = _d.textFontSize1, textFontSize2 = _d.textFontSize2, textFontSize3 = _d.textFontSize3, textFontSize4 = _d.textFontSize4, textFontSize5 = _d.textFontSize5, textColor1 = _d.textColor1, textColor2 = _d.textColor2, textColor3 = _d.textColor3, textColor4 = _d.textColor4, textColor5 = _d.textColor5, totalWidth = _d.totalWidth, maxValue = _d.maxValue, overflowTop = _d.overflowTop, extendedContainerHeight = _d.extendedContainerHeight, getX = _d.getX, getY = _d.getY, getSecondaryY = _d.getSecondaryY, secondaryMaxValue = _d.secondaryMaxValue, showValuesAsDataPointsText = _d.showValuesAsDataPointsText, thickness1 = _d.thickness1, thickness2 = _d.thickness2, thickness3 = _d.thickness3, thickness4 = _d.thickness4, thickness5 = _d.thickness5, zIndex1 = _d.zIndex1, zIndex2 = _d.zIndex2, zIndex3 = _d.zIndex3, zIndex4 = _d.zIndex4, zIndex5 = _d.zIndex5, strokeDashArray1 = _d.strokeDashArray1, strokeDashArray2 = _d.strokeDashArray2, strokeDashArray3 = _d.strokeDashArray3, strokeDashArray4 = _d.strokeDashArray4, strokeDashArray5 = _d.strokeDashArray5, rotateLabel = _d.rotateLabel, isAnimated = _d.isAnimated, hideDataPoints1 = _d.hideDataPoints1, hideDataPoints2 = _d.hideDataPoints2, hideDataPoints3 = _d.hideDataPoints3, hideDataPoints4 = _d.hideDataPoints4, hideDataPoints5 = _d.hideDataPoints5, color1 = _d.color1, color2 = _d.color2, color3 = _d.color3, color4 = _d.color4, color5 = _d.color5, startFillColor1 = _d.startFillColor1, endFillColor1 = _d.endFillColor1, startOpacity1 = _d.startOpacity1, endOpacity1 = _d.endOpacity1, startFillColor2 = _d.startFillColor2, endFillColor2 = _d.endFillColor2, startOpacity2 = _d.startOpacity2, endOpacity2 = _d.endOpacity2, startFillColor3 = _d.startFillColor3, endFillColor3 = _d.endFillColor3, startOpacity3 = _d.startOpacity3, endOpacity3 = _d.endOpacity3, startFillColor4 = _d.startFillColor4, endFillColor4 = _d.endFillColor4, startOpacity4 = _d.startOpacity4, endOpacity4 = _d.endOpacity4, startFillColor5 = _d.startFillColor5, endFillColor5 = _d.endFillColor5, startOpacity5 = _d.startOpacity5, endOpacity5 = _d.endOpacity5, arrowStrokeWidth1 = _d.arrowStrokeWidth1, arrowStrokeColor1 = _d.arrowStrokeColor1, arrowFillColor1 = _d.arrowFillColor1, arrowStrokeWidth2 = _d.arrowStrokeWidth2, arrowStrokeColor2 = _d.arrowStrokeColor2, arrowFillColor2 = _d.arrowFillColor2, arrowStrokeWidth3 = _d.arrowStrokeWidth3, arrowStrokeColor3 = _d.arrowStrokeColor3, arrowFillColor3 = _d.arrowFillColor3, arrowStrokeWidth4 = _d.arrowStrokeWidth4, arrowStrokeColor4 = _d.arrowStrokeColor4, arrowFillColor4 = _d.arrowFillColor4, arrowStrokeWidth5 = _d.arrowStrokeWidth5, arrowStrokeColor5 = _d.arrowStrokeColor5, arrowFillColor5 = _d.arrowFillColor5, arrowStrokeWidthsFromSet = _d.arrowStrokeWidthsFromSet, arrowStrokeColorsFromSet = _d.arrowStrokeColorsFromSet, arrowFillColorsFromSet = _d.arrowFillColorsFromSet, secondaryLineConfig = _d.secondaryLineConfig, gradientDirection = _d.gradientDirection, stepHeight = _d.stepHeight, noOfSectionsBelowXAxis = _d.noOfSectionsBelowXAxis, xAxisTextNumberOfLines = _d.xAxisTextNumberOfLines, xAxisLabelsVerticalShift = _d.xAxisLabelsVerticalShift, pointerConfig = _d.pointerConfig, pointerHeight = _d.pointerHeight, pointerWidth = _d.pointerWidth, pointerRadius = _d.pointerRadius, pointerColor = _d.pointerColor, pointerComponent = _d.pointerComponent, showPointerStrip = _d.showPointerStrip, pointerStripHeight = _d.pointerStripHeight, pointerStripWidth = _d.pointerStripWidth, pointerStripColor = _d.pointerStripColor, pointerStripUptoDataPoint = _d.pointerStripUptoDataPoint, pointerLabelComponent = _d.pointerLabelComponent, stripOverPointer = _d.stripOverPointer, shiftPointerLabelX = _d.shiftPointerLabelX, shiftPointerLabelY = _d.shiftPointerLabelY, pointerLabelWidth = _d.pointerLabelWidth, pointerLabelHeight = _d.pointerLabelHeight, autoAdjustPointerLabelPosition = _d.autoAdjustPointerLabelPosition, pointerVanishDelay = _d.pointerVanishDelay, activatePointersOnLongPress = _d.activatePointersOnLongPress, activatePointersInstantlyOnTouch = _d.activatePointersInstantlyOnTouch, activatePointersDelay = _d.activatePointersDelay, persistPointer = _d.persistPointer, resetPointerIndexOnRelease = _d.resetPointerIndexOnRelease, hidePointers = _d.hidePointers, hidePointer1 = _d.hidePointer1, hidePointer2 = _d.hidePointer2, hidePointer3 = _d.hidePointer3, hidePointer4 = _d.hidePointer4, hidePointer5 = _d.hidePointer5, cumulativeSpacing1 = _d.cumulativeSpacing1, cumulativeSpacing2 = _d.cumulativeSpacing2, cumulativeSpacing3 = _d.cumulativeSpacing3, cumulativeSpacing4 = _d.cumulativeSpacing4, cumulativeSpacing5 = _d.cumulativeSpacing5, cumulativeSpacingSecondary = _d.cumulativeSpacingSecondary, cumulativeSpacingForSet = _d.cumulativeSpacingForSet, hideSecondaryPointer = _d.hideSecondaryPointer, hidePointerDataPointForMissingValues = _d.hidePointerDataPointForMissingValues, pointerEvents = _d.pointerEvents, focusEnabled = _d.focusEnabled, showDataPointOnFocus = _d.showDataPointOnFocus, showStripOnFocus = _d.showStripOnFocus, stripOverDataPoints = _d.stripOverDataPoints, showTextOnFocus = _d.showTextOnFocus, showDataPointLabelOnFocus = _d.showDataPointLabelOnFocus, stripHeight = _d.stripHeight, stripWidth = _d.stripWidth, stripColor = _d.stripColor, stripOpacity = _d.stripOpacity, stripStrokeDashArray = _d.stripStrokeDashArray, _e = _d.containerHeightIncludingBelowXAxis, containerHeightIncludingBelowXAxis = _e === void 0 ? 0 : _e, lineGradient = _d.lineGradient, lineGradientDirection = _d.lineGradientDirection, lineGradientStartColor = _d.lineGradientStartColor, lineGradientEndColor = _d.lineGradientEndColor, barAndLineChartsWrapperProps = _d.barAndLineChartsWrapperProps, areaChart = _d.areaChart, mostNegativeValue = _d.mostNegativeValue, strips = _d.strips, lastLineNumber = _d.lastLineNumber, focusTogether = _d.focusTogether, selectedLineNumber = _d.selectedLineNumber, handleFocus = _d.handleFocus, handleUnFocus = _d.handleUnFocus;
|
|
59
58
|
var svgHeight = containerHeightIncludingBelowXAxis +
|
|
60
59
|
((_c = props.overflowBottom) !== null && _c !== void 0 ? _c : dataPointsRadius1);
|
|
61
60
|
var secondaryXAxis = props.secondaryXAxis, intersectionAreaConfig = props.intersectionAreaConfig;
|
|
@@ -259,7 +258,7 @@ export var LineChart = function (props) {
|
|
|
259
258
|
props.onFocus(item, index);
|
|
260
259
|
}
|
|
261
260
|
};
|
|
262
|
-
|
|
261
|
+
// const [selectedLineNumber, setSelectedLineNumber] = useState(-1);
|
|
263
262
|
var renderDataPoints = function (hideDataPoints, dataForRender, originalDataFromProps, dataPtsShape, dataPtsWidth, dataPtsHeight, dataPtsColor, dataPtsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray, key) {
|
|
264
263
|
var getYOrSecondaryY = isSecondary ? getSecondaryY : getY;
|
|
265
264
|
return dataForRender.map(function (item, index) {
|
|
@@ -319,103 +318,15 @@ export var LineChart = function (props) {
|
|
|
319
318
|
if (showValuesAsDataPointsText) {
|
|
320
319
|
text = originalDataFromProps[index].value;
|
|
321
320
|
}
|
|
322
|
-
var
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
var lineNumber_1 = 0;
|
|
332
|
-
if (dataSet) {
|
|
333
|
-
var minDistance_1 = Infinity;
|
|
334
|
-
dataSet.forEach(function (setItem, setIndex) {
|
|
335
|
-
var _a;
|
|
336
|
-
var distance = Math.abs(getY((_a = setItem.data[index]) === null || _a === void 0 ? void 0 : _a.value) - locationY_1);
|
|
337
|
-
if (distance < minDistance_1) {
|
|
338
|
-
minDistance_1 = distance;
|
|
339
|
-
lineNumber_1 = setIndex + 1;
|
|
340
|
-
}
|
|
341
|
-
});
|
|
342
|
-
}
|
|
343
|
-
else {
|
|
344
|
-
var distance1 = void 0, distance2 = void 0, distance3 = void 0, distance4 = void 0, distance5 = void 0, distance6 = void 0;
|
|
345
|
-
var minDistance = Infinity;
|
|
346
|
-
if (typeof ((_a = data[index]) === null || _a === void 0 ? void 0 : _a.value) === 'number') {
|
|
347
|
-
distance1 = Math.abs(getY((_b = data[index]) === null || _b === void 0 ? void 0 : _b.value) - locationY_1);
|
|
348
|
-
minDistance = distance1;
|
|
349
|
-
if (distance1 < focusProximity)
|
|
350
|
-
lineNumber_1 = 1;
|
|
351
|
-
}
|
|
352
|
-
if (typeof ((_c = data2[index]) === null || _c === void 0 ? void 0 : _c.value) === 'number') {
|
|
353
|
-
distance2 = Math.abs(getY((_d = data2[index]) === null || _d === void 0 ? void 0 : _d.value) - locationY_1);
|
|
354
|
-
if (minDistance > distance2 &&
|
|
355
|
-
distance2 < focusProximity) {
|
|
356
|
-
minDistance = distance2;
|
|
357
|
-
lineNumber_1 = 2;
|
|
358
|
-
}
|
|
359
|
-
}
|
|
360
|
-
if (typeof ((_e = data3[index]) === null || _e === void 0 ? void 0 : _e.value) === 'number') {
|
|
361
|
-
distance3 = Math.abs(getY((_f = data3[index]) === null || _f === void 0 ? void 0 : _f.value) - locationY_1);
|
|
362
|
-
if (minDistance > distance3 &&
|
|
363
|
-
distance3 < focusProximity) {
|
|
364
|
-
minDistance = distance3;
|
|
365
|
-
lineNumber_1 = 3;
|
|
366
|
-
}
|
|
367
|
-
}
|
|
368
|
-
if (typeof ((_g = data4[index]) === null || _g === void 0 ? void 0 : _g.value) === 'number') {
|
|
369
|
-
distance4 = Math.abs(getY((_h = data4[index]) === null || _h === void 0 ? void 0 : _h.value) - locationY_1);
|
|
370
|
-
if (minDistance > distance4 &&
|
|
371
|
-
distance4 < focusProximity) {
|
|
372
|
-
minDistance = distance4;
|
|
373
|
-
lineNumber_1 = 4;
|
|
374
|
-
}
|
|
375
|
-
}
|
|
376
|
-
if (typeof ((_j = data5[index]) === null || _j === void 0 ? void 0 : _j.value) === 'number') {
|
|
377
|
-
distance5 = Math.abs(getY((_k = data5[index]) === null || _k === void 0 ? void 0 : _k.value) - locationY_1);
|
|
378
|
-
if (minDistance > distance5 &&
|
|
379
|
-
distance5 < focusProximity) {
|
|
380
|
-
minDistance = distance5;
|
|
381
|
-
lineNumber_1 = 5;
|
|
382
|
-
}
|
|
383
|
-
}
|
|
384
|
-
if (typeof ((_l = secondaryData[index]) === null || _l === void 0 ? void 0 : _l.value) === 'number') {
|
|
385
|
-
distance6 = Math.abs(getY((_m = secondaryData[index]) === null || _m === void 0 ? void 0 : _m.value) - locationY_1);
|
|
386
|
-
if (minDistance > distance6 &&
|
|
387
|
-
distance6 < focusProximity) {
|
|
388
|
-
minDistance = distance6;
|
|
389
|
-
lineNumber_1 = 6666;
|
|
390
|
-
}
|
|
391
|
-
}
|
|
392
|
-
}
|
|
393
|
-
setSelectedLineNumber(lineNumber_1 - 1);
|
|
394
|
-
if (lineNumber_1) {
|
|
395
|
-
onStripPress(item, index);
|
|
396
|
-
}
|
|
397
|
-
}
|
|
398
|
-
},
|
|
399
|
-
// This is to fix the blinking of pointer on "initial drag after press"
|
|
400
|
-
// onResponderTerminationRequest={(evt)=>{
|
|
401
|
-
// setTerminationRequested(true)
|
|
402
|
-
// return true
|
|
403
|
-
// }}
|
|
404
|
-
onPressOut: function () {
|
|
405
|
-
if (pointerConfig && activatePointersInstantlyOnTouch) {
|
|
406
|
-
// if(terminationRequested) {
|
|
407
|
-
// setTerminationRequested(false) // This is to fix the blinking of pointer on "initial drag after press"
|
|
408
|
-
// return
|
|
409
|
-
// }
|
|
410
|
-
if (resetPointerIndexOnRelease)
|
|
411
|
-
setPointerIndex(-1);
|
|
412
|
-
if (!persistPointer)
|
|
413
|
-
setTimeout(function () { return setPointerX(0); }, pointerVanishDelay);
|
|
414
|
-
}
|
|
415
|
-
if (focusEnabled && unFocusOnPressOut) {
|
|
416
|
-
setTimeout(function () { return setSelectedIndex(-1); }, delayBeforeUnFocus);
|
|
417
|
-
}
|
|
418
|
-
} })) : null })) : null, hideDataPoints ? null : (_jsxs(_Fragment, { children: [customDataPoint ? (_jsx(ForeignObject, { height: svgHeight, width: totalWidth, x: initialSpacing -
|
|
321
|
+
var dataPointLabelWidth = item.dataPointLabelWidth
|
|
322
|
+
? item.dataPointLabelWidth
|
|
323
|
+
: props.dataPointLabelWidth
|
|
324
|
+
? props.dataPointLabelWidth
|
|
325
|
+
: 30;
|
|
326
|
+
return (_jsxs(Fragment, { children: [focusEnabled ? (_jsx(_Fragment, { children: key === lastLineNumber - 1 ? (_jsx(Rect, { x: initialSpacing + (spacing * index - spacing / 2), y: 8, width: spacing, height: containerHeight - 0, fill: 'none', onPressIn: function (evt) {
|
|
327
|
+
var locationY = evt.nativeEvent.locationY; // Note that we have another property named pageY which can be useful
|
|
328
|
+
handleFocus(index, item, locationY, onStripPress);
|
|
329
|
+
}, onPressOut: handleUnFocus })) : null })) : null, hideDataPoints ? null : (_jsxs(_Fragment, { children: [customDataPoint ? (_jsx(ForeignObject, { height: svgHeight, width: totalWidth, x: initialSpacing -
|
|
419
330
|
dataPointsWidth / 2 +
|
|
420
331
|
((_e = spacingArray[index - 1]) !== null && _e !== void 0 ? _e : 0), y: getYOrSecondaryY(item.value) - dataPointsHeight / 2, children: customDataPoint(item, index) })) : null, dataPointsShape === 'rectangular' ? (_jsx(Fragment, { children: customDataPoint ? null : (_jsx(Rect, { x: getX(spacingArray, index) - dataPointsWidth / 2, y: getYOrSecondaryY(item.value) - dataPointsHeight / 2, width: dataPointsWidth, height: dataPointsHeight, fill: showDataPointOnFocus
|
|
421
332
|
? index === selectedIndex
|
|
@@ -426,7 +337,13 @@ export var LineChart = function (props) {
|
|
|
426
337
|
? item.onPress(item, index)
|
|
427
338
|
: props.onPress
|
|
428
339
|
? props.onPress(item, index)
|
|
429
|
-
:
|
|
340
|
+
: focusEnabled
|
|
341
|
+
? handleFocus(index, item, 0, onStripPress)
|
|
342
|
+
: null;
|
|
343
|
+
}, onPressOut: function () {
|
|
344
|
+
if (!item.onPress && !props.onPress && focusEnabled) {
|
|
345
|
+
handleUnFocus();
|
|
346
|
+
}
|
|
430
347
|
} })) }, index)) : (_jsx(Fragment, { children: customDataPoint ? null : (_jsx(Circle, { cx: getX(spacingArray, index), cy: getYOrSecondaryY(item.value), r: dataPointsRadius, fill: showDataPointOnFocus
|
|
431
348
|
? index === selectedIndex
|
|
432
349
|
? dataPointsColor
|
|
@@ -436,29 +353,23 @@ export var LineChart = function (props) {
|
|
|
436
353
|
? item.onPress(item, index)
|
|
437
354
|
: props.onPress
|
|
438
355
|
? props.onPress(item, index)
|
|
439
|
-
:
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
{
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
? props.dataPointLabelWidth + 20
|
|
457
|
-
: 50) /
|
|
458
|
-
2 +
|
|
459
|
-
spacing * index,
|
|
460
|
-
},
|
|
461
|
-
], children: showDataPointLabelOnFocus
|
|
356
|
+
: focusEnabled
|
|
357
|
+
? handleFocus(index, item, 0, onStripPress)
|
|
358
|
+
: null;
|
|
359
|
+
}, onPressOut: function () {
|
|
360
|
+
if (!item.onPress && !props.onPress && focusEnabled) {
|
|
361
|
+
handleUnFocus();
|
|
362
|
+
}
|
|
363
|
+
} })) }, index)), dataPointLabelComponent ? (!showTextOnFocus || index === selectedIndex ? (_jsx(ForeignObject, { height: svgHeight, width: totalWidth, x: initialSpacing +
|
|
364
|
+
(item.dataPointLabelShiftX ||
|
|
365
|
+
props.dataPointLabelShiftX ||
|
|
366
|
+
0) -
|
|
367
|
+
dataPointLabelWidth / 2 +
|
|
368
|
+
spacing * index, y: containerHeight +
|
|
369
|
+
(item.dataPointLabelShiftY ||
|
|
370
|
+
props.dataPointLabelShiftY ||
|
|
371
|
+
0) -
|
|
372
|
+
(item.value * containerHeight) / maxValue, children: showDataPointLabelOnFocus
|
|
462
373
|
? index === selectedIndex &&
|
|
463
374
|
(focusTogether || key == selectedLineNumber)
|
|
464
375
|
? dataPointLabelComponent()
|
|
@@ -655,6 +566,26 @@ export var LineChart = function (props) {
|
|
|
655
566
|
var _a;
|
|
656
567
|
return (_jsx(View, { style: [svgWrapperViewStyle, { width: totalWidth }], children: _jsxs(Svg, { children: [_jsx(Path, { id: "path1", d: fillPoints, fill: "none", stroke: 'none' }), _jsx(Path, { id: "path2", d: fillPoints2, fill: "none", stroke: 'none' }), _jsx(ClipPath, { id: "clip", children: _jsx(Use, { href: "#path1" }) }), _jsx(Path, { d: fillPoints2, clipPath: "url(#clip)", fill: (_a = intersectionAreaConfig === null || intersectionAreaConfig === void 0 ? void 0 : intersectionAreaConfig.fillColor) !== null && _a !== void 0 ? _a : 'white' }), _jsx(Path, { d: points, stroke: color1, strokeWidth: thickness1 !== null && thickness1 !== void 0 ? thickness1 : thickness, fill: 'none' })] }) }));
|
|
657
568
|
};
|
|
569
|
+
var renderDataPointsForEachLine = function () {
|
|
570
|
+
if (dataSet && pointsFromSet.length) {
|
|
571
|
+
return (_jsx(_Fragment, { children: dataSet.map(function (set, index) {
|
|
572
|
+
var _a;
|
|
573
|
+
var hideDataPoints = set.hideDataPoints, data = set.data, dataPointsShape = set.dataPointsShape, dataPointsWidth = set.dataPointsWidth, dataPointsHeight = set.dataPointsHeight, dataPointsColor = set.dataPointsColor, dataPointsRadius = set.dataPointsRadius, textColor = set.textColor, textFontSize = set.textFontSize, startIndex = set.startIndex, endIndex = set.endIndex, isSecondary = set.isSecondary;
|
|
574
|
+
return renderDataPoints(hideDataPoints !== null && hideDataPoints !== void 0 ? hideDataPoints : hideDataPoints1, data, adjustToOffset(data, -((_a = props.yAxisOffset) !== null && _a !== void 0 ? _a : 0)), dataPointsShape !== null && dataPointsShape !== void 0 ? dataPointsShape : dataPointsShape1, dataPointsWidth !== null && dataPointsWidth !== void 0 ? dataPointsWidth : dataPointsWidth1, dataPointsHeight !== null && dataPointsHeight !== void 0 ? dataPointsHeight : dataPointsHeight1, dataPointsColor !== null && dataPointsColor !== void 0 ? dataPointsColor : dataPointsColor1, dataPointsRadius !== null && dataPointsRadius !== void 0 ? dataPointsRadius : dataPointsRadius1, textColor !== null && textColor !== void 0 ? textColor : textColor1, textFontSize !== null && textFontSize !== void 0 ? textFontSize : textFontSize1, startIndex !== null && startIndex !== void 0 ? startIndex : 0, endIndex !== null && endIndex !== void 0 ? endIndex : set.data.length - 1, isSecondary, showValuesAsDataPointsText, cumulativeSpacingForSet[index], index);
|
|
575
|
+
}) }));
|
|
576
|
+
}
|
|
577
|
+
return (_jsxs(_Fragment, { children: [renderDataPoints(hideDataPoints1, data, props.data, dataPointsShape1, dataPointsWidth1, dataPointsHeight1, dataPointsColor1, dataPointsRadius1, textColor1, textFontSize1, startIndex1, endIndex1, false, showValuesAsDataPointsText, cumulativeSpacing1, 0), points2
|
|
578
|
+
? renderDataPoints(hideDataPoints2, data2, props.data2, dataPointsShape2, dataPointsWidth2, dataPointsHeight2, dataPointsColor2, dataPointsRadius2, textColor2, textFontSize2, startIndex2, endIndex2, false, showValuesAsDataPointsText, cumulativeSpacing2, 1)
|
|
579
|
+
: null, points3
|
|
580
|
+
? renderDataPoints(hideDataPoints3, data3, props.data3, dataPointsShape3, dataPointsWidth3, dataPointsHeight3, dataPointsColor3, dataPointsRadius3, textColor3, textFontSize3, startIndex3, endIndex3, false, showValuesAsDataPointsText, cumulativeSpacing3, 2)
|
|
581
|
+
: null, points4
|
|
582
|
+
? renderDataPoints(hideDataPoints4, data4, props.data4, dataPointsShape4, dataPointsWidth4, dataPointsHeight4, dataPointsColor4, dataPointsRadius4, textColor4, textFontSize4, startIndex4, endIndex4, false, showValuesAsDataPointsText, cumulativeSpacing4, 3)
|
|
583
|
+
: null, points5
|
|
584
|
+
? renderDataPoints(hideDataPoints5, data5, props.data5, dataPointsShape5, dataPointsWidth5, dataPointsHeight5, dataPointsColor5, dataPointsRadius5, textColor5, textFontSize5, startIndex5, endIndex5, false, showValuesAsDataPointsText, cumulativeSpacing5, 4)
|
|
585
|
+
: null, secondaryPoints
|
|
586
|
+
? renderDataPoints(secondaryLineConfig.hideDataPoints, secondaryData, props.secondaryData, secondaryLineConfig.dataPointsShape, secondaryLineConfig.dataPointsWidth, secondaryLineConfig.dataPointsHeight, secondaryLineConfig.dataPointsColor, secondaryLineConfig.dataPointsRadius, secondaryLineConfig.textColor, secondaryLineConfig.textFontSize, secondaryLineConfig.startIndex, secondaryLineConfig.endIndex, true, secondaryLineConfig.showValuesAsDataPointsText, cumulativeSpacingSecondary, 6666)
|
|
587
|
+
: null] }));
|
|
588
|
+
};
|
|
658
589
|
var lineSvgComponent = function (points, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, key, hideDataPoints, data, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray) {
|
|
659
590
|
var _a, _b;
|
|
660
591
|
if (!points)
|
|
@@ -714,7 +645,11 @@ export var LineChart = function (props) {
|
|
|
714
645
|
? "url(#".concat(props.areaGradientId, ")")
|
|
715
646
|
: "url(#Gradient)", stroke: 'none', strokeWidth: currentLineThickness || thickness }))) : null, renderSpecificVerticalLines(data, cumulativeSpacing1), renderSpecificVerticalLines(data2, cumulativeSpacing2), renderSpecificVerticalLines(data3, cumulativeSpacing3), renderSpecificVerticalLines(data4, cumulativeSpacing4), renderSpecificVerticalLines(data5, cumulativeSpacing5), (_b = dataSet === null || dataSet === void 0 ? void 0 : dataSet.map(function (set, index) {
|
|
716
647
|
return renderSpecificVerticalLines(set === null || set === void 0 ? void 0 : set.data, cumulativeSpacingForSet[index]);
|
|
717
|
-
})) !== null && _b !== void 0 ? _b : null,
|
|
648
|
+
})) !== null && _b !== void 0 ? _b : null, isAnimated && !renderDataPointsAfterAnimationEnds // in this condition onPress won't work properly in case of multi-line, so it's suggested to use either renderDataPointsAfterAnimationEnds prop if you want to use onPress for data points
|
|
649
|
+
? renderDataPoints(hideDataPoints, data, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray, key)
|
|
650
|
+
: key === lastLineNumber - 1
|
|
651
|
+
? renderDataPointsForEachLine()
|
|
652
|
+
: null, showArrow && (_jsx(Path, { d: arrowPoints, fill: arrowFillColor, stroke: arrowStrokeColor, strokeWidth: arrowStrokeWidth }))] }));
|
|
718
653
|
};
|
|
719
654
|
// const getClosestValueFromSpacingArray = (spacingArray:number[],x:number):number => {
|
|
720
655
|
// let dif=0,prevDif=0,i;
|
|
@@ -727,22 +662,18 @@ export var LineChart = function (props) {
|
|
|
727
662
|
// }
|
|
728
663
|
// return i-1;
|
|
729
664
|
// }
|
|
730
|
-
var activatePointers = function (x
|
|
731
|
-
var factor =
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
factor = Math.min(factor, (data0 !== null && data0 !== void 0 ? data0 : data).length - 1);
|
|
736
|
-
factor = index !== null && index !== void 0 ? index : Math.max(factor, 0);
|
|
737
|
-
// if(factor === pointerIndex) return; // This is to fix the blinking of pointer on "initial drag after press"
|
|
738
|
-
}
|
|
665
|
+
var activatePointers = function (x) {
|
|
666
|
+
var factor = (x - initialSpacing) / spacing; // getClosestValueFromSpacingArray(cumulativeSpacing1,x-initialSpacing)
|
|
667
|
+
factor = Math.round(factor);
|
|
668
|
+
factor = Math.min(factor, (data0 !== null && data0 !== void 0 ? data0 : data).length - 1);
|
|
669
|
+
factor = Math.max(factor, 0);
|
|
739
670
|
var item, y;
|
|
740
671
|
item = (data0 !== null && data0 !== void 0 ? data0 : data)[factor];
|
|
741
672
|
if (!item.hidePointer) {
|
|
742
673
|
var z = getX((dataSet === null || dataSet === void 0 ? void 0 : dataSet.length) ? cumulativeSpacingForSet[0] : cumulativeSpacing1, factor) -
|
|
743
674
|
(pointerRadius || pointerWidth / 2) -
|
|
744
675
|
1;
|
|
745
|
-
setPointerX(z);
|
|
676
|
+
setPointerX(Math.max(0.1, z)); // 0.1 is to avoid pointer going out of the chart, See https://github.com/Abhinandan-Kushwaha/react-native-gifted-charts/issues/925
|
|
746
677
|
setPointerIndex(factor);
|
|
747
678
|
y =
|
|
748
679
|
containerHeight -
|
|
@@ -839,7 +770,9 @@ export var LineChart = function (props) {
|
|
|
839
770
|
}
|
|
840
771
|
};
|
|
841
772
|
var renderLine = function (containerHeightIncludingBelowXAxis, zIndex, points, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, hideDataPoints, paramData, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray, key) {
|
|
842
|
-
return (_jsx(View, { onMoveShouldSetResponder: function (evt) { return (pointerConfig ? true : false); },
|
|
773
|
+
return (_jsx(View, { onMoveShouldSetResponder: function (evt) { return (pointerConfig ? true : false); }, onStartShouldSetResponder: function (evt) {
|
|
774
|
+
return pointerConfig && activatePointersInstantlyOnTouch ? true : false;
|
|
775
|
+
}, onResponderGrant: function (evt) {
|
|
843
776
|
if (!pointerConfig)
|
|
844
777
|
return;
|
|
845
778
|
setResponderStartTime(evt.timeStamp);
|
|
@@ -893,7 +826,9 @@ export var LineChart = function (props) {
|
|
|
893
826
|
], children: lineSvgComponent(points, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, key, hideDataPoints, paramData, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray) }, key !== null && key !== void 0 ? key : 0));
|
|
894
827
|
};
|
|
895
828
|
var renderAnimatedLine = function (containerHeightIncludingBelowXAxis, zIndex, points, animatedWidth, currentLineThickness, color, fillPoints, startFillColor, endFillColor, startOpacity, endOpacity, strokeDashArray, showArrow, arrowPoints, arrowStrokeWidth, arrowStrokeColor, arrowFillColor, hideDataPoints, paramsData, propsData, dataPointsShape, dataPointsWidth, dataPointsHeight, dataPointsColor, dataPointsRadius, textColor, textFontSize, startIndex, endIndex, isSecondary, showValuesAsDataPointsText, spacingArray, key) {
|
|
896
|
-
return (_jsx(Animated.View, {
|
|
829
|
+
return (_jsx(Animated.View, { onMoveShouldSetResponder: function (evt) { return (pointerConfig ? true : false); }, onStartShouldSetResponder: function (evt) {
|
|
830
|
+
return pointerConfig && activatePointersInstantlyOnTouch ? true : false;
|
|
831
|
+
}, onResponderGrant: function (evt) {
|
|
897
832
|
if (!pointerConfig)
|
|
898
833
|
return;
|
|
899
834
|
setResponderStartTime(evt.timeStamp);
|
|
@@ -959,7 +894,7 @@ export var LineChart = function (props) {
|
|
|
959
894
|
},
|
|
960
895
|
};
|
|
961
896
|
var renderStrips = function (item, index, ind) {
|
|
962
|
-
var _a, _b, _c, _d, _e, _f;
|
|
897
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
963
898
|
if (item.showStrip || index === selectedIndex) {
|
|
964
899
|
var currentStripHeight = (_a = item.stripHeight) !== null && _a !== void 0 ? _a : stripHeight;
|
|
965
900
|
var currentStripWidth = (_b = item.stripWidth) !== null && _b !== void 0 ? _b : stripWidth;
|
|
@@ -971,9 +906,9 @@ export var LineChart = function (props) {
|
|
|
971
906
|
: containerHeight -
|
|
972
907
|
((_f = item.dataPointHeight) !== null && _f !== void 0 ? _f : dataPointsHeight1) / 2 +
|
|
973
908
|
14 -
|
|
974
|
-
(item.value * containerHeight) / maxValue;
|
|
909
|
+
(((_g = item.value) !== null && _g !== void 0 ? _g : 0) * containerHeight) / maxValue;
|
|
975
910
|
var actualStripHeight = currentStripHeight ||
|
|
976
|
-
(item.value * containerHeight) / maxValue - 2 + overflowTop;
|
|
911
|
+
(((_h = item.value) !== null && _h !== void 0 ? _h : 0) * containerHeight) / maxValue - 2 + overflowTop;
|
|
977
912
|
return (_jsx(Line, { x1: initialSpacing + spacing * index, y1: y1, x2: initialSpacing + spacing * index, y2: y1 + actualStripHeight + 2, strokeWidth: currentStripWidth, stroke: currentStripColor, strokeDasharray: currentStripStrokeDashArray, opacity: currentStripOpacity }, 'strip' + (ind * 10000 + index)));
|
|
978
913
|
}
|
|
979
914
|
return null;
|
|
@@ -1090,5 +1025,5 @@ export var LineChart = function (props) {
|
|
|
1090
1025
|
pointerItem5,
|
|
1091
1026
|
].filter(function (item) { return !!item; }), pointerIndex) })) : null] }));
|
|
1092
1027
|
};
|
|
1093
|
-
return (_jsx(BarAndLineChartsWrapper, __assign({}, barAndLineChartsWrapperProps, { dataSet:
|
|
1028
|
+
return (_jsx(BarAndLineChartsWrapper, __assign({}, barAndLineChartsWrapperProps, { dataSet: dataSet, scrollRef: scrollRef, animatedWidth: widthValue, renderChartContent: renderChartContent, remainingScrollViewProps: remainingScrollViewProps })));
|
|
1094
1029
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -4,4 +4,4 @@ export { PieChartPro } from './PieChartPro';
|
|
|
4
4
|
export { LineChart } from './LineChart';
|
|
5
5
|
export { LineChartBicolor } from './LineChart/LineChartBicolor';
|
|
6
6
|
export { PopulationPyramid } from './PopulationPyramid';
|
|
7
|
-
export { type barDataItem, type stackDataItem, type BarChartPropsType, type StackedBarChartPropsType, type pieDataItem, type PieChartPropsType, type lineDataItem, type bicolorLineDataItem, type LineChartPropsType, type LineChartBicolorPropsType, type popnPyramidDataItem, type PopulationPyramidPropsType, chartTypes, ruleTypes, yAxisSides, EdgePosition, type DataSet, type Linecap } from 'gifted-charts-core';
|
|
7
|
+
export { type barDataItem, type barDataItemNullSafe, type stackDataItem, type BarChartPropsType, type StackedBarChartPropsType, type pieDataItem, type PieChartPropsType, type lineDataItem, type lineDataItemNullSafe, type bicolorLineDataItem, type LineChartPropsType, type LineChartBicolorPropsType, type popnPyramidDataItem, type PopulationPyramidPropsType, chartTypes, ruleTypes, CurveType, yAxisSides, EdgePosition, type DataSet, type DataSetNullSafe, type Linecap, type RulesConfig, type LabelsPosition, type PointerEvents, type secondaryYAxisType, type secondaryLineConfigType, type referenceConfigType, type arrowConfigType, type Pointer, type HighlightedRange, type LineSegment, type LineProperties, Framework, type XAxisConfig, type DataPointProps, type IntersectionAreaConfig, type LabelLineConfig, type TooltipProps, } from 'gifted-charts-core';
|
package/dist/index.js
CHANGED
|
@@ -4,4 +4,4 @@ export { PieChartPro } from './PieChartPro';
|
|
|
4
4
|
export { LineChart } from './LineChart';
|
|
5
5
|
export { LineChartBicolor } from './LineChart/LineChartBicolor';
|
|
6
6
|
export { PopulationPyramid } from './PopulationPyramid';
|
|
7
|
-
export { chartTypes, ruleTypes, yAxisSides, EdgePosition } from 'gifted-charts-core';
|
|
7
|
+
export { chartTypes, ruleTypes, CurveType, yAxisSides, EdgePosition, Framework, } from 'gifted-charts-core';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-gifted-charts",
|
|
3
|
-
"version": "1.4.
|
|
3
|
+
"version": "1.4.50",
|
|
4
4
|
"description": "The most complete library for Bar, Line, Area, Pie, Donut, Stacked Bar and Population Pyramid charts in React Native. Allows 2D, 3D, gradient, animations and live data updates.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"files": [
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"registry": "https://registry.npmjs.org/"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"gifted-charts-core": "0.1.
|
|
29
|
+
"gifted-charts-core": "0.1.52"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
32
|
"@babel/cli": "^7.24.8",
|