Change Canvas sizes with zoom

I hava canvas like this:

canvas = document.getElementById('can');
canvas.width=(screenWidth*0.75);
canvas.height=(screenHeight-140);
ctx = canvas.getContext("2d");
w = canvas.width;
h = canvas.height;
canvas.addEventListener("mousemove", function (e) {
    findxy('move', e)
}, false);
canvas.addEventListener("mousedown", function (e) {
    findxy('down', e)
}, false);
canvas.addEventListener("mouseup", function (e) {
    findxy('up', e)
}, false);
canvas.addEventListener("mouseout", function (e) {
    findxy('out', e)
}, false);
}

I learning if user zooming and i taking old canvas data and i including this data in my hidden image , after i changing canvas width and height after i trying to make oldcanvas data to new canvas background like this:

let canvasimg = document.getElementById("canvasimg");
setInterval(() => {
    screenWidth = window.innerWidth;
    screenHeight = window.innerHeight;

    
    if(screenWidth!=screenWidthOriginal||screenHeight!=screenHeightOriginal){
    screenWidthOriginal = screenWidth;
    screenHeightOriginal = screenHeight;
    canvasimg.width = (screenWidth*0.75);
    canvasimg.height = (screenHeight-140);
    canvasimg.src = canvas.toDataURL("image/png"); 
    canvasimg.style.display="inline";
    canvas.width=(screenWidth*0.75);
    canvas.height=(screenHeight-140);
    ctx.drawImage(canvasimg, 0, 0);
    }

}, 1000);

if i look my hidden image its working , this image taking canvas data but my new canvas dont taking this image , if i try use normal image in my image src its working correctly.
As a result i cant making old canvas image to resized canvas background.