javascript - 如何将相机设置在网格后面

Question

我在 Blender 中创建了一个城市和一个 Angular 色，并在脚本中导入了这两个 JSON 对象。我想在城市中移动我的 Angular 色，并将这个 Angular 色置于屏幕的中心。现在我的问题是我的 Angular 色位于屏幕的右侧而不是中心。有人知道如何用相机将我的 Angular 色设置在屏幕中央吗？

这是我的屏幕图片。

    var scene, renderer, camera, lua;
    var keyboard = new THREEx.KeyboardState();
    var clock = new THREE.Clock();
    scene = new THREE.Scene();
    camera = new THREE.PerspectiveCamera(90,window.innerWidth/window.innerHeight,0.1,50000);
    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    renderer.setClearColor (0xffffff, 1);
    document.body.appendChild(renderer.domElement);
    var loader = new THREE.JSONLoader();
    loader.load("city.json", function(geomtry , materials){
        var material = new THREE.MeshFaceMaterial(materials);
        var city = new THREE.Mesh(geomtry,material);
        scene.add(city);
    })
    //my character
    loader.load("lua2.json", function (geometry, materials){
        var m = THREE.MeshFaceMaterial(materials);
        lua = new THREE.Mesh(geometry,m);
        //lua.position.set(0,3,0);
        lua.position.set(0,2,0);
        scene.add(lua);
    })
    camera.lookAt(scene);
        var light = new THREE.PointLight();
        //light.position.set(-100,200,100);
        light.position.set(0,500,0);
        scene.add(light);

        var render = function () {
            requestAnimationFrame( render );
            renderer.render(scene, camera);
            update(); 
        };

        function update()
        {
            var delta = clock.getDelta();
            var moveDistance = 5 * delta; 
            var rotateAngle = Math.PI / 2 * delta;     
            // local transformations
            // move forwards/backwards/left/right
            if ( keyboard.pressed("S") )
                lua.translateZ( -moveDistance );
            if ( keyboard.pressed("Z") )
                lua.translateZ(  moveDistance );
            if ( keyboard.pressed("D") )
                lua.translateX( -moveDistance );
            if ( keyboard.pressed("Q") )
                lua.translateX(  moveDistance );
            // rotate left/right/up/down
            var rotation_matrix = new THREE.Matrix4().identity();
            if ( keyboard.pressed("Y") )
                lua.rotateOnAxis( new THREE.Vector3(0,1,0), rotateAngle);
            if ( keyboard.pressed("B") )
                lua.rotateOnAxis( new THREE.Vector3(0,1,0), -rotateAngle);
            if ( keyboard.pressed("G") )
                lua.rotateOnAxis( new THREE.Vector3(1,0,0), rotateAngle);
            if ( keyboard.pressed("H") )
                lua.rotateOnAxis( new THREE.Vector3(1,0,0), -rotateAngle);    

            var relativeCameraOffset = new THREE.Vector3(0,0,0);
            var cameraOffset = relativeCameraOffset.applyMatrix4( lua.matrixWorld );
            camera = new THREE.PerspectiveCamera(45,window.innerWidth/window.innerHeight,0.5,50000);
            camera.position.x = lua.position.x;
            camera.position.y = lua.position.y+1;
            camera.position.z = lua.position.z-2;
            //camera.position.x = cameraOffset.x;
            //camera.position.y = cameraOffset.y;
            //camera.position.z = cameraOffset.z;
            camera.lookAt( lua.position );
        }
        render();

Answer 1

您可以更改相机位置和旋转

camera.position.x=100
camera.rotation.x=Math.PI