Learn Chart.js

Transition duration

You can create charts that change the way they look on user interaction. They will automatically transition to the new values gracefully and smoothly. Transition animations are configured with default ease algorithms and durations, but you can change them by editing the properties of the Chart.defaults.global.animation object, or override any defaults locally by using the options.animation object.

For example, in the following chart code, all transitions last five seconds (Pages/BarChart6.html):

new Chart("ocean-volume-bar-chart", {    type: "bar",    data: {...},    options: {        …        animation: {            duration: 5000        }    }});