context.readPixels(0, 0, context.drawingBufferWidth, context.drawingBufferHeight, context.RGBA, context.FLOAT, pixels);
这是代码。我在控制台中收到此错误:WebGL:INVALID_ENUM:readPixels:无效类型
但是这很好用:
context.readPixels(0, 0, context.drawingBufferWidth, context.drawingBufferHeight, context.RGBA, context.UNSIGNED_BYTE, pixels);
应该支持float或int,但只有unsigned_byte有效。网上没有关于如何正确应用似乎有效的类型的资源。一切都遵循不同的模式。
不保证会支持FLOAT。保证支持的唯一格式/类型组合是RGBA / UNSIGNED_BYTE。 See Spec, section 4.3.1
此后的另一个依赖于实现格式/类型组合可能会受到支持,具体取决于您正在阅读的内容的类型。您可以使用
查询const altFormat = gl.getParameter(gl.IMPLEMENTATION_COLOR_READ_FORMAT);
const altType = gl.getParameter(gl.IMPLEMENTATION_COLOR_READ_TYPE);
const gl = document.createElement('canvas').getContext('webgl');
showAltFormat('canvas');
const ext1 = gl.getExtension('OES_texture_float');
const ext2 = gl.getExtension('WEBGL_color_buffer_float');
if (ext1 && ext2) {
const fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
const tex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0,
gl.RGBA, gl.FLOAT, null);
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex, 0);
showAltFormat('float rgba fb');
}
function showAltFormat(msg) {
const altFormat = gl.getParameter(gl.IMPLEMENTATION_COLOR_READ_FORMAT);
const altType = gl.getParameter(gl.IMPLEMENTATION_COLOR_READ_TYPE);
console.log(msg, 'readPixel alternate format/type combo', glEnumToString(gl, altFormat), glEnumToString(gl, altType));
}
function glEnumToString(gl, value) {
const keys = [];
for (const key in gl) {
if (gl[key] === value) {
keys.push(key);
}
}
return keys.length ? keys.join(' | ') : `0x${value.toString(16)}`;
}
上面的代码生成RGBA / FLOAT纹理,并将其附加到帧缓冲区,然后检查备用格式/类型组合以读取它。在Chrome上获取RGBA / UNSIGNED_BYTE,在Firefox上获取RGBA / FLOAT。由于备用组合是依赖于实现。
都是有效的响应。