Three.JS - 不同物體的不同着色器

Question

我試圖在three.js中模糊多個網格物體，每個物體具有不同的模糊量。我有一個EffectComposer，它使用了示例中使用的Horizo​​ntalBlurShader和VerticalBlurShader。關於如何去做這件事的任何想法？我會使用多個場景嗎？我渲染到目標還是直接渲染到屏幕？

Answer 1

這聽起來像是其中一個它取決於種問題。

你試圖達到什麼樣的效果？對形狀感興趣嗎？如果它們相交，它們將如何模糊？

首先想到的是我如何在Photoshop中做到這一點。我會將每個形狀放在它自己的圖層上，併爲每個圖層應用模糊濾鏡。這將在three.js中對應每個形狀創建一個場景，將每個形狀繪製到渲染目標，模糊該目標，然後將該目標繪製到畫布上（或另一個目標）。有效地將3d形狀逐個渲染成2D紋理，模糊紋理，然後繪製每個紋理。它會提供相同的外觀，就好像您已將每個圖形放在Photoshop中的自己的圖層中併爲每個圖層應用了不同的模糊。