创建自定义 Object3D class

Question

我是 THREE.js 的新手，来自 AS3/Away3D 背景。我正在尝试创建一个自定义对象 class，它扩展了 THREE.Object3D 以添加到我的场景中。 CustomObject 会封装很多行为属性和方法。理想情况下，我想向每个 CustomObject 传递它自己的数据对象，这将决定它将如何 look/move/behave。封装此代码将使我的 main.js 更加清晰。

我的问题是我似乎无法将 class 的实例直接添加到我的场景中。我只能通过 CustomObject.getMesh() 方法添加网格。是否可以将 class 的实例直接添加到我的场景中进行渲染？这是我根据我在网上和 /src:

中找到的内容所做的非常基本的尝试

function CustomObject(){

    THREE.Object3D.call( this );
    this.type = 'CustomObject';
    this.geometry = new THREE.BoxGeometry( 540, 540, 14 );
    this.mesh = new THREE.Mesh( this.geometry, new THREE.MeshLambertMaterial( { color: 0xff0000 } ) );
}

CustomObject.prototype = Object.create( THREE.Object3D.prototype );
CustomObject.prototype.constructor = THREE.Object3D;

CustomObject.prototype.getMesh = function(){

    return this.mesh;

}

我希望能够将 CustomObject class 直接添加到场景中，以使对象管理更加清晰。谁能告诉我这是如何实现的？

非常感谢！

大卫

Answer 1

如果您想直接将自定义对象添加到场景中，可以使用如下模式：

function CustomObject() {

    this.type = 'CustomObject';

    this.geometry = new THREE.BoxGeometry( 540, 540, 14 );
    this.material = new THREE.MeshLambertMaterial( { color: 0xff0000 } );

    THREE.Mesh.call( this, this.geometry, this.material );

}

CustomObject.prototype = Object.create( THREE.Mesh.prototype );
CustomObject.prototype.constructor = CustomObject;

CustomObject.prototype.getMesh = function() {

    return this.mesh;

}

var foo = new CustomObject();
scene.add( foo );

three.js r.71

创建自定义 Object3D class

Creating custom Object3D class

javascript

class

extend

three.js