Javascript 为什么我的three.js lighting不工作？

根据文档和一些示例等，我不知道这个fiddle（）有什么问题，灯应该是工作的

var camera, scene, renderer, geometry, material, mesh, light1;

init();
animate();

function init() {

    scene = new THREE.Scene();

    camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
    camera.position.z = 500;
    scene.add(camera);

    geometry = new THREE.CubeGeometry(200, 200, 200);
    material = new THREE.MeshPhongMaterial( { ambient: 0x555555, color: 0x555555, specular: 0xffffff, shininess: 50, shading: THREE.SmoothShading } );

    mesh = new THREE.Mesh(geometry, material);
    scene.add(mesh);

    scene.add( new THREE.AmbientLight( 0x000000 ) );

    light1 = new THREE.PointLight( 0xff0040, 2, 50 );
    scene.add( light1 );

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

    document.body.appendChild(renderer.domElement);

}

function animate() {

    requestAnimationFrame(animate);
    render();

}

function render() {

    var time = Date.now() * 0.0005;

    mesh.rotation.x += 0.01;
    mesh.rotation.y += 0.02;

    light1.position.x = Math.sin( time * 0.7 ) * 30;
    light1.position.y = Math.cos( time * 0.5 ) * 40;
    light1.position.z = Math.cos( time * 0.3 ) * 30;

    renderer.render(scene, camera);

}

---

我觉得您误解了PointLight（）参数的含义。第三个参数是光的强度实际上为零的距离。因此，将这些行添加到

init（）

中：

另外，从

render（）

例程中删除light1.position的更新，直到确保它符合您的想法为止

light1 = new THREE.PointLight( 0xff0040, 1, 5000 );
light1.position.set( 500, 500, 500 );