Skip to content

Animations are delayed with multiple datasets #10081

@FlyingNebulae

Description

@FlyingNebulae

Expected behavior

All the datasets should be animated together

Current behavior

The animations of the datasets start with a delay

Reproducible sample

https://codepen.io/ClementVH/pen/vYeredE

Optional extra steps/info to reproduce

In the codepen there is a button below the chart, if you click it ( fast enough ) you will see the stacked bars are not aligned during the animation. It looks like a glitch.

Possible solution

I have looked into the code and I saw that each Animation init its start with a new Date.now(). However when you have "large" datasets and you update the min/max, the animations start time will be different from one datasets to an other.

The start time of the animation should be the same for every element of the chart. Probably created in the update function of the chart.

I can submit a PR with a rough fix and we can iterate on that if you'd like

Context

We use chart.js in our company to display temperature, electricity consumption, etc... and we developed a "plugin" that allows the user to pan the chart. ( We didn't use chartjs-plugin-zoom because it doesn't fit our needs )

It used to work well in chartjs v2, here is the same codepen in this version : https://codepen.io/ClementVH/pen/rNGKbOx

chart.js version

v3.7.0

Browser name and version

Chrome v95

Link to your project

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions