在体素地形上点亮/投射阴影的有效方法

Question

我正在使用 BufferGeometry 和一些预定义的数据来创建一个类似于 Minecraft 块的对象（由体素组成并包含类似洞穴的结构）。我无法有效地点亮此对象。

目前我正在使用MeshLambertMaterial 和DirectionalLight，这使我能够在没有光线的情况下在体素上投射阴影，但是这对于大地形使用效率不高，因为它需要非常大的阴影贴图，因此通常会导致出现故障的阴影伪影。

这是我用来将索引和顶点添加到 BufferGeometry 的代码：

// Add indices to BufferGeometry
for ( var i = 0; i < section.indices.length; i ++ ) {
    var j = i * 3;
    var q = section.indices[i];

    indices[ j ]     = q[0] % chunkSize;
    indices[ j + 1 ] = q[1] % chunkSize;
    indices[ j + 2 ] = q[2] % chunkSize;
}

// Add vertices to BufferGeometry
for ( var i = 0; i < section.vertices.length; i ++ ) {
    var q = section.vertices[i];

    // There's 1 color for every 4 vertices (square)
    var hexColor = section.colors[i / 4];

    addVertex( i, q[0], q[1], q[2], hexColor );
}

还有我的“块”示例： http://jsfiddle.net/9sSyz/4/

截图：

如果我要从示例中移除阴影，则正确一侧的所有体素都会被点亮，即使另一个体素挡住了光线。我只需要另一种可扩展的方式来产生阴影的错觉。如果不考虑光线，也许通过改变顶点颜色？它不必像当前的阴影实现那样准确，因此更改顶点颜色（以提供块状顶点绑定阴影）就足够了。

不胜感激任何帮助或建议。谢谢。

Answer 1

一般来说，如果你有大地形，想法是将场景分割成更多级联，每个级联都有自己的阴影贴图。技术称为CSM - 级联阴影贴图。问题是，我还没有听说过实现这种技术的 webGL 示例。 CSM 用于动态场景。但我不确定用 Three.js 实现这一点有多容易。

第二个选项是添加环境光遮蔽，正如 WestLagnley 所建议的那样，但这只是一种遮蔽，而不是阴影。结果大相径庭。

第三种选择，如果您的场景大部分是静态的 - 烘焙阴影。因此，您只需将预处理纹理应用于地形等。为了支持动态对象，只需渲染它们的阴影贴图并将其应用于一些仅模仿阴影区域的几何体（也许，一个稍微悬停在地面上方并接收阴影等的平面） .

上述技术的任意组合也是一种选择。

附：您能否也提供一个屏幕截图，小提琴无法加载。