一、世界坐标 .getWorldPosition()
可以直接访问模型的位置属性
.position
获得模型在本地坐标系或者说模型坐标系下的三维坐标, 通过模型的.getWorldPosition()
方法获得该模型在世界坐标下的三维坐标。
1. .getWorldPosition()
方法
- 模型对象的方法
.getWorldPosition()
方法和位置属性.position
一样继承自基类Object3D
。javascript// 声明一个三维向量用来保存世界坐标 const worldPosition = new THREE.Vector3(); // 执行getWorldPosition方法把模型的世界坐标保存到参数worldPosition中 mesh.getWorldPosition(worldPosition);
2. 建立世界坐标系概念
- 通过位置属性
.position
和.getWorldPosition()
分别返回模型的本地位置坐标和世界坐标, 查看两个坐标x
分量有什么不同。可以看到网格模型mesh
通过位置属性.position
返回的坐标x
分量是50
, 通过.getWorldPosition()
返回的坐标x分量是10
0,也就是说mes
h的世界坐标是mesh
位置属性.position
和mesh
父对象group
位置属性.position
的累加。javascriptconst mesh = new THREE.Mesh(geometry, material); // mesh的本地坐标设置为(50, 0, 0) mesh.position.set(50, 0, 0); var group = new THREE.Group(); // group本地坐标设置和mesh一样设置为(50, 0, 0) // mesh父对象设置position会影响得到mesh的世界坐标 group.position.set(50, 0, 0); group.add(mesh); scene.add(group); // .position属性获得本地坐标 console.log('本地坐标',mesh.position); // getWorldPosition()方法获得世界坐标 //该语句默认在threejs渲染的过程中执行,如果渲染之前想获得世界矩阵属性、世界位置属性等属性,需要通过代码更新 scene.updateMatrixWorld(true); const worldPosition = new THREE.Vector3(); mesh.getWorldPosition(worldPosition); console.log('世界坐标',worldPosition);
- 总结:
- 所谓本地坐标系或者说模型坐标系,就是模型对象相对模型的父对象而言,模型位置属性
.position
表示的坐标值就是以本地坐标系为参考, 表示子对象相对本地坐标系原点(0,0,0)
的偏移量。 three.ts
场景Scene
是一个树结构,一个模型对象可能有多个父对象节点。世界坐标系默认就是对three.ts
整个场景Scene
建立一个坐标系,一个模型相对世界坐标系的坐标值就是该模型对象所有父对象以及模型本身位置属性.position
的叠加。
- 所谓本地坐标系或者说模型坐标系,就是模型对象相对模型的父对象而言,模型位置属性
3. 本地缩放系数.scale
- 模型的位置属性
.position
可以称为本地坐标或者说局部坐标,对于属性.scale
一样,可以称为模型的本地缩放系数或者局部的缩放系数, 通过.getWorldScale()
方法可以获得一个模型的世界缩放系数,就像执行.getWorldPosition()
方法一样获得世界坐标, 关于.getWorldScale()
方法可以查看基类Object3D
。
4. 本地矩阵.materix
和世界矩阵.matrixWorld
- 本地矩阵
.materix
是以本地坐标系为参考的模型矩阵,世界矩阵.matrixWorld
自然就是以是世界坐标系为参照的模型矩阵。 three.ts
本地矩阵是three.ts
模型的位置属性.position
、缩放系数属性.scale
和角度属性.rotation
记录了模型的 所有平移、缩放和旋转变换,本地矩阵.materix
是以线性代数矩阵的形式表示.position
、.scale
和.rotation
。 世界矩阵.matrixWorld
自然是用矩阵的形式表示模型以及模型父对象的所有旋转缩放平移变换。