Question

<html>
    <head>
        ...
    </head>
    <body>
        <script src="three.min.js"></script>
        <script>
            var scene = new THREE.Scene();
            var camera = new THREE.PerspectiveCamera( 75, window.innerWidth/window.innerHeight, 0.1, 1000 );

            var renderer = new THREE.WebGLRenderer();
            renderer.setSize( 600, 400 );
            document.body.appendChild( renderer.domElement );

            var geometry = new THREE.BoxGeometry( 2, 2, 2 );

            var material = new THREE.MeshLambertMaterial( { color: 0xffffff } );
            var material2 = new THREE.MeshLambertMaterial( { color: 0xff007b } );

            var cube = new THREE.Mesh( geometry, material );
            var cube2 = new THREE.Mesh( geometry, material2 );

            cube.position.set(0, 0, 0);
            cube2.position.set(-3, 0, 0);

            scene.add( cube );
            scene.add( cube2 );

            var render = function () {
                requestAnimationFrame( render );
                var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
                directionalLight.position.set( -3, 3, 3 );
                scene.add( directionalLight );
                var timer = Date.now() * 0.001;
                camera.position.x = Math.cos( timer ) * 10;
                camera.position.z = Math.sin( timer ) * 10;
                camera.lookAt( scene.position );
                renderer.render(scene, camera);
            };

            render();
        </script>
    </body>
</html>

我正在创建立方体，我希望它们在一个圆圈中移动，所以我将整个场景移动到一个圆圈但是我对光线有困难因为我认为它也会随着场景移动而当我们看到后面的立方体，没有光。我是第一次使用这个库，所以我甚至不确定我应该使用directionalLight，但我希望最接近观察者的立方体能够点亮，并且当它们从观察者移动时变得更暗。也许光线应该是静态的，我不应该移动相机，但我不知道如何在不移动每个立方体的情况下完成它。

Answer 1

首先，旋转整个场景是一个坏主意。所有现场的孩子都很难想象未来的工作。

创建var space = new Object3D(); scene.add(space); space.add(your_cubes);

和旋转 space对象而不是scene。将light添加到scene并将space设置为light.target。

light.target = space;

用移动相机照亮一个场景

1 个答案: