相关疑难解决方法(0)

我想获取我已经渲染的WebGLTexture对象并使用它来创建HTML图像元素.目标是显示屏幕外渲染过程的结果以进行调试.它应该比将纹理渲染到全屏四边形(我目前的调试方法)容易得多.

在WebGL中,从图像元素创建纹理非常简单:

var image = new Image();
image.src = "myImg.jpg";

// image loads...

var texture = gl.createTexture();
gl.bindTexture(texture);
gl.texImage2D(_gl.TEXTURE_2D, 0, _gl.RGBA, _gl.RGBA, _gl.UNSIGNED_BYTE, image);

图像加载和解码完全由您完成.

是否有类似的简单方法来反向？即:

// This doesn't work
var img = new Image(texture);

// But maybe this could
var img = createImageFromTexture(texture);

function createImageFromTexture(texture) {
    // ... some combination of tricks ...
}

如果有办法做到这一点,我相信它将在调试之外的上下文中有用.我会继续看看我是否能找到办法,但我觉得有人必须先尝试过这个.

我有一个WebGLTexture对象.如何获得该纹理的像素(类似于WebGL的readPixels,但是纹理)？

我的一个想法是使用preserveDrawingBuffer = true创建画布和WebGL上下文,并在此画布上渲染我的纹理,使其显示2D平面,然后使用readPixels.这种方法合理吗？有没有人有这样的示例代码？