I can't get onPress or onPressIn events to work with a very basic bar chart. I debugged it for a while and if I remove line #94 from victory-container.js (Portal component) onPressIn event is triggered properly. Is this a new bug or any ideas what's wrong with my code?
I have very basic bar chart like this:
<VictoryBar
events={[{
target: 'data',
eventHandlers: {
onPressIn: () => alert('Clicked!')
}
}]}
data={[
{ x: 1, y: 4 },
{ x: 2, y: 3 },
{ x: 3, y: 4 },
{ x: 4, y: 5 },
{ x: 5, y: 5 },
]}
/>
And installed versions:
"react": "16.0.0",
"react-native": "0.51.0",
"victory-native": "0.16.1",
"react-native-svg": "6.0.1-rc.1",
@sampsasaarela: I got the similar trouble, but my issue was closed (https://github.com/FormidableLabs/victory-native/issues/206)
Would test removing the line mentioned above to see if it is the exact same problem I encounter
EDIT:
IT IS
I removed the line #94 and it works just great
Fixed in [email protected]
@boygirl : I tried 0.16.3, still have to comment out Portal component to have it work
Same here @athirah-yahya. @boygirl, the problem still exists in [email protected].
I investigated this a little bit more and seemed that touches are not delegated through the View component to the SVG component.
I tested to add pointerEvents="none" property to the View (line #91) around the Portal component and it then worked without removing the Portal component.
I saw you @boygirl added touchAction="none" property to the same View, but I didn't find any documentation for that property? pointerEvents property is documented here.
Can you confirm @athirah-yahya if pointerEvents="none" would fix this for you too? And what do you think @boygirl?
@sampsasaarela Yes, I will add that as well.
@sampsasaarela the solution ended up being pointerEvents="box-only". This fix will go out in the next few minutes.
Thanks, @boygirl, works now perfectly.
@boygirl the most recent version has the same issue and the pointerEvents prop has been overwritten, and even after updating the component line #91 the onPress event still is not working
@wkwyatt Did you find any resolution on this with vicotry-native or did you end up finding another library? We are using Victory for our web applications and wanted to stay in the Victory Family when going to mobile, but this onPress with a bar graph on Android is the one issue. Just trying to get an idea of other options.
@dahudson88 Luckily my app was only for Android and I ended up using react-native-chart-android, if you need a multi-platform solution then victory-native would probably be better if we could get the onPress to work.
@wkwyatt DANG....aight...cool thanks for the info...Im gonna keep digging to see if I can get something working!
Might be related to this issue
Most helpful comment
@boygirl : I tried 0.16.3, still have to comment out Portal component to have it work