fix: update canvas size on window resize

This commit is contained in:
Felix Roos 2023-06-30 16:03:56 +02:00
parent 90a58858ca
commit 1b85aa713b
2 changed files with 11 additions and 2 deletions

View File

@ -15,6 +15,14 @@ export const getDrawContext = (id = 'test-canvas') => {
canvas.height = window.innerHeight;
canvas.style = 'pointer-events:none;width:100%;height:100%;position:fixed;top:0;left:0';
document.body.prepend(canvas);
let timeout;
window.addEventListener('resize', () => {
timeout && clearTimeout(timeout);
timeout = setTimeout(() => {
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
}, 200);
});
}
return canvas.getContext('2d');
};

View File

@ -68,8 +68,9 @@ Pattern.prototype.spiral = function (options = {}) {
} = options;
function spiral({ ctx, time, haps, drawTime }) {
ctx.clearRect(0, 0, ctx.canvas.clientWidth, ctx.canvas.clientHeight);
const [cx, cy] = [ctx.canvas.width / 2, ctx.canvas.height / 2];
const [w, h] = [ctx.canvas.width, ctx.canvas.height];
ctx.clearRect(0, 0, w * 2, h * 2);
const [cx, cy] = [w / 2, h / 2];
const settings = {
margin: size / stretch,
cx,