如图所示,three.js中导入的模型距离坐标轴原点有偏移.
image.png
这时候做旋转动画会比较麻烦. 本来是想让机箱自转, 结果却是机箱绕着原点公转.
这种情况下, 最好在模型导入的时候,就按下述方式修正位置参数:
loader.load('models/主机.fbx', (obj: THREE.Group) => {
// 修正原点
const box = new THREE.Box3().setFromObject(obj)
box.getCenter(obj.position)
obj.position.multiplyScalar(-1)
// 新建一个组对象
const group = new THREE.Group()
world.scene.add(group)
group.add(obj)
})
这里要注意的是,需要新建一个组group , 然后将修正位置之后的模型加入该组. 旋转的时候, 针对group 旋转, 这样就能够实现自转了.
网友评论