three.js弧度角度转换及更改模型方向

  • 弧度 = 角度 / 180 * Math.PI
  • 角度 = 弧度 * 180 / Math.PI
  • 角度 转 弧度 THREE.MathUtils.degToRad(deg)
  • 弧度 转 角度 THREE.MathUtils.radToDeg (rad)
  • π(弧度) = 180°(角度)

three.js中模型的rotation属性参数是弧度而不是角度,导致了模型增加弧度之后出现位置偏移问题

在three.js中切换方向发生模型位置大幅度偏移可以通过修改引入的3d模型的坐标来实现(建模工具里修改),确认问题可以在模型中添加自身的坐标系;

1. 四元数修改朝向

 // const axesHelper = new THREE.AxesHelper(10);
              // this.model.children[i].add(axesHelper)
            // //飞机初始姿态飞行方向a
            // const a = new THREE.Vector3(0, 0, -1);
            // // 飞机姿态绕自身坐标原点旋转到b指向的方向
            // const b = new THREE.Vector3(0, 0, 1).normalize();
            // // a旋转到b构成的四元数
            // const quaternion = new THREE.Quaternion();
            // //注意两个参数的顺序
            // quaternion.setFromUnitVectors(a, b);
            // // quaternion表示的是变化过程,在原来基础上乘以quaternion即可
            // this.model.children[i].quaternion.multiply(quaternion);

2.rotation修改朝向

// Car.scene.rotation.x = 0;
// Car.scene.rotation.y = 0;
// Car.scene.rotation.z = 0;

Car.scene即为model,也可以同时设置xyz修改朝向

 

posted @ 2023-09-27 15:25  妄欢  阅读(604)  评论(0编辑  收藏  举报