Pie chart onClick is not working properly

[RKhatri93]

Pie chart onClick is not working properly

Hi Team, I really appreciate the work you've done.

I am using the piechart and I am using its onPress callback to get the index. But somehow I am not getting the correct index. If I clicked at the edge of the slice then it'll return me the wrong index.

I've checked the files deep down in the node-modules -> react-native-svg-chart -> pie-chart.js, and found that the onPress:

{pieSlices.map((slice, index) => { const { key, onPress, svg } = data[index] return ( <Path key={key} onPress={onPress} {...svg} d={arcsindex} animate={animate} animationDuration={animationDuration} /> ) })}

here isn't return me the exact index of the slice which've clicked. I am attaching the image which mentioned the click behavior which needs in our app. I'll really appreciate it if got an update from you on the same. Thanks in advance.

[kumailrazapeekaboo]

do u find any solution to this

[manikvermasdm]

Facing the same. Can anybody please help?

Here is the data I am using for PieChart: const pieData = selectedWatchlist?.watchlistsAssets .slice(0, 50) .map((item, index) => { return { key: item.id, value: 65, svg: { fill: index < colors.length - 1 ? colors[index] : colors[index - colors.length], }, symbol: item?.Asset?.symbol, arc: { outerRadius: 70 + 65 + '%', padAngle: 0.02, innerRadius: label === item.id ? 10 + 45 + '%' : 20 + 45 + '%', }, companyName: item?.Asset?.description, rotationAngles: rotationAngles[index], onPress: () => { console.log(item, 'item'); setPieChartData({ ...pieChartData, selectedSlice: { label: item.id, value: 55, symbol: item?.Asset?.symbol, companyName: item?.Asset?.description, }, }); }, }; });