Search code examples
react-nativevictory-charts

onClick events not working on Victory Pie React-Native


<View
    style={styles.chart}}} >
    <Svg height={400} width={400}>
      <VictoryPie
        colorScale={["#00897B", "#7fc4bd", "#b70104" ]}
        innerRadius={90}
        style={{
          labels: {
            fontSize: 18, fill: "#ffffff"
          }
        }}
        animate={{ duration: 1500 }}
        data={this.state.data}
        padding={{ top: 0, bottom: 35, right:10, left:10 }}
        labelRadius={100}
        standalone={false}
        width={400}
        height={400}
        events={[{
          target: "data",
          eventHandlers: {
            onClick: () => {
              return [
                {
                  target: "data",
                  mutation: (props) => {
                    console.log('index: '+props.index);
                    return null;
                  }
                }, {
                  target: "labels",
                  mutation: (props) => {
                    console.log('text: '+props.text);
                    return null;
                  }
                }
              ];
            }
          }
        }]}/>
      <VictoryLabel
        x={200} y={200}
        textAnchor="middle"
        style={{ fontSize: 23,fill: 'white'}}
        text="Total Revenue"/>
    </Svg>
</View>

I used standalone={false} in Victory Pie Because it's under svg as suggested by many in victory chart issues in github but no use it's not firing any events. Its not working both in ios and android. Please help me


Solution

  • i found an answer replace onClick in event handlers with onPressIn.