Javascript HTML画布不'；t如果写入屏幕外画布，则显示矩形

我曾尝试创建一个带有全屏画布的HTML页面，我可以画出这样的效果。如果我创建第二个“屏幕外”画布在主画布上绘制和显示，我什么也看不到

我的代码是：

var画布；
var canvas_ctx；
var off_canvas=document.createElement（'canvas'）；
var off_canvas_ctx；
init（）；
drawTree（）；
函数init（）{
canvas=document.getElementById（'treeCanvas'）；
if（canvas.getContext）{
canvas_ctx=canvas.getContext（“2d”）；
addEventListener（'resize'，resizeCanvas，false）；
window.addEventListener（'orientationchange'，resizeCanvas，false）；
调整画布的大小（）；
}
off_canvas.width=5000；
离地高度=5000；
off_canvas\u ctx=off_canvas.getContext（'2d'）；
}
函数resizeCanvas（）{
var cWidth=window.innerWidth；
var cHeight=window.innerHeight-3；
var imgData=canvas_ctx.getImageData（0,0，cWidth，cHeight）；
//调整原始画布的大小
canvas.width=cWidth；
canvas.height=cHeight；
//复制回已调整大小的画布
canvas_ctx.putImageData（imgData，0,0）；
}
函数drawTree（）{
canvas_ctx.fillStyle=“#FF0000”；
canvas_ctx.fillRect（0,0,150,75）；
off_canvas_ctx.fillStyle=“#FF0000”；
off_canvas_ctx.fillRect（0,0,150,75）；
调整画布的大小（）；
}

您的浏览器不支持画布元素。

我的错误是，在获得第二个画布的上下文之前，我调用了“resizeCanvas（）”的“init（）”函数，这似乎会在会话的其余部分把它搞砸

    canvas_ctx = canvas.getContext("2d");
    off_canvas.width = 5000;
    off_canvas.height = 5000;
    off_canvas_ctx = off_canvas.getContext('2d');

向上移动块似乎解决了问题