三.js 绽放是模糊的？答案

【问题标题】：three.js bloom is a blur?三.js 绽放是模糊的？
【发布时间】：2015-09-22 10:56:40
【问题描述】：

我目前正在尝试使用three.js，并尝试添加绽放效果。然而，当我添加绽放时，它更像是模糊而不是实际的绽放：

代码：

composer = new THREE.EffectComposer(renderer, renderTarget);
effectBloom = new THREE.BloomPass(1, 25, 5);
composer.addPass(renderModel)
composer.addPass(effectBloom);
composer.addPass(copyPass)

及其被渲染：

composer.render( delta )

我想更接近这个：

【问题讨论】：

我查看了着色器here 如果不自己设置浮点渲染纹理，您可能应该让黄色更亮。代码here 似乎说模糊通道只是叠加，这就是第 30 行的材料所做的。尝试在当前输出上添加另一个带有绽放渲染结果的复制通道，可能会起作用
感谢您的快速响应，我现在已将黄色的亮度调高，并尝试添加另一个复制通道。但我对这种编程完全陌生，我不确定通行证是否有效，或者我做错了什么。可能是后者。如果不是太麻烦，您能否简要解释一下通行证是如何处理的？
我已经使用示例找到了解决方案，结果证明解决方案非常简单，而不是我的问题。 'renderer.autoClear = false;'我仍然可以使用该解释以供将来参考。
简而言之，您在整个屏幕上渲染两个三角形，然后使用该四边形的着色器处理临时纹理（缓冲区）。您可以随心所欲地发挥创造力。在这里，您将场景渲染为纹理，然后处理此纹理并沿复制的方式进行处理（例如在一个方向模糊它，然后使用该临时纹理并在另一个方向模糊它）。在链的末尾，您将结果显示在屏幕上。
您的帮助很有教育意义，非常感谢您^^

标签： three.js bloom

【解决方案1】：

我遇到了类似的问题。 Bloom 只是模糊了渲染的图像。要解决这个问题，我必须将渲染器 autoClear 设置为 false：

renderer.autoClear = false;

在我的渲染循环中，我必须在使用 composer 渲染场景之前手动进行清除：

renderer.clear();
composer.render();

检查我的笔以查看此操作： http://codepen.io/jaamo/pen/BoKXrL

【讨论】：

裂笔示例

【解决方案2】：

绽放是一种模糊的图像，叠加在您的主要渲染之上。您可能需要更多的动态范围来创建所附图像中的效果。

【讨论】：