Question

我们在Blender中创建了一个模型，它使用布尔差分运算符从“平面”基础中减去一个拉伸的SVG。换句话说，我们在其中刻了一幅画。模型在Blender中渲染得很好，但是将它加载到我们简单的基于three.js的Web查看器中（使用Blender的json导出器），我们在表面上得到一些非常奇怪的阴影，并且根据比例，闪亮的顶点。

这是我的灯光和相机：

    camera = window.camera = new THREE.PerspectiveCamera(45, $('main').width() / $('main').height(), 10, 10000);

    loader = new THREE.JSONLoader(true);

    var light = new THREE.DirectionalLight(0xffffff, 1.0);
    light.position.set(-30, 30, 100);
    light.target.position.set(0, 0, 0);
    light.shadowCameraNear = 200;

有人能发现我们做错了吗？这是一个三个特定的问题，或WebGL，或Blender，还是我们的模型？

Output (screenshot) Fiddle

Answer 1

看着你的小提琴，你的vertexNormals似乎完全平滑，因此阴影是不正确的。看这里： https://github.com/mrdoob/three.js/issues/1258 这有帮助吗？

Answer 2

我不确定这在技术上是否算作解决方案，但是 - 通过删除JSON blender导出解决问题，并使用P3D代替直接加载.stl。

复杂模型的Three.js阴影看起来很奇怪

2 个答案: