如何在recharts中禁用LineChart动画？

Question

我试着用这种方式禁用动画：

<ResponsiveContainer width="99%" height={300}>
    <LineChart isAnimationActive={false}
               animationDuration={0}
               height={300} width={400}
               data={chartData}>
        ...
    </LineChart>
</ResponsiveContainer>

但它不起作用

Answer 1

您需要在行级别禁用动画。

<ResponsiveContainer width="99%" height={300}>
    <LineChart height={300} width={400} data={chartData}>
        <Line type="monotone" isAnimationActive={false} dataKey="pv" />
        <Line type="monotone" isAnimationActive={false} dataKey="uv" />
    </LineChart>
</ResponsiveContainer>

查看此JSFiddle以查看示例。