[Solved]-Make y-axis sticky when having horizontal scroll on chartJS and Angular-Chart.js

In your StackBlitz, the section (rectanlge) of the y-axis is correctly created on the target canvas and removed from the source canvas. The problem is that the wrong div is horizontally scrolled. This can be fixed by changing the template and corresponding css.

Please have a look at the following StackBlitz.

UPDATE (dynamic data)

In cases where the chart component receives dynamically changing data through an @Input() property, your component needs to implement the OnChange lifecycle hook.

See the following StackBlitz.

Please note that this code is far from being optimized. Instead of creating the chart from scratch on every data change, you should simply update the data and options on the existing chart.