1. threejs源码阅读——math/vector

Math概述

math文件夹中有许多类,定义了一些常用的数据类型,如向量、矩阵、四元数;一些基本的几何形状,如线、三角形、片、球、柱;还有就是一些常用的方法,如clamp、各种插值等。


math文件夹结构

math文件夹内的所有内容都是我们在threejs中非常常用的,尤其是向量、矩阵、四元数和一些基本的数学运算。所以我们第一个选择math文件夹来进行解读。

Vector

在三维世界中,vector可以说是最重要的一环了,我们会用到大量的向量计算。在不同的引擎中, vector存储和计算的方式会分为行向量和列向量,那你知道在threejs中是哪种吗?这两种又有什么区别呢?

vector接口

vector2.d.ts中,定义了Vector接口,Vector2、Vector3和Vector4类都会实现这个接口。Vector接口声明了一些通用的、跟向量相关的计算,比如加减:


向量加减相关方法


考虑到Vector2/3/4都会实现这个接口,所以某些向量计算方法可能不会出现在此接口声明中,而会出现在各自的类声明中。比如cross叉乘,在Vector4中就没有用到,但是dot点乘是所有向量都有的方法。

以三维向量加法为例,这里有两个向量相加的方法,且调用任何一种都会直接修改对象本身的值而不是返回一个新的对象。

threejs中的三维向量加法

如果我们想要原地修改某个向量,可以用add;如果我们要计算2个向量相加的结果并且不改变这2个向量,可以用addVectors

Vector3.prototype.add
Vector3.prototype.addVectors

类似情况的方法有很多,使用的时候需要注意防止在无意中修改了调用对象的值。

接口中也提供了clone和copy方法,用于深拷贝Vector对象。这两个方法我们也会经常用到,比如保存场景中某个物体的默认位置信息以便于将来的一些计算。

Vector3.prototype.clone

Vector2/3

vector2/3相对来说比较简单,用于表示二/三维空间中的一个向量或者一个点。Vector2中的x和y还有别名,分别是width和height,方便理解。Vector3是我们最最常用的一种向量了,该类也提供了大量的矩阵变换方法,我们将在Matrix一章中提到。

Vector4

vector4由x、y、z、w组成,其中w默认值为1。在threejs中,vector3和vector4都提供了与矩阵进行计算的方法,vector4还额外提供了可以和四元数相互转换的方法,用Vector4我们可以同时储存四元数的旋转轴和旋转角。

注意,虽然四元数和四维向量都是由4个数字组成,但他们是两回事!在threejs中Vector4和Quaternion可以通过方法互相转换,但是元素的值会发生改变。

总结

threejs中总共定义了3种类型的向量,分别是Vector2Vector3Vector4,他们都实现了Vector接口,而Vector接口中声明了一些通用的方法。

无论是哪种Vector类型,只要方法返回的是一个同类型的对象,都是原地修改对象中的元素值(xyzw)。

如果要备份或复制Vector,可以使用clone()方法,而不能直接用=赋值。

你可能感兴趣的:(1. threejs源码阅读——math/vector)