如何自定义VictoryToolTip

我已经使用 VictoryCharts 我添加了工具提示…

<VictoryPie
    labelComponent={<VictoryTooltip cornerRadius={0} />}
    colorScale={["tomato", "orange", "gold", "cyan", "navy" ]}
    padAngle={0.5}
    innerRadius={100}
    width={400} height={400}
    style={{ 
      labels: { fontSize: 15, fill: "black"},
      data: {
        fillOpacity: 0.9, stroke: "#c43a31", strokeWidth: 3
      }
    }}
    labelRadius={90}
    data = {data_distribution}
/>

工具提示如下…

我想删除箭头,使工具提示成为一个规则的矩形,并更改背景色。本质上我想定制它,但事实证明这比我预期的要难。

我尝试创建自定义组件…

class CustomFlyout extends Component {
  render() {
    const {x, y} = this.props;

    return (
      <div style={{"background": "red"}}>
        <p>x</p>
      </div>
    );
  }
}

我添加到 VictoryTooltip …

<VictoryTooltip
    cornerRadius={0}
    flyoutComponent={<CustomFlyout/>}
 />

但是,这没有任何作用。我不知道如何定制工具提示。