VictoryAxis 从错误的位置开始

问题描述

我无法将我的 VictoryAxis 安装到我的 VictoryChart。 轴似乎从我的 X 轴上的第二个值开始。

这就是它应该看起来的样子(第一个小节下为 0,最后一个小节下为 22)

How the graph is supposed to look

但是,当我将标签添加tickValuestickFormat 时,我得到了这个

How the graph looks

这是我的代码

const datax = ["0","2","4","6","8","10","12","14","16","18","20","22"];

<VictoryChart width={Metrics.width - Metrics.gridSize * 4}
  padding={{ left: 20,top: 10,right: 10,bottom: 30  }}
  height={height}
  containerComponent={<VictoryContainer responsive={false} />}
  domain={{ x: [0,datax.length] }}
>
    <VictoryGroup offset={10}>
      {data.map((chartData,index) => (
        <VictoryBar
          cornerRadius={3}
          barWidth={10}
          data={chartData.data}
          key={index}
          y="value"
        />
      ))}
    </VictoryGroup>

    {/* X-AXIS */}
    <VictoryAxis tickValues={datax} />
</VictoryChart>

欢迎任何帮助解决我的问题! ?

[编辑]

不向 VictoryChart 提供 domain 并将 tickValues 结果移除到此:

Graph without tickValues

解决方法

我的错误是我的数据格式。这就像

[{"value": 1},{"value": 1.1}...]

我不得不将我的数据映射到这样的东西

[{"x": 1,"y": 1},{"x": 2,"y": 1.1}...]

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...