fixed label position issue with pointers in Line/Area charts

This commit is contained in:
Abhinandan-Kushwaha 2022-05-30 19:48:24 +05:30
parent 35ccf0c0b6
commit 7e13bf0979
2 changed files with 20 additions and 2 deletions

View File

@ -1,6 +1,6 @@
{
"name": "react-native-gifted-charts",
"version": "1.2.30",
"version": "1.2.31",
"description": "The most complete library for Bar, Line, Area, Pie, Donut and Stacked Bar charts in React Native. Allows 2D, 3D, gradient, animations and live data updates.",
"main": "src/index.tsx",
"files": [

View File

@ -371,6 +371,7 @@ type Pointer = {
export const LineChart = (props: propTypes) => {
const scrollRef = useRef();
const [scrollX, setScrollX] = useState(0);
const [pointerIndex, setPointerIndex] = useState(-1);
const [pointerX, setPointerX] = useState(0);
const [pointerY, setPointerY] = useState(0);
@ -2557,6 +2558,11 @@ export const LineChart = (props: propTypes) => {
if (autoAdjustPointerLabelPosition) {
if (pointerX < pointerLabelWidth / 2) {
left = 7;
} else if (
activatePointersOnLongPress &&
pointerX - scrollX < pointerLabelWidth / 2 - 10
) {
left = 7;
} else {
if (
!activatePointersOnLongPress &&
@ -2568,7 +2574,10 @@ export const LineChart = (props: propTypes) => {
left = -pointerLabelWidth - 4;
} else if (
activatePointersOnLongPress &&
pointerX > totalWidth - yAxisLabelWidth - pointerLabelWidth / 2
pointerX - scrollX >
(props.width + 10 ||
Dimensions.get('window').width - yAxisLabelWidth - 15) -
pointerLabelWidth / 2
) {
left = -pointerLabelWidth - 4;
} else {
@ -3293,6 +3302,15 @@ export const LineChart = (props: propTypes) => {
scrollRef.current.scrollToEnd({animated: scrollAnimation});
}
}}
onScroll={ev => {
if (
pointerConfig &&
pointerConfig.activatePointersOnLongPress &&
pointerConfig.autoAdjustPointerLabelPosition
) {
setScrollX(ev.nativeEvent.contentOffset.x);
}
}}
showsHorizontalScrollIndicator={showScrollIndicator}
indicatorStyle={props.indicatorColor}
style={[