chart-component-mouse-events.ts

@Component({
   // ...
})
export class ChartComponent implements AfterViewInit {
   // ...
   
   private createCanvas() {
      const currentCanvas = document.createElement('canvas');
      const chartCanvas = document.getElementById('chartCanvas');
      chartCanvas.append(currentCanvas);
      chartCanvas.addEventListener('mousemove', (e: MouseEvent) => {
         this.currentWorker.postMessage({
            type: 'mousemove',
            x: e.offsetX,
            y: e.offsetY
         });
      });
      chartCanvas.addEventListener('mouseenter', () => {
         this.currentWorker.postMessage({ type: 'mouseenter' });
      });
      chartCanvas.addEventListener('mouseleave', () => {
         this.currentWorker.postMessage({ type: 'mouseleave' });
      });
      return (currentCanvas as any).transferControlToOffscreen();
   }
}