从Victory.js取图的四舍五入边

Question

不确定这里是否有人熟悉Victory.js框架，但我正在尝试创建一个带圆角的堆叠条。除了圆形的边缘，我什么都有，我似乎找不出它们。这是我的代码：

import React from "react";
import { render } from "react-dom";
import { VictoryStack, VictoryBar } from "victory";

const Chart = () => {
  return (
    <VictoryStack
      horizontal
      style={{
        data: { stroke: "white", strokeWidth: 3, width: 30 }
      }}
      colorScale={["#9e62c0", "#bc95d4", "#44c973", "#f9c63d", "#f5a000"]}
    >
      <VictoryBar data={[{ x: "c", y: 0.5 }]} />
      <VictoryBar data={[{ x: "c", y: 1 }]} />
      <VictoryBar data={[{ x: "c", y: 5.2 }]} />
      <VictoryBar data={[{ x: "c", y: 2.3 }]} />
      <VictoryBar data={[{ x: "c", y: 1 }]} />
    </VictoryStack>
  );
};

render(<Chart />, document.getElementById("root"));

Answer 1

我想出了怎么做。我为每个酒吧的每个角落添加了以下内容：

cornerRadius={{bottomLeft:(4), bottomRight:(4), topLeft:(4), topRight:(4)}}