1

我在三个.js 中初始化相机位置有小问题。我用打字稿写了这个项目。浏览器控制台返回我： Uncaught TypeError: Cannot read property 'position' of undefined 。这是我在 app.ts 文件中的源代码：

///<reference path="Lib/three.d.ts">
class Rendering {
    camera: THREE.PerspectiveCamera;
    scene: THREE.Scene;
    renderer: THREE.CanvasRenderer;
    windowHalfX: number;
    windowHalfY: number;

    constructor() {
        this.windowHalfY = window.innerHeight/2;
        this.windowHalfX = window.innerWidth / 2;
    }

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

        this.camera = new THREE.PerspectiveCamera(60, this.windowHalfX / this.windowHalfY, 1, 1000);
        this.camera.position.y = 100; // HERE CONSOLE CANNOT READ POSITION PROPERTY
        this.camera.position.z = 200;
        this.scene = new THREE.Scene();
        this.renderer = new THREE.CanvasRenderer();
        this.renderer.setSize(this.windowHalfX*2, this.windowHalfY*2);
        container.appendChild(this.renderer.domElement);
        var cubeGeometry = new THREE.CubeGeometry(150, 150, 150);
        for (var i = 0; i < cubeGeometry.faces.length; i += 2) {

            var hex = Math.random() * 0xffffff;
            cubeGeometry.faces[i].color.setHex(hex);
            cubeGeometry.faces[i + 1].color.setHex(hex);

        }
        var material = new THREE.MeshBasicMaterial({ vertexColors: THREE.FaceColors, overdraw: 0.5 });
        var cube = new THREE.Mesh(cubeGeometry, material);
        cube.position.y = 150;
        this.scene.add(cube);
    }
    public render() {
        this.camera.lookAt(this.scene.position);
        this.renderer.render(this.scene, this.camera);
    }
}

知道如何解决此错误吗？

4

1 回答 1

3

此错误的主要原因是您没有可用的 PerspectiveCamera JavaScript...

如果您下载了 Three.JS zip 文件并包含在内three.js- 这并不是您网页上需要的所有内容。

最好的办法是使用压缩后的 three.js 文件，您可以在此处找到：

http://threejs.org/build/three.min.js

这将您需要的所有单个组件捆绑在一个缩小的脚本中，包括您的 PerspectiveCamera。

于 2013-11-01T14:49:25.793 回答