reactjsreact-nativevictory-charts

victory-native : events props not working in react native / event not firing in react native when using victory bar chart


I am trying to implement Victor bar chart in which I want to perform some action when user click on the bar. but when do so using event props which in given in the docs(using the same sample code given in docs) but the event is not firing. You can also see my implementation on snack.expo.io using this link...ClickMe

package version are:

"react-native-svg": "^9.4.0",
"victory-native": "^32.0.2",
"expo": "^33.0.0",
"react": "16.8.3",
"react-dom": "^16.8.6",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",

here is same code for your reference...

Note : I also used 'onPressIn', 'onClick' and 'onPress' neither of them work.

<VictoryBar
   data={[
     {x: 1, y: 2, label: "A"},
     {x: 2, y: 4, label: "B"},
     {x: 3, y: 7, label: "C"},
     {x: 4, y: 3, label: "D"},
     {x: 5, y: 5, label: "E"},
   ]}
   events={[
     {
       target: "data",
       eventHandlers: {
         onPressIn: () => {
           return [{
             target: "labels",
             mutation: (props) => {
               return props.text === "clicked" ?
                 null : { text: "clicked" }
             }
           }];
         }
       }
     }
   ]}
 />

Please help me out


Solution

  • Wrapping it in Svg like this worked for me:

    <Svg>
      <VictoryPie
        height={280}
        colorScale={pie_chart_color}
        data={this.state.data}
        style={...}
        events={[...]}
      />
    </Svg>