Webgl - 在程序1中创建纹理并将其发送到程序2.没有纹理绑定到单元0

时间:2017-12-15 12:01:46

标签: javascript glsl webgl shader

我试图在我的第一个程序中创建一个alpha映射,以便在我的第二个程序中使用。我觉得我已经把它设置正确但是我得到了一个错误:

[.Offscreen-For-WebGL-0x7fc3281a4200]RENDER WARNING: there is no texture bound to the unit 0

我使用两个单独的类,因为第二个程序有时会在没有第一个屏蔽的情况下运行。

我的程序都在一个接一个地运行在同一个gl上下文中。我按照第一个程序然后第二个顺序运行设置代码,然后当然以相同的顺序运行绘制功能。

设置程序1(创建alpha地图):

// Get gl, add blending ect, then...

// The webgl variable below just holds webgl constants from https://google.github.io/closure-library/api/goog.webgl.html

this.targetTexture_ = this.gl_.createTexture();
this.gl_.activeTexture(webgl.TEXTURE0);
this.gl_.bindTexture(webgl.TEXTURE_2D, this.targetTexture_);
this.gl_.texImage2D(webgl.TEXTURE_2D, 0, webgl.RGBA, this.gl_.canvas.width,
    this.gl_.canvas.height, 0, webgl.RGBA, webgl.UNSIGNED_BYTE, null);

this.gl_.texParameteri(webgl.TEXTURE_2D, webgl.TEXTURE_MIN_FILTER, webgl.LINEAR);
this.gl_.texParameteri(webgl.TEXTURE_2D, webgl.TEXTURE_WRAP_S, webgl.CLAMP_TO_EDGE);
this.gl_.texParameteri(webgl.TEXTURE_2D, webgl.TEXTURE_WRAP_T, webgl.CLAMP_TO_EDGE);

this.textureFrameBuffer_ = this.gl_.createFramebuffer();
this.gl_.bindFramebuffer(webgl.FRAMEBUFFER, this.textureFrameBuffer_);
this.gl_.framebufferTexture2D(webgl.FRAMEBUFFER, webgl.COLOR_ATTACHMENT0, webgl.TEXTURE_2D, this.targetTexture_, 0);

// Now i set the maskTexture on the second programs class.
this.secondProgramClass.maskTexture = this.targetTexture_;

// Now i compile & attach the shaders and link the program

然后设置程序2:

// Compile, attach, link up the program...

// This is the texture location to use.
this.maskTextureLocation_ =
    this.gl_.getUniformLocation(this.program_, LocationName.MASK);

绘制程序1的功能:

this.gl_.bindFramebuffer(webgl.FRAMEBUFFER, this.textureFrameBuffer_);
this.gl_.bindTexture(webgl.TEXTURE_2D, this.targetTexture_);
this.gl_.viewport(0, 0, this.gl_.canvas.width, this.gl_.canvas.height);

// Clear to transparent
this.gl_.clearColor(0, 0, 0, 0);
this.gl_.clear(webgl.COLOR_BUFFER_BIT | webgl.DEPTH_BUFFER_BIT);

this.gl_.useProgram(this.program_);

// A helper function that runs: enableVertexAttribArray, bindBuffer, vertexAttribPointer on the objects location and buffer.
// In this case its just a square the size of the viewport.
renderBufferAttribute(this.gl_, this.position_);

// Draw triangles
this.gl_.drawArrays(webgl.TRIANGLES, 0, 6);

绘制程序2的功能:

现在这个类已经从第一个类设置中设置了maskTexture,并且在第一个类将其绘制函数运行到纹理之后,我应该能够通过传递的纹理绘制这个程序,对吧?

this.gl_.bindFramebuffer(webgl.FRAMEBUFFER, null);

this.gl_.clearColor(0, 0, 0, 0);
this.gl_.clear(webgl.COLOR_BUFFER_BIT);

this.gl_.useProgram(this.program_);

// A helper function that runs: enableVertexAttribArray, bindBuffer, vertexAttribPointer on the objects location and buffer.
renderBufferAttribute(this.gl_, this.position_);

if (this.maskTexture) {
  this.gl_.activeTexture(this.gl_.TEXTURE0);
  this.gl_.bindTexture(webgl.TEXTURE_2D, this.maskTexture);
  this.gl_.uniform1i(this.maskTextureLocation_, 0);
}

// Draw triangles
this.gl_.drawArrays(webgl.TRIANGLES, 0,
    this.particleCount_.total * PARTICLE_ARRAY_COUNT / 2);

此刻的着色器可能与此问题无关,我们可以假设它们都会在第二个预期的情况下呈现一个块:

// Stored in LocationName.MASK above.
uniform sampler2D u_mask;

我不认为我错过任何东西,但任何方向都会受到赞赏。我在每个绘制周期都得到了上面提到的错误。在需要时更新详细信息。

谢谢!

1 个答案:

答案 0 :(得分:0)

原来我甚至不需要将纹理发送到任何地方,因为它自动绑定到webgl上下文中的纹理单元0。因此,一旦第一个程序绘制到纹理0,第二个程序也已经在纹理0上具有相同的数据。