的WebGL - 二傳渲染

我對WebGL的一個用法的問題。的WebGL - 二傳渲染

最近，我不得不實時渲染來自給定幾何體的後處理圖像。

我愛迪是：

的幾何形狀由頂點着色器
第一片段着色器用於呈現這種幾何形狀離屏
第二片段着色器後處理的投影在屏幕上離屏圖像，並在畫布上顯示結果。

我是如何實現它：

我寫了第一組兩個着色器的屏幕外渲染。它使我可以使用幀緩衝區將幾何圖形繪製到紋理。

對於第二部分，我創建了第二個glsl程序。這裏，頂點着色器用於投影覆蓋整個屏幕的矩形。片段着色器從挑選使用sample2D的幕後紋理合適的像素，並做了所有後期處理的東西。

這聽起來怪我，兩個認爲：

爲了「渲染」，屏幕外的紋理有與兩個大小功率產生，從而可以比顯著大畫布本身。
使用第二個頂點着色器似乎是多餘的。是否可以跳過這一步，直接進入第二個片段着色器，將畫外紋理繪製到畫布上？

所以，最大的問題是：什麼是實現這一目標的正確方法？我做對了什麼，我做錯了什麼？

謝謝您的建議:)

來源

2017-02-10 paulinodjm

In order to be 'renderable', the offscreen texture has to be created with a size power of two, and thus can be significantly larger than the canvas itself.

不，它不需要，只需要當你需要MIP映射過濾，創建和渲染到紋理NPOT（的兩個非功率）與LINEAR或NEAREST到過濾器是完全正常的。請注意，NPOT紋理僅支持CLAMP_TO_EDGE環繞。

Using a second vertex shader seems redundant. Is it possible to skip this step, and directly go to the second fragment shader, to draw the offscreen texture to the canvas?

不幸的是沒有，你可以使用一個和兩個相同的頂點着色器，只需將其連接到這兩個程序的渲染過程。然而，這將需要你的頂點着色器邏輯適用於這兩個幾何形狀，這是不太可能的+你無論如何都在切換程序，所以這裏沒有任何東西可以獲得。

來源

2017-02-10 15:38:54

>創建和渲染NPOT（非兩個電源）直線或最近過濾器材質是完全正常真奇怪......如果我刪除了'gl.texParameteri（gl.TEXTURE_2D，gl.TEXTURE_MIN_FILTER，GL。 LINEAR）; gl.texParameteri（gl.TEXTURE_2D，gl.TEXTURE_MAG_FILTER，gl.LINEAR）;'，或者如果我不使用POT紋理，我得到這個錯誤： '[.Offscreen-For-WebGL-000001EA50628900] RENDER警告：綁定到紋理單元0的紋理無法渲染。它可能不是2的功率，並且具有不兼容的紋理過濾有什麼問題？ – paulinodjm

當您未設置縮小過濾器時，它默認爲'NEAREST_MIPMAP_LINEAR'，因此需要使用mip映射。也許你的包裝模式關閉了，NPOT紋理（在WebGL 1中）不支持'REPEAT'或'MIRROR'包裝，只支持'CLAMP_TO_EDGE'。 –

的確，我手動將'TEXTURE_WRAP_ *'參數設置爲'CLAMP_TO_EDGE'，它現在可以與NPOT紋理一起使用。因此，對於第二部分，我必須使用第二個網格將紋理投影到屏幕上。這是不是有點矯枉過正？ – paulinodjm

的WebGL - 二傳渲染

回答

相關問題