Three.js - 在GPU乒乓球時設置不同的清晰顏色

嘗試在Three.js中使用GPU乒乓球來實現某些東西，我遇到了一個奇怪的問題，其中爲渲染器設置清晰的顏色似乎被覆蓋片段着色器的輸出負責渲染事物。Three.js - 在GPU乒乓球時設置不同的清晰顏色

如果我將清除顏色設置爲白色，像素將變爲白色。如果我將其保留爲黑色，像素的顏色是正確的。

如果我不需要，我寧願不必畫飛機。

我不確定如果這是一個Three.js特定的事情，或者它是固有的OpenGL ES2，因爲我嘗試直接設置清晰顏色（render.getContext（）。clearColor（1.0,1.0,1.0， 1.0）），但最終獲得了相同的結果。

任何幫助或指針，非常感謝！

來源

2015-05-06 sortofsleepy

所以你想要一個alpa，或沒有bg所有在一起...即時困惑 – Careen

@Careen我不知道什麼是混亂？總之，我不能改變背景，而不會影響我想要使用GPU呈現的內容。不試圖影響背景alpha，我只是想能夠自由地改變它的顏色。 – sortofsleepy

這是一個更好的方式來解釋它......大聲笑我得到它100％重命名你的問題..你想在運行時改變它的顏色到不同的顏色一個簡單的解決方案將是使用alpha bg和更改css bg顏色與JavaScript通過在飛行中添加類？ – Careen

如果啓用了混合，背景顏色可能會影響您的渲染。如果您不需要混合，請將其禁用：

glDisable(GL_BLEND);

如果確實需要混合，事情會變得稍微複雜一些。一些最常用的混合功能，如日益流行：

glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);

工作很好，任何背景顏色。例如，使用此混合函數，如果您在白色背景上渲染不透明的紅色（片段的alpha值爲1.0），您仍然會變紅。

其他一些混合功能只能在黑色背景下使用。例如，如果您使用添加劑混合：

glBlendFunc(GL_ONE, GL_ONE);

在白色背景上渲染任何東西都會使其保持白色。那麼，因爲它增加了白色，它會比「白色更白」，但只適用於洗衣洗滌劑廣告片。 :)

請注意，上面的代碼行將用於OpenGL的C/C++綁定。我希望他們能夠輕鬆地轉換成WebGL/Three.js。

來源

2015-05-06 15:28:25

添加到此 - 如果您使用Three.js，則將混合模式指定爲THREE對象的屬性。您在創建着色器材質時通過指定混合模式來「打開」混合。或者，您也可以按照Reto的說明，首先通過調用來獲取對webgl上下文的引用（注意「renderer」應該是您爲webgl渲染器選擇的任何變量名稱） var gl = renderer.getContext（） ' 那麼你可以使用上述功能，如 'gl.disable（gl.GL_BLEND）' – sortofsleepy

這與緩衝區清除，ping乒乓和「背景」有什麼關係？ – pailhead

@pailhead 它涉及到，因爲我特別使用和提及Three.js。 Reto的答案只引用泛型opengl調用，其中，平均Three.js用戶/修飾者可能無法轉換爲javascript。 – sortofsleepy

要設置three.js所渲染器來清除，使用的顏色：

renderer.setClearColor (color, alpha)

http://threejs.org/docs/#Reference/Renderers/WebGLRenderer

爲了做到從上面的答案水平低的呼叫，在three.js所做到這一點：

myMaterial.transparent = false;

Three.js將在該對象即將繪製時發出正確的調用。

來源

2015-05-07 18:00:03 pailhead

Three.js - 在GPU乒乓球時設置不同的清晰顏色

回答

相關問題