0

我对three.js 相当陌生。我使用 r55 将一些东西放在一起并想添加灯光。我一直在尝试根据 Mrdoob 的文档添加 DirectionalLight - 运气不好......我尝试添加的灯光没有显示 - 添加了 shadowCameraVisible 用于调试，但它不会显示......任何人都知道什么我的代码可能有问题？？？我很感激任何意见！

function init() {
    container = document.createElement('div');
    document.body.appendChild(container);

    scene = new THREE.Scene();
    camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);

    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    container.appendChild(renderer.domElement);

    //CUBE
    var material = new THREE.MeshBasicMaterial({
        color: 0xff0000
    });
    var geometry = new THREE.CubeGeometry(x, y, z);
    cube = new THREE.Mesh(geometry, material);
    cube.position.z = z / 2;
    scene.add(cube);

    //FLOOR
    //floor color:
    var floorMaterial = new THREE.MeshBasicMaterial({
        color: 0xcccccc
    });
    //floor size:
    var floorGeometry = new THREE.PlaneGeometry(20, 20, 1, 1);
    var floor = new THREE.Mesh(floorGeometry, floorMaterial);
    floor.position.y = -0.5;
    floor.doubleSided = true;
    scene.add(floor);

    //LIGHTS
    var dLight = new THREE.DirectionalLight(0xffffff);
    dLight.position.set = (0, 0, 1);
    dLight.shadowCameraVisible = true;
    dLight.shadowCameraNear = 1;
    dLight.shadowCameraFar = 150;
    dLight.castshadow = true;
    scene.add(dLight);

    //CAMERA POSITION
    camera.position.z = 50;
    controls = new THREE.TrackballControls(camera);

    renderer.shadowMapEnabled = true;
    renderer.shadowMapType = THREE.PCFShadowMap;

}
4

4 回答 4

1 
dLight.position.set = (0,0,1);

哎呀，这看起来不对...运行后，灯光位置将不是 3D 矢量，它将NaN从对灯光位置进行的任何数学运算中生成。

dLight.position.set(0,0,1);
// or
dLight.position = new THREE.Vector3(0,0,1);
于 2013-02-11T18:22:55.363 回答
1

你设置的光

light.position.set (0,0,1);

但我认为你的光在几何内部。看看http://jsfiddle.net/aSt8c/。它有一个带阴影的工作定向光。

于 2013-02-11T20:37:09.453 回答
0

关键是，您的对象的材质必须是 MeshLambertMaterial 或 MeshPhongMaterial。其他材料不能反射光线。

//CUBE var material = new THREE.MeshPhongMaterial({ color: 0xff0000 }); OR var material = new THREE.MeshLambertMaterial({ color: 0xff0000 });

MeshPhongMaterial 可用于闪亮，MeshLambertMaterial 可用于非闪亮（朗伯）表面。

于 2014-07-08T17:22:09.297 回答
0

你需要设置这个： floor.receiveShadow = true;

于 2019-12-06T02:52:21.263 回答