threejs 源码解析_Three.js源码阅读笔记(Object3D类)

这是Three.js源码阅读笔记的第二篇，直接开始。

Core::Object3D

Object3D似乎是Three.js框架中最重要的类，相当一部分其他的类都是继承自Object3D类，比如场景类、几何形体类、相机类、光照类等等：他们都是3D空间中的对象，所以称为Object3D类。Object3D构造函数如下：

THREE.Object3D = function () {

THREE.Object3DLibrary.push( this );

this.id = THREE.Object3DIdCount ++;

this.name = '';

this.properties = {};

this.parent = undefined;

this.children = [];

this.up = new THREE.Vector3( 0, 1, 0 );

this.position = new THREE.Vector3();

this.rotation = new THREE.Vector3();

this.eulerOrder = THREE.Object3D.defaultEulerOrder;

this.scale = new THREE.Vector3( 1, 1, 1 );

this.renderDepth = null;

this.rotationAutoUpdate = true;

this.matrix = new THREE.Matrix4();

this.matrixWorld = new THREE.Matrix4();

this.matrixRotationWorld = new THREE.Matrix4();

this.matrixAutoUpdate = true;

this.matrixWorldNeedsUpdate = true;

this.quaternion = new THREE.Quaternion();

this.useQuaternion = false;

this.boundRadius = 0.0;

this.boundRadiusScale = 1.0;

this.visible = true;

this.castShadow = false;

this.receiveShadow = false;

this.frustumCulled = true;

this._vector = new THREE.Vector3();

};

在介绍函数之前，需要先介绍一下这个类的几个重要属性。

属性parent和children说明，通常需要使用树来管理众多Object3D对象。比如一辆行驶的汽车是一个Object3D对象，控制汽车行驶路线的逻辑在该对象内部实现，汽车的每个顶点经过模型矩阵的处理后，都位于正确的位置；但是汽车摆动的雨刮器，其不但随着汽车行驶方向运动，而且自身相对汽车也在左右摆动，这个摆动的逻辑无法在汽车这个对象内部的实现。解决的方法是，将雨刮器设定为汽车的chidren，雨刮器内部的逻辑只负责其相对于汽车的摆动。在这种树状结构下，一个场景Scene实际上就是最顶端的Object3D，它的模型矩阵就是视图矩阵(取决于相机)的逆矩阵。

属性matrix和matrixWorld就很好理解了，matrix表示本地的模型矩阵，仅仅表示该对象的运动，而matrixWorld则需要依次向父亲节点迭代，每一次迭代都左乘父亲对象的本地模型矩阵，直到Scene对象——当然，实际上是左乘父亲对象的全局模型矩阵。

属性position、rotation、scale表示模型矩阵的三种变换部分，在Matrix4类中有相关说明。rotation和eulerOrder共同描述了一个