Question

我有一个带有两个区域和两个Y轴的竞技场。第一个区域从-1500到4500，第二个区域从0到100。两个区域都从底部开始，因此第二个区域的0值与第一个区域的-1500值对齐。是否可以将两个y轴对齐？

<AreaChart width={730} height={250} data={data}
  margin={{ top: 10, right: 30, left: 0, bottom: 0 }}>
  <defs>
    <linearGradient id="colorA" x1="0" y1="0" x2="0" y2="1">
      <stop offset="{off}" stopColor="green" stopOpacity={1}/>
      <stop offset="{off}" stopColor="red" stopOpacity={1}/>
    </linearGradient>
  </defs>
  <XAxis dataKey="date" />
  <YAxis yAxisId="left" dataKey="number" />
  <YAxis yAxisId="right" orientation="right" dataKey="percentage" domain={[0,100]} unit="%" />
  <Area yAxisId="left" dataKey="number" stroke="#8884d8" fill="url(#colorA)" />
  <Area yAxisId="right" dataKey="percentage" stroke="#82ca9d" fill="#eee" />
</AreaChart>

如何在React图表中将两个Y轴围绕0对齐？

0 个答案: