THREE.js - 未捕获的TypeError

时间:2015-10-06 00:31:13

标签: javascript three.js

我正在学习使用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);

});

1 个答案:

答案 0 :(得分:13)

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

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

new运算符是一个大问题,没有THREE.Mesh不再是构造函数而是普通函数。这导致函数内部的this引用THREE命名空间对象本身,而不是新创建的Mesh对象。 THREE命名空间对象没有updateMorphTarget()方法,因此出错。