为什么我的three.js灯不起作用?

时间:2014-05-02 01:40:34

标签: javascript three.js light

我无法弄清楚这个小提琴中的错误(http://jsfiddle.net/resistdesign/s6npL/),根据文档和一些例子等,灯光应该正常工作。

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);

}

1 个答案:

答案 0 :(得分:3)

我似乎误解了PointLight()参数的含义。第三个参数是光强度实际上为零的距离。所以在init()

中添加这些行
light1 = new THREE.PointLight( 0xff0040, 1, 5000 );
light1.position.set( 500, 500, 500 );

同时从render()例程中删除light1.position的更新,直到确保它符合您的想法为止。