Add animations to zooming and panning

[hemmoleg]

On my chart I added buttons to zoom and pan. For example the zoom in call looks like this: this.chartTicketHistory.zoom(1.1); and the call to pan to the left looks like this this.chartTicketHistory.pan(10, [this.chartTicketHistory.scales["x"]]);

What I want is to add animtions to this functionality. Basically instead of just jumping 10 pixels to the left I want the chart to transition 10px to the left. How can I do that?

Also what is kind of weird is that the resetZoom() method is animated by default. So my zooming in, out, panning left and right dont use transitions but when I call resetZoom() the chart transitions back to its default state. Note that I dont have any animations or transitions configured in my chart options.

[kurkle]

Try giving the update mode to the zoom function:

this.chartTicketHistory.zoom(1.1, 'default')

See https://www.chartjs.org/chartjs-plugin-zoom/latest/samples/api.html

Or configure animations for zoom mode/transition, which is the default. See https://www.chartjs.org/docs/latest/configuration/animations.html#transitions

[hemmoleg]

Ok thanks that works. But now I have another problem. On my chart I offer zooming with buttons and via mouse wheel. So now I got nice transitions when zooming using the buttons. But when zooming using the mouse wheel, there are no transitions. Is there a way to also add transitions to zooming via mouse wheel?