Three.js 后处理不适用于 effectcomposer

【问题标题】：Three.js postprocessing not working with effectcomposerThree.js 后处理不适用于 effectcomposer
【发布时间】：2021-01-16 07:16:22
【问题描述】：

未创建大纲。我也尝试了一个 BloomFilter，它看起来就像我没有添加任何过滤器一样。

这可能是什么问题？

// in global scope
const clock = new THREE.Clock();

// in initialization
this.composer = new EffectComposer(this.renderer);
this.composer.addPass(new RenderPass(this.scene, this.camera.camera_object));
this.composer.addPass(new EffectPass(this.camera.camera_object, new OutlineEffect(this.renderer, this.camera.camera_object, {
  defaultThickness: 0.01,
  defaultColor: [0, 0, 0],
  defaultAlpha: 0.8,
  defaultKeepAlive: true
})));

// in render loop

this.composer.render(clock.getDelta());

【问题讨论】：

标签： three.js

【解决方案1】：

如果没有完整的代码示例，很难看出错误。后处理效果需要以下内容：

加载后处理库。在下面的示例中，我提供了效果的完整 URL。
创建效果通道。 new THREE.OutlinePass 或 new THREE.UnrealBloomPass 或类似名称。
用composer.addPass([your_pass])添加效果。

这是一个使用 OutlinePass 和 UnrealBloomPass 的最小 CodePen 示例：

https://codepen.io/adelriosantiago/pen/qBaLmZK?editors=1010

请注意，OutlinePass 要求 selectedObjects 是一个包含您想要影响的对象的数组。

【讨论】：