三个环境中的环境遮挡 [英] Ambient occlusion in threejs

问题描述

我刚刚使用three.js （可以在这里看到）完成了从opengl到webgl的第一次布料模拟的移植。

I've just finished porting of my first cloth simulation from opengl to webgl using three.js (can be seen here).

事情是它看起来有点沉闷，我想添加（因为我希望我能从我的计算机图形类中正确记住）环境遮挡，使布料很好与球碰撞时阴影。我对着色器的了解现在处于非常低的水平，所以我非常感谢有关这个主题的任何资源，有助于three.js开发（教程，书名等），因为谷歌对它一无所知。

The thing is it looks a bit dull, and I want to add (as i hope i remember correctly from my computer graphics classes) ambient occlusion, to make the cloth nicely shaded on collision with ball. My knowledge about shaders is now on very low level, so I'd be very thankful for any resources on this topic helpful with three.js development (tutorials, book titles etc), because googles doesn't know anything about it.

因为WestLangley，阴影是固定的！
现在回到其他问题：关于三个着色器的任何有用资源，或者只是一般的hlsl？

So the shading is fixed thanks to WestLangley! Now back to the other questions: any helpful resources on shaders for threejs, or just hlsl in general?

推荐答案

有几种方法可以产生环境遮挡：

There are several ways to produce ambient occlusion:

• 全局照明（GI）


• 全球低 - 光强度的频率近似（GI快捷方式）


• 屏幕空间近似，通常称为SSAO（屏幕空间环境遮挡）

以下是关于three.js环境遮挡的一些讨论：

here are a few discussions on ambient occlusion in three.js:

• https://github.com/mrdoob/three.js/issues/6575 [实时全球/间接照明]


• https://github.com /mrdoob/three.js/issues/4434 [Voxel Cone追踪全球照明]


• https://github.com/mrdoob/three.js/issues/5554 [更好的阴影地图]

• https://github.com/mrdoob/three.js/issues/6575 [Real Time Global/Indirect Illumination]
• https://github.com/mrdoob/three.js/issues/4434 [Voxel Cone Tracing global illumination]
• https://github.com/mrdoob/three.js/issues/5554 [Better shadow maps]

很可能你想从three.js引用这个例子来启动你：

most likely you would want to refer to this example from three.js to start you off:

• http://threejs.org/examples/#webgl_postprocessing_ssao

• http://threejs.org/examples/#webgl_postprocessing_ssao

这篇关于三个环境中的环境遮挡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！