为胜利图表栏添加自定义样式

问题描述

我想用 Victory 创建一个自定义条形图，如下所示：

如何在图表中每 10% 添加一条水平线？

这是我的示例代码：

const data = [
  { day: 1,data: 0 },{ day: 2,data: 1 },{ day: 3,data: 2 },{ day: 4,{ day: 5,];

const BarChart = () => {
  return (
    <VictoryChart domainPadding={20} theme={VictoryTheme.material}>
      <VictoryAxis
        tickFormat={(x) => `${x.toFixed(0)}`}
        style={{
          grid: { stroke: "none" },ticks: { size: 0 },}}
      />
      <VictoryAxis
        dependentAxis
        tickFormat={(x) => `${x}`}
        style={{
          grid: { stroke: "none" },}}
      />
      <VictoryStack>
        <VictoryBar data={data} style={{ data: { fill: '#379F4B' } }} x="day" y="data" />
      </VictoryStack>
    </VictoryChart>
  );
};

解决方法

您是否尝试过使用 tickValues？示例：

<VictoryAxis dependentAxis
  tickValues={[10,20,30,40,50,60,70,80,90,100]}
  ...other stuff...
/>