想改善这个问题吗？更新问题，使其仅关注editing this post的一个问题。
5年前关闭。
Improve this question
我正在学习WebGL，并在网上找到了一些有用的教程，这些教程帮助我获得了有关该主题的一些基础知识，但是当事情变得真正有趣时，尤其是在照明方面，它们似乎都停止了。 !
到目前为止，我了解如何使用Phong反射模型实现一些基本的局部照明，包括环境照明，漫射照明和镜面照明，或者使用定向照明或点照明，每个顶点或每个片段照明。
因此，一开始肯定是一件好事，但是由于这种方法非常有限，并且考虑到照明的质量对于场景的真实感至关重要，我真的想走一步进一步。
但这说起来容易做起来难!我一直在寻找教程或文章，描述如何在WebGL中实现更复杂的照明方法，但是我找不到任何有用的东西!
就像站在没有门也没有路的厚墙前一样! -简直令人沮丧。
现在，由于找不到关于全局照明模型的实现的WebGL相关信息，也找不到关于如何使用光线追踪等所有东西的描述，这些信息已经被开发出来以使场景看起来更加逼真，因此我尝试对它进行一些反向工程。可以轻松地找到其中一些非常出色的WebGL作品。
但是由于事情的复杂性，由于缺乏有见地的评论，甚至缺乏变量或函数的半途而废的名称，而且由于自身技能的局限性，我惨败!
然后，我尝试进行更多的理论尝试，阅读了有关数学基础的论文，但结果表明，从无编程上下文的数学公式到在WebGL中有效的实现，这实际上是一条很长的路要走-大多数情况下解释得很差。代码，所以以这种方式进行操作与我以前的工作一样无效...
好吧，我知道，在此论坛上寻求有关该主题的有用资源将被认为是不适当的(尽管我不知道，否则我可以在这里提出要求)，并且我的帖子可能会被关闭，因此我将添加一个更具体的问题:
当使用局部照明模型(例如，Phong反射模型)照亮对象时，我用JavaScript创建几何并将其与预先计算的法线一起传递到顶点着色器，然后将位置值和法线数据乘以相关矩阵，然后将结果传递给fragmenthader，在该处使用照明模型提供的算法计算每个像素的颜色。
但是，如果我要实现一个全局照明模型，它不能以这种方式工作，可以吗？我的意思是，这将需要将有关场景几何的所有信息整合到一个着色器中，所以我将只需要调用
gl.drawArrays( )或gl.drawElements( )一次，并将所有我想受到光照影响的东西都放入一个缓冲区中，对吗？对于我来说，这听起来既不像表演者，也不像是实际的解决方案，所以肯定有更好的方法可以将它们组合在一起，不是吗？现在，我该如何解决在JavaScript中独立定义几何但在GLSL中基于整个场景的顶点数据计算全局照明的问题？
感谢您的帮助!最后，请原谅我的英语不好。
编辑
PS:是的，我当然希望以一种更具体的方式提出问题，但实际上，具体是我在该主题上面临的主要问题... ;-)
但是，关于我的问题是如何独立定义场景的几何图形时如何计算全局照明，我认识到，在我尝试分析的许多着色器源中，几何图形似乎完全是在碎片着色器中创建的，只有一个简单的正方形从JavaScript传入。
但我认为，基本上具有整个场景，整个片段程序中定义的程序仅适用于非常简单的几何模型。因此，如果我继续用JavaScript定义几何，那么我必须在着色器之间交换哪些(实际)选项，以便可以实现一些全局照明算法？
最佳答案
在现实世界中，每个表面都会反射一部分入射到其上的光，并吸收另一部分。实际上很少有物体会发光，而正是这些物体正好使用点光源来模拟那些发光物体(灯泡==点光源，方向==太阳等)。游戏仅通过使用那些守时光源来描述照明并假设计算仅针对特定的一对光源和网格对就可以估算照明效果，这意味着一个网格仅关心其附近的光源，而实际上却忽略了其他物体在现场。为了解决其中一个对象实际影响另一对象上的照明的这种影响，渲染引擎使用创建阴影或近似颜色渗色(全局照明)的技术。
路径跟踪可以正确处理:阴影，颜色渗出，照明，焦散...这些不是单独的现象，它们都是由光子在场景中反弹并与 Material 相互作用而产生的。例如，环境光遮挡和阴影具有相同的效果:阴影变得越柔和，细微，它们就会变成环境光遮挡。渗色只是附近表面反射了太多光而使反射光的表面可以视为光源的一种效果。因此，所有效果都是可以互换的，并且都是光散射的结果。
游戏引擎无法承受如此大规模和如此详细的所有行为，这就是为什么它们将照明分为特定的，非常有区别的效果。因此，他们在本地照亮对象，然后计算阴影，然后尝试查找颜色渗出...然后他们独立地计算相机效果，例如光晕，运动模糊...所有这些效果和过程都被人为地分为不同的组，以进行实时处理和按其携带的信息量和类型划分。
实时渲染中完成的所有事情都是近似的，它们在本地进行的工作更多，因为计算机没有足够的计算能力来模拟全局范围内的所有效果。解决这些局限性的方法是预先计算或动态地进行处理，但要足够简单以使其成为实时的。例如，对于颜色渗出，我们可以使用大量的点光源对整个场景中的光传输进行预先计算，并通过使用大量的点光源来对其进行近似，这些点光源分别对应于放置该场景的特定体积的照明(此技术称为虚拟点光源)。
为了进行实时全局照明效果，并考虑到GPU的局限性，您需要近似并简化它们。因此，您最终将使用VPL或体素圆锥描迹或屏幕空间光子贴图，或预先过滤的局部立方体贴图，或任何其他可能适合您的技术。您以仍然可以在本地访问和使用的方式表示全局数据，从而使整个场景足够近似。因此，每个对象永远都不会了解整个场景(嗯，这就是路径跟踪的作用)，但是会提供一些表示局部全局照明的数据。
我希望这是有道理的，并且对您有所帮助。
编辑后:
您不能在着色器之间交换数据。您可以尝试对场景进行体素化，然后将获得的3D纹理传递给所有着色器。因此，所有着色器仍然彼此独立，但是它们设法通过使用代表整个世界的相同数据来计算全局效果。
关于javascript - WebGL中的高级照明，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31140423/