16

我一直在努力寻找一个明确的答案,但似乎没有人明确提出这个问题。

我可以在 WebGL Chrome、Firefox、Safari、IE 等中使用 1D 采样器和 1D 纹理吗?

编辑

可以理解,1 确实是 2 的幂 (2^0=1),这意味着您可以有效地使用 2D 采样器和使用高度为 1 和宽度为 256 或 512 等的纹理来复制一维纹理。

1D 纹理没有实际意义,它们之所以存在,是因为它们不仅有目的,而且旨在转化为 GPU 本身的优化(与 2D 纹理相反)。请记住,每个参数都需要时间加载到调用堆栈上,几乎所有 GPU 编程都是优化每一个可能的操作的艺术。

计算着色器经常需要一个没有额外维度的浮点列表,使用 1D 纹理和采样器提供与强类型相同的清晰度。即以一维结构表示一维数据,并以二维结构表示二维数据。它还删除了索引到行/列转换所需的额外操作。

问题不是他们是否有充分的理由,而是他们是否得到支持。

截至2014 年 5 月 9 日,在基于OpenGL ES 2.0的WebGL 1.0中

  • 当前没有 1D 纹理或采样器支持。
4

3 回答 3

12

为什么需要一维纹理?只需制作 N 像素宽和 1 像素高的 2D 纹理。

var tex = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, tex);

// 3x1 pixel 1d texture
var oneDTextureTexels = new Uint8Array([
    255,0,0,255, 
    0,255,0,255,
    0,0,255,255,
]);

var width = 3;
var height = 1;
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE,
              oneDTextureTexels);

generatemips 或设置过滤,因此不需要 mips

gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_W, gl.CLAMP_TO_EDGE);

0.5for取样y

uniform sampler2D u_texture;
varying float v_texcoord;

void main() {
  vec4 color = texture2D(u_texture, vec2(v_texcoord, 0.5));
  ...

这是一个使用 1D 纹理的示例。它使用典型光照计算的点积从 1d 渐变纹理中查找值来为对象着色。

直接回答你的问题。WebGL 中不会有 1D 纹理,因为 WebGL 基于 OpenGL ES 2.0 而 OpenGL ES 2.0 不支持 1D 纹理。OpenGL ES 3.0 和 3.1 都没有。如果他们在合并 OpenGL 和 OpenGL ES 时没有完全删除 1D 纹理,我会感到惊讶

于 2014-05-08T18:05:53.557 回答
7

WebGL 1.0 基于不支持一维纹理的 OpenGL ES 2.0。WebGL 规范中的纹理对象texImage2D部分仅通过具有和compressedTexImage2D方法来反映这一点。

您可以改用高度为 1 的纹理。

于 2014-05-08T12:23:56.927 回答
0

正如 Jens Nolte 所说,它在 WebGL 中不受支持,因为它基于 OpenGL ES。您可以使用具有单位宽度或高度的 2D 纹理。例如(256 宽和 1 高):

glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, 256, 1, 0,
             GL_RGBA, GL_UNSIGNED_BYTE, ColorMap.optimalIB);

然后在采样器中,您可以使用任何高度值对纹理进行采样(因为这无关紧要)。

于 2014-05-08T13:20:26.610 回答