Question

我使用胜利原生并且有一个带有VictoryLine和VictoryArea的VictoryChart作为孩子并想要删除图表的轴。有没有办法通过道具访问它？可能颜色可以设置为透明。

以下是一些代码：

 <VictoryChart
  containerComponent={
    <VictoryContainer />
  }
 > 
  <VictoryArea
    interpolation={interpolation}
    data={this.state.data}
  />
  <VictoryLine
    interpolation={interpolation}
    data={this.state.data}
  />
</VictoryChart>

Answer 1

使用透明的笔触添加VictoryAxis并填充：

<VictoryAxis style={{ 
    axis: {stroke: "transparent"}, 
    ticks: {stroke: "transparent"},
    tickLabels: { fill:"transparent"} 
}} />

然后结果变为：

 <VictoryChart
  containerComponent={
    <VictoryContainer />
  }
 > 
  <VictoryArea
    interpolation={interpolation}
    data={this.state.data}
  />
  <VictoryLine
    interpolation={interpolation}
    data={this.state.data}
  />
  <VictoryAxis style={{ 
    axis: {stroke: "transparent"}, 
    ticks: {stroke: "transparent"},
    tickLabels: { fill:"transparent"} 
  }} />
</VictoryChart>

Answer 2

也许你可以尝试在你的图表

之后添加没有轴行程的VictoryAxis

<VictoryChart
  containerComponent={
    <VictoryContainer />
  }
 > 
  <VictoryArea
    interpolation={interpolation}
    data={this.state.data}
  />
  <VictoryLine
    interpolation={interpolation}
    data={this.state.data}
  />
  <VictoryAxis style={{ axis: {stroke: "none"} }} />
</VictoryChart>

Answer 3

VictoryChart 使用默认轴。如果要在不使用任何轴的情况下绘制数据，请改为使用 VictoryGroup 。

请参阅FAQ

从VictoryChart中删除Axis

3 个答案: