How to integrate OffscreenCanvas in dygraph with web worker

59 views Asked by At

Pure canvas can handle with OffscreenCanvas and web worker technology.

<!-- index.html -->
<canvas id="mainCanvas" width="300" height="150"></canvas>
// main.js
let worker = new Worker('worker.js');

const offscreenCanvas = document.getElementById('mainCanvas').transferControlToOffscreen();

worker.postMessage({ canvas: offscreenCanvas }, [offscreenCanvas]);
// worker.js
self.onmessage = function(event) {

  const offscreenCanvas = event.data.canvas;
  const context = offscreenCanvas.getContext('2d');

  context.fillStyle = 'lightblue';
  context.fillRect(0, 0, offscreenCanvas.width, offscreenCanvas.height);
  context.fillStyle = 'red';
  context.fillRect(10, 10, 100, 50);
}

demo effect:

enter image description here

But how to integrate OffscreenCanvas in dygraph with web worker? Is it can achieve? If YES, please give a demo below.

0

There are 0 answers