小编Ada*_*ith的帖子

有没有办法让WebGL在屏幕外渲染,而没有附加到DOM的webgl画布?

我认为这对于找到答案来说是一个简单的问题,但事实证明这是一个非常难以捉摸的问题.基本上,我正在尝试使用WebGL来完成一些图像处理和生成任务,并且我希望它能在屏幕外工作.理想情况下,我想WebGL的渲染场景的帧缓冲,我可以gl.readPixels()从,或到WebGL的画布,所以我可以用它作为context.drawImage().问题是,我不想显示webgl画布本身,我只想将它的一部分复制到一个可见的画布,我有一个常规的"2d"上下文.到目前为止,如果没有以下初始化,我似乎无法让它工作,这对我来说似乎是一个丑陋的黑客攻击:

glCanvas = document.createElement('canvas');
glCanvas.width = 256;
glCanvas.height = 256;
document.body.appendChild(glCanvas); // seems necessary, but why?
glCanvas.style.visibility = 'hidden'; // ugh, is this the only way?
Run Code Online (Sandbox Code Playgroud)

目前,我正在使用以下方法将帧渲染到我创建的帧缓冲区:gl.createFramebuffer()使用单个gl.drawArrays()调用,然后使用gl.readPixels()将结果输出到ImageData.随着glCanvas附加到DOM,它完全按计划工作.但是如果我把上面最后两行代码放在我附加glCanvas并隐藏它的地方,当我尝试从我渲染的帧缓冲区中读取像素时,我得不到任何图像.

我不明白为什么glCanvas需要附加到DOM,如果它甚至没有被渲染到.我认为渲染到帧缓冲区完全出现在显卡上,并且缓冲区将持续存在以供我用作纹理.除非至少有一个webgl-context画布附加到DOM,否则WebGL根本不会渲染?或者我错过了其他一些细节?谢谢!

javascript html5 webgl html5-canvas

6
推荐指数
1
解决办法
2963
查看次数

标签 统计

html5 ×1

html5-canvas ×1

javascript ×1

webgl ×1