2

我有一系列纹理堆叠在一起（使用 mip-map-style 分辨率金字塔）以达到最终图像。

由于它们的堆叠方式，当它们没有被有意义的图像数据填充时，有必要将它们初始化为无符号整数值 128。IE，128 为零，因为渲染着色器将从每个纹理值中减去 0.5，这允许后续的金字塔层将最终图像偏移正值或负值。

我似乎无法弄清楚如何将（单通道 GL_LUMINANCE）纹理初始化为一个值！

我尝试将其设置为渲染缓冲区目标并向其渲染多边形，但 FBO 似乎被标记为不完整。我也尝试将其定位为渲染缓冲区目标并使用 gl.clear(gl.COLOR_BUFFER_BIT) 但它再次被认为是不完整的。

显而易见的事情是使用 gl.texSubImage2D() 复制值，但这似乎真的很慢......也许这是唯一的方法？我希望有一些更优雅的东西，它不需要分配这么多内存（至少一个帧的单个值的价值）并且如此缓慢（因为当所有数据都是单个值时，必须将所有数据写入缓冲区）。

在 WebGL 中将纹理设置为（默认）值的唯一方法似乎是调整它的大小或分配它，这会将其设置为全零。

此外，似乎没有像 gl.SIGNED_BYTE 这样的复制模式允许零为零（IE，有符号值进来）......但这也不能解决将纹理初始化为单个的问题值（在本例中为零）。

有任何想法吗？除了简单地将值复制到其中之外，如何将 WebGL 纹理初始化为一个值？

4

2 回答 2

2

不幸的是，WebGL 所基于的 OpenGL ES 2.0 规范不能保证能够渲染到特定类型的纹理。判断它是否有效的唯一方法是创建纹理，将其附加到帧缓冲区，然后调用 checkFramebufferStatus 并查看它是否返回 FRAMEBUFFER_COMPLETE。不幸的是，在很多情况下它不会。

只有 3 种附件组合才能保证有效

  • COLOR_ATTACHMENT0 = RGBA/UNSIGNED_BYTE 纹理
  • COLOR_ATTACHMENT0 = RGBA/UNSIGNED_BYTE 纹理 + DEPTH_ATTACHMENT = DEPTH_COMPONENT16 渲染缓冲区
  • COLOR_ATTACHMENT0 = RGBA/UNSIGNED_BYTE 纹理 + DEPTH_STENCIL_ATTACHMENT = DEPTH_STENCIL 渲染缓冲区

所以你的选择是

  1. 使用 RGBA 纹理并渲染 128,128,128,??? 在 fbo（或 gl.clear it）中对其进行处理

  2. 使用 LUMINANCE 纹理并调用 texImage2D

  3. 使用 LUMINANCE 纹理并使用 backbuffer 调用 copyTexImage2D 或将正确大小的 fbo 清除为您想要的颜色（尽管不能保证这是快速的 AFAIK）
于 2012-06-04T06:46:28.120 回答
0

根据我的经验（主要是在 OSX 中使用 Chrome），使用 Canvas 初始化纹理很快。我猜是因为浏览器分配 Canvas 并在 GPU 上全部绘制，并且其 WebGL 实现使用与 Canvas 相同的 GL 上下文，因此没有巨大的 CPU 到 GPU 内存传输。

        // Quickly init texture to (128,128,128)
        var canvas = this._canvas = document.createElement("canvas");
        canvas.width = wTex;
        canvas.height = hTex;
        var ctx = this._ctx = canvas.getContext("2d");
        ctx.fillStyle = "#808080";
        ctx.fillRect(0, 0, wTex, hTex);
        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, gl.RGB, gl.UNSIGNED_BYTE, canvas);
于 2017-09-28T07:42:50.810 回答