2014-01-26 17 views
5

我总是发现照明和阴影是WebGL/Three.js中最困难的部分,它让我感觉自己正在弥补。我怎样才能渲染一个Three.js场景,照明和阴影就像这样(附)?

您认为我需要用什么样的照明和阴影组合来实现与以下图像类似的外观和感觉?它非常柔软,但却非常清晰,而我的尝试总是出现严酷而杂乱的。

+0

看起来像平坦的阴影+环境遮挡,但我没有太多的想法如何实现它与three.js –

+0

嗯,图片呈现,因此非常流畅。要获得三角形外观,您必须重新计算网格的顶点法线。正如你所看到的,它们需要与面部法线方向相同,所以对于每个三角形,将面部法线复制到其3个顶点法线上。 对于照明,也许尝试SSAO和一些后处理,以获得根据您的参考图像的颜色,但没有内置的方式来得到我知道的three.js这种光滑的间接照明。 – GuyGood

+0

这两条评论都是有效的;您的参考文献使用了具有全局照明的低聚模型(成千上万的光线对网格的阴影作出贡献),这对于THREE来说是不可能的。 所以你需要一个低纹理的网格,然后effectComposer可以帮助你实现“instagramish”的外观。内置的雾将不会让你得到轻微的阴霾,并且当它被烘烤时,当你的网格移动时,你将失去阴影的相互作用;马之间的空间更黑,因为光线不能达到它的背部/头部这是AO(SSAO在这里不会很好地工作)。 – nicoptere

回答