小编wag*_*eld的帖子

改进了WebGL和ThreeJS中的区域照明

我一直在研究WebGL中的区域照明实现,类似于这个演示:

http://threejs.org/examples/webgldeferred_arealights.html

以上在three.js中的实现是从gamedev.net上的ArKano22的工作中移植出来的:

http://www.gamedev.net/topic/552315-glsl-area-light-implementation/

虽然这些解决方案非常令人印象深刻,但它们都有一些局限性.ArKano22最初实现的主要问题是漫反射项的计算不考虑曲面法线.

几个星期以来,我一直在增加这个解决方案,使用redPlant的改进来解决这个问题.目前我将正常的计算结合到解决方案中,但结果也存在缺陷.

以下是我当前实施的预览:

区域照明预告片

介绍

计算每个片段的扩散项的步骤如下:

  1. 将顶点投影到区域光所在的平面上,以使投影向量与光的法线/方向一致.
  2. 通过将投影矢量与光线法线进行比较,检查顶点是否位于区域光平面的正确一侧.
  3. 从光的中心/位置计算该投影点在平面上的2D偏移.
  4. 夹住此2D偏移矢量,使其位于灯光区域内(由其宽度和高度定义).
  5. 导出投影和夹紧2D点的3D世界位置.这是区域光到顶点的最近点.
  6. 通过获取顶点到最近点矢量(标准化)和顶点法线之间的点积来执行通常的点光计算.

问题

该解决方案的问题在于,照明计算是从最近的点完成的,并且不考虑光表面上可能照亮片段的其他点.让我试着解释一下为什么......

请考虑以下图表:

有问题的区域照明情况

区域光线垂直于表面并与之相交.表面上的每个碎片将始终返回表面和光相交的区域光上的最近点.由于曲面法线和顶点到光线矢量总是垂直的,因此它们之间的点积为零.随后,尽管在表面上隐藏着大面积的光,但漫射贡献的计算为零.

潜在解决方案

I propose that rather than calculate the light from the nearest point on the area light, we calculate it from a point on the area light that yields the greatest dot product between the vertex-to-light vector (normalised) and the vertex normal. In the diagram above, this would be the purple dot, rather than the …

math 3d lighting webgl three.js

59
推荐指数
1
解决办法
9600
查看次数

TypeScript 3的通用咖喱功能

TypeScript 3.0引入了通用的rest参数.

到目前为止,curry函数必须在TypeScript中注释,其中包含有限数量的函数重载和一系列条件语句,用于查询实现中传递的参数的数量.

我希望通用的rest参数最终提供实现完全通用解决方案所需的机制.

我想知道如何使用这种新的语言功能来编写通用curry函数...假设它当然可能!

使用rest params的JS实现,我在hackernoon上找到解决方案中稍微修改了一下,看起来像这样:

function curry(fn) {
  return (...args) => {
    if (args.length === 0) {
      throw new Error("Empty invocation")
    } else if (args.length < fn.length) {
      return curry(fn.bind(null, ...args))
    } else {
      return fn(...args)
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

使用泛型休息参数和函数重载,我curry在TypeScript 中注释此函数的尝试如下所示:

interface CurriedFunction<T extends any[], R> {
  (...args: T): void // Function that throws error when zero args are passed
  (...args: T): CurriedFunction<T, R> …
Run Code Online (Sandbox Code Playgroud)

generics currying typescript

10
推荐指数
2
解决办法
1833
查看次数

标签 统计

3d ×1

currying ×1

generics ×1

lighting ×1

math ×1

three.js ×1

typescript ×1

webgl ×1