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:
But how to integrate OffscreenCanvas in dygraph with web worker? Is it can achieve? If YES, please give a demo below.