Chartjs-Chartjs plugin label in Angular app moving unexpectedly at hover

for anyone interested –

This is happening due to the fact that, ChartJS sets text­‘s baseline to top by default, when hovered over the graph.

To get the correct behavior, you need to set the text­‘s baseline to alphabetic before drawing the text, for instance :

...
ctx.textBaseline = 'alphabetic';
ctx.fillText(text, x, y);
...

Here is the working example.