three.js - 在 Three.js r136 的 ShaderMaterial 中实现灯光和阴影

Question

r136 中当前在 ShaderMaterial 中混合灯光、阴影和颜色的解决方案是什么？我已经找到了雾支持的解决方案。我在以前的版本（ r108
）中找到了一些例子，比如这个代码框。

实际上，我正在寻找这种结果：代码和框。
我应该将 MeshPhongMaterial 着色器复制为我自己的着色器的代码库吗？

在我的项目中必须使用自定义着色器，这就是我不使用内置材质的原因。

有什么想法或例子吗？
谢谢 ！

Answer 1

这个问题很大，没有一个答案。创建灯光、阴影和颜色因材料而异，并且包含许多元素，需要完整的课程才能学习。

但是，您可以在名为/ShaderChunk. 如果您查找“光”，您会看到着色器段（或“块”），用于每种材质，如香椿、朗伯、物理等。有些材质需要在着色器代码的开头定义参数，（这些是_pars文件），有些是在顶点着色器中计算的，有些是在片段中计算的，有些需要在_begin and _end.

阴影更加复杂，因为它们需要单独的渲染通道来构建阴影贴图。就像我说的，重新构建自己的灯光、阴影和颜色是一项艰巨的任务，需要一门完整的课程来学习。我希望这个答案至少可以为您指明正确的方向。