recharts - 我怎么知道 recharts 图表何时准备就绪（线条已经出现并且动画结束了）？

Question

我想将图表复制到剪贴板。我通过使用html2canvasnpm 包将图表转换为画布来做到这一点。

是否有任何我可以听到的事件表明图表中的线条已经绘制并且我可以安全地复制到剪贴板？

现在，如果我等待的时间不够长，我会得到一个空图表。

Answer 1

您可以使用onAnimationEnd任何图表组件的道具，例如,<Line>或您正在使用的任何东西。只是为了说清楚；它不是为组件本身定义的。<Bar><Pie>LineChartLine

我认为它没有记录，但就像一个魅力。

<LineChart width={730} height={250} data={data}
  margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
  <XAxis dataKey="name" />
  <Line type="monotone" dataKey="pv" stroke="#8884d8" onAnimationEnd={this.copyToCanvas} />
</LineChart>