THREE.js - 未捕获的TypeError

Question

我刚学会使用Web GL和THREE.js

我在YouTube上关注了一个教程,结果得到了以下代码.此代码应显示多维数据集和轴.但是,当我尝试显示包含此代码的页面时,我收到Javascript错误.错误说明:

未捕获的TypeError:this.updateMorphTargets不是函数

我不确定我做错了什么,但希望有一个熟悉THREE.js的人可以帮助我.非常感谢你的时间.

jQuery(document).ready( function($){

    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight,.1, 500);
    var renderer = new THREE.WebGLRenderer();

    renderer.setClearColor(0x000000);
    renderer.setSize(window.innerWidth, window.innerHeight);

    var axis = new THREE.AxisHelper(10);

    scene.add(axis);

    var cubeGeometry = new THREE.BoxGeometry(5, 5, 5);
    var cubeMaterial = new THREE.MeshBasicMaterial({color: 0xdddddd, wireframe:true});
    var cube = THREE.Mesh(cubeGeometry, cubeMaterial);

    cube.position.x = 0;
    cube.position.y = 0;
    cube.position.z = 0;

    scene.add(cube);

    camera.position.x = 40;
    camera.position.y = 40;
    camera.position.z = 40;

    camera.lookAt(scene.position);

    $('#webgl-container').append(renderer.domElement);
    renderer.render(scene, camera);

});

Answer 1

你做了一个简单的拼写错误,new之前忘记了操作符Three.MESH,所以它应该是:

var cube = new THREE.Mesh(cubeGeometry, cubeMaterial);

该new运营商是一个大问题,没有它THREE.Mesh不再是一个构造函数,但一个普通的功能.这导致this函数内部引用THREE命名空间对象本身,而不是新创建的Mesh对象.该THREE命名空间对象不具有updateMorphTarget()方法,因此错误.