如何在Three.js中提高EffectComposer的分辨率？

Question

我正在使用EffectComposer将皮肤效果应用到我的头像。但是，与没有后处理的版本相比，最终分辨率看起来相当模糊。我试图改变pixelRatio设置，但没有太大的成功。

我使用以下示例中的代码：https://threejs.org/examples/webgl_materials_normalmap.html

更新 我比较了THREE.js中相同法线贴图示例的两种不同实现，在那里我可以看到不同的分辨率质量。我认为设置 renderer.setPixelRatio（window.devicePixelRatio）（等于2）允许模型适合屏幕但看起来模糊（特别是在缩小时）。但是，如果未设置renderer.setPixelRatio，则应用标准值1，从而使模型变得更清晰，但仅在窗口大小的25％处呈现。

在更好的图像下方比较清晰度/分辨率。右边的那个比左边的那个更锐利。

我需要以窗口的完整大小呈现更清晰的版本。

有什么建议吗？ 提前谢谢。

Answer 1

WebGL在渲染渲染目标时不支持抗锯齿。虽然可以应用额外的后处理效果来补偿它。 另外，EffectsComposer和抗锯齿可能存在问题。 我自己并没有深入研究过它，但看看这些主题：

https://github.com/mrdoob/three.js/issues/568

https://github.com/openworm/org.geppetto.frontend/issues/724

和

https://github.com/openworm/org.geppetto.frontend/pull/728