three.js 自转与公转

2023-08-14  本文已影响0人  alue

如图所示,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 旋转, 这样就能够实现自转了.

上一篇 下一篇

猜你喜欢

热点阅读