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

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>