【问题标题】:THREE.OBJLoader cast a shadow?THREE.OBJLoader 投下阴影?
【发布时间】:2018-02-12 22:30:53
【问题描述】:

我正在尝试使对象投射并接收阴影,

场景THREE.SpotLight中有一个光源

这是我的 MTLLoader() 和 OBJLoader() 代码

        var mtlLoader = new THREE.MTLLoader();
        mtlLoader.setBaseUrl('assets/');
        mtlLoader.setPath('assets/');
        mtlLoader.load('komoda.mtl', function (materials) {
            materials.preload();
             materials.materials.lambert2SG.map.magFilter = THREE.NearestFilter;
             materials.materials.lambert2SG.map.minFilter = THREE.LinearFilter;

             materials.materials.lambert3SG.map.magFilter = THREE.NearestFilter;
             materials.materials.lambert3SG.map.minFilter = THREE.LinearFilter;

            var objLoader = new THREE.OBJLoader();
            objLoader.setMaterials(materials);
            objLoader.setPath('assets/');
            objLoader.load('komoda.obj', function (object) {
                object.castShadow = true;
                object.receiveShadow = true;
                scene.add(object);
            });
        });

完整的js代码:https://a3d.joladev2.com/webgl2/webgl-attempt.js

这里是在线示例:https://a3d.joladev2.com/webgl2/index.html

谢谢

编辑:我添加了 jsfiddle,但无法在 jsfiddle 上加载材料

https://jsfiddle.net/fcb9qoco/23/

谢谢

编辑 2:已解决 - 有 2 个问题,一个是 spotLight.shadow.camera.near = 500;

正确的值是10,所以spotLight.shadow.camera.near = 10;

谢谢@gaitat

第二个是平面对象没有receiveShadow = true;

现在有了,谢谢@Jim Tang

【问题讨论】:

标签: javascript three.js


【解决方案1】:

在线示例无法在我的 chrome 上运行,所以我无法判断,但在我的“Three.js Inspector”调试选项卡中显示了层次结构:

Scene
 +- SpotLight
 +- Group
  |- plane  <-- check this Mesh object receiveShadow property
  |- komoda

【讨论】:

  • 谢谢,但是当我设置 receiveShadow = true;在飞机上我收到警告请参阅屏幕截图ibb.co/m1u9MS,请尝试再次打开演示
  • @Avi 抱歉,我的three.js库中找不到这个错误,我的版本是89,你的是76,最好使用最新的release版本。
  • 这有 2 个问题,所以 receiveShadow = true;在飞机上这是你的答案,另一个是 spotLight.shadow.camera.near = 500;正确的是 spotLight.shadow.camera.near = 10;非常感谢
  • @Avi 对!因此,摄像机下方的聚光灯会切断场景对象...您可以在此摄像机上使用 CameraHelper 进行调试。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2021-04-29
  • 2012-06-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-01-24
相关资源
最近更新 更多