webGL - 如何在幀緩衝區旁邊設置模板緩衝區並使用它？

徘徊如果有人可以幫助我。我目前使用webGL將我的內容渲染到幀緩衝區，以便它可以用作項目其他部分的紋理。這就像一個冠軍。不過，我現在需要在渲染到幀緩衝區時使用模板緩衝區，因爲我正在使用它來進行遮罩。我似乎無法弄清楚如何創建/附加模板緩衝區來處理我的幀緩衝區？這是到目前爲止我的代碼：webGL - 如何在幀緩衝區旁邊設置模板緩衝區並使用它？

// next time to create a frame buffer and texture 
this.frameBuffer = gl.createFramebuffer(); 
this.texture = gl.createTexture(); 

gl.bindTexture(gl.TEXTURE_2D, this.texture); 
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 
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_T, gl.CLAMP_TO_EDGE); 
gl.bindFramebuffer(gl.FRAMEBUFFER, this.framebuffer); 

gl.bindFramebuffer(gl.FRAMEBUFFER, this.frameBuffer); 
gl.framebufferTexture2D(gl.FRAMEBUFFER, 
         gl.COLOR_ATTACHMENT0, 
         gl.TEXTURE_2D, 
         this.texture,0);

所以我的問題是，如何創建，然後使用模板緩衝區與幀緩衝上面創建相處？

謝謝大家！

來源

2014-04-09 Mat Groves

持續在您的代碼不放過

var renderbuffer = gl.createRenderbuffer(); 
gl.bindRenderbuffer(gl.RENDERBUFFER, renderBuffer); 
gl.renderbufferStorage(gl.RENDERBUFFER, gl.STENCIL_INDEX8, width, height); 
gl.framebufferRenderbuffer(
    gl.FRAMEBUFFER, gl.STENCIL_ATTACHMENT, gl.RENDERBUFFER, renderbuffer);

注意最感興趣的：你沒有通過調用texImage2D設置你的紋理大小。模板緩衝區的大小必須與紋理的大小相匹配。

另外，僅使用模板緩衝區並不保證可以在所有平臺上工作。 OpenGL ES的不幸並不能保證幀緩衝區附件的任何組合的工作:(幸運的WebGL做，只需要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渲染

所以，你有3個選項。

只分配一個模板緩存，只是祈禱它的工作原理
只分配一個模板緩存，連接它和顏色紋理，然後調用gl.checkFramebufferComplete，看看它是否工作。如果不打印錯誤
使用DEPTH_STENCIL附件，該附件保證可以在任何地方工作。

我會選擇＃3 :)在這種情況下，代碼更改爲

var renderbuffer = gl.createRenderbuffer(); 
gl.bindRenderbuffer(gl.RENDERBUFFER, renderBuffer); 
gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width, height); 
gl.framebufferRenderbuffer(
    gl.FRAMEBUFFER, gl.DEPTH_STENCIL_ATTACHMENT, gl.RENDERBUFFER, renderbuffer);

來源

2014-04-10 07:39:06 gman

這是完美的！你的建議就像一個魅力！非常感謝你：） –

-2

看看這個頁面：http://www.playtankworld.com/demo/stencil_shadows

在那裏，你可以發現，利用模板緩衝區渲染陰影一個完整的演示。

你在代碼的行772至797

來源

2014-04-09 14:38:06

的鏈接斷開。 –

鏈接已經破碎。它現在看來是賭場的廣告 - 用德語寫的。 –

webGL - 如何在幀緩衝區旁邊設置模板緩衝區並使用它？

回答

相關問題