如何通过保留内容来调整WebGLTexture的大小?

时间:2017-10-03 09:04:26

标签: javascript webgl

我想调整通过与Framebuffer前一帧绑定而呈现的WebGLTexture。

我尝试使用具有新大小的texImage2D并保持格式和类型来调整此纹理的大小。

我知道这不行。这可能会产生新的纹理,其大小用[0,0,0,0]清除整个像素。

如何通过保留内容来调整WebGLTexture的大小?

1 个答案:

答案 0 :(得分:2)

您无法在WebGL中调整纹理大小而不会丢失其内容。您需要分配具有所需大小的另一个纹理并将旧纹理的数据复制到其中。有两种方法可以做到这一点:通过copyTexSubImage2D电话或通过平局电话。请注意,第一种方法需要将旧纹理链接到帧缓冲区,第二种方法需要将新纹理链接到新纹理。

假设您的WebGL上下文为gl,旧纹理为oldTexture,其链接的帧缓冲为oldFramebuffer,新纹理为newTexture,其帧缓冲为{ {1}}。

使用newFramebuffer,您可以执行以下操作:

copyTexSubImage2D

完成了!请注意,此方法不允许您操作纹理数据,只是将其复制为像素到像素。

第二种方式有点复杂,需要一些我不会在此列出的着色器。基本上,您需要设置上下文以绘制纹理四边形。

gl.bindFramebuffer(gl.FRAMEBUFFER, oldFramebuffer);
gl.bindTexture(gl.TEXTURE_2D, oldTexture);
gl.copyTexSubImage2D(
    gl.TEXTTURE_2D,
    0,
    offsetInNewTextureX,
    offsetInNewTextureY,
    offsetInOldTextureX,
    offsetInOldTextureY,
    width,
    height
);

这样你就可以操纵复制的数据,即拉伸它。

  

我尝试使用具有新大小的texImage2D来调整此纹理的大小   保持格式和类型。

     

我知道这不行。这可能会生成具有大小的新纹理   用[0,0,0,0]清除整个像素。

是的,你就在这里。