diff --git a/docs/LineChart/LineChartProps.md b/docs/LineChart/LineChartProps.md
index 7c747dd..b7148e6 100644
--- a/docs/LineChart/LineChartProps.md
+++ b/docs/LineChart/LineChartProps.md
@@ -328,6 +328,13 @@ The strokeDashArray property lets us render a dashed/dotted strip along t
pointerLabelComponent is a function that returns the component to be rendered as a Label. It takes a single parameter - an array of items. So, if there are multiple data arrays, the parameter items will have the data item corresponding to each data array.
+#### getPointerProps
+
+getPointerProps prop can be used to get the current pointer's index, x and y coordinate values. It is a callback function that accepts a single parameter which is an object. This object has following properties-
+1. pointerIndex
+2. pointerX
+3. pointerY
+
### onPress and strip related props
diff --git a/package.json b/package.json
index 03a9c56..2ba4e89 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-native-gifted-charts",
- "version": "1.2.19",
+ "version": "1.2.20",
"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": [
diff --git a/src/LineChart/index.tsx b/src/LineChart/index.tsx
index bc42a50..96fe7d0 100644
--- a/src/LineChart/index.tsx
+++ b/src/LineChart/index.tsx
@@ -267,6 +267,7 @@ type propTypes = {
noOfSectionsBelowXAxis?: number;
labelsExtraHeight?: number;
adjustToWidth?: Boolean;
+ getPointerProps?: Function;
};
type referenceConfigType = {
thickness: number;
@@ -364,6 +365,7 @@ type Pointer = {
export const LineChart = (props: propTypes) => {
const scrollRef = useRef();
+ const [pointerIndex, setPointerIndex] = useState(-1);
const [pointerX, setPointerX] = useState(0);
const [pointerY, setPointerY] = useState(0);
const [pointerItem, setPointerItem] = useState({
@@ -1425,6 +1427,7 @@ export const LineChart = (props: propTypes) => {
hidePointer5: false,
};
const pointerConfig = props.pointerConfig || null;
+ const getPointerProps = props.getPointerProps || null;
const pointerHeight =
pointerConfig && pointerConfig.height
? pointerConfig.height
@@ -2814,6 +2817,7 @@ export const LineChart = (props: propTypes) => {
(pointerRadius || pointerWidth / 2) -
2;
setPointerX(z);
+ setPointerIndex(factor);
let item, y;
item = data[factor];
y =
@@ -2900,6 +2904,7 @@ export const LineChart = (props: propTypes) => {
2;
let item, y;
setPointerX(z);
+ setPointerIndex(factor);
item = data[factor];
y =
containerHeight -
@@ -2963,6 +2968,7 @@ export const LineChart = (props: propTypes) => {
onResponderEnd={evt => {
// console.log('evt...end.......',evt);
setResponderStartTime(0);
+ setPointerIndex(-1);
setResponderActive(false);
setTimeout(() => setPointerX(0), pointerVanishDelay);
}}
@@ -3037,6 +3043,7 @@ export const LineChart = (props: propTypes) => {
(pointerRadius || pointerWidth / 2) -
2;
setPointerX(z);
+ setPointerIndex(factor);
let item, y;
item = data[factor];
y =
@@ -3122,6 +3129,7 @@ export const LineChart = (props: propTypes) => {
2;
let item, y;
setPointerX(z);
+ setPointerIndex(factor);
item = data[factor];
y =
containerHeight -
@@ -3185,6 +3193,7 @@ export const LineChart = (props: propTypes) => {
onResponderEnd={evt => {
// console.log('evt...end.......',evt);
setResponderStartTime(0);
+ setPointerIndex(-1);
setResponderActive(false);
setTimeout(() => setPointerX(0), pointerVanishDelay);
}}
@@ -3496,6 +3505,9 @@ export const LineChart = (props: propTypes) => {
);
})}
+ {pointerConfig &&
+ getPointerProps &&
+ getPointerProps({pointerIndex, pointerX, pointerY})}
);
};