WebGL：非方形 alpha 纹理的数据

Posted 2023-03-15

【中文标题】WebGL：非方形 alpha 纹理的数据

【英文标题】：WebGL : data to non square alpha texture

【发布时间】：2013-03-03 20:13:01

【问题描述】：

我对 webGL 有一个奇怪的问题。

我正在使用动态生成的纹理，其中只有 Alpha 通道很重要。 代码如下：

var texture  = new Uint8Array(ar); // ar is my array
gl.bindTexture(gl.TEXTURE_2D, this.transparencyTexture);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.ALPHA, array.length, array[0].length, 0, gl.ALPHA, gl.UNSIGNED_BYTE, texture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);   

我总是使用 POT 数组的“宽度”和“高度”，但只要“宽度”“高度”它就不起作用。所以它目前只适用于正方形。

可以做什么？

编辑：

http://jsfiddle.net/SergeJcqmn/EAmjU/9/

【问题讨论】：

看起来像是一个浏览器错误，但如果没有更多细节就很难知道。例如，你的纹理坐标是什么？你从gl.getError() 得到什么？它的视觉效果如何？

只是好奇但array.length, array[0].length？所以你在 javascript 中有一个二维数组？这与ar 有什么关系？

我提供了正确的坐标（也用于其他纹理）。 gl.getError() 返回 0。它仅显示为 vec4(0, 0, 0, 0) 像素/片段。

我正确地从二维数组生成 ar。我检查了 ar 长度，它等于 array.length * array[0].length。即使我生成错误（我没有），它也会导致 100% vec4(0, 0, 0, 0) 纹理之外的东西。另外，当我使用“方形”纹理时，效果还不错。

这是一个演示：serge.snakeman.be/Demo/Portail.html 上条（某种能量条）应该每帧用随机数量的蓝色填充（然而，由于我遇到的问题，它是纯黑色的） .

【参考方案1】：

在jsfiddle中，js的第76行不正确：

ar.push(array[x][(array.length - 1) - y] ?  128 : 0);

我认为应该是这样的：

ar.push(array[x][(array[0].length - 1) - y] ?  128 : 0);

【讨论】：

你完全正确。我很惊讶没有报告“超出索引”错误（因为那是错误）。谢谢。