飞机倾斜（Banking）运动对俯仰、偏航的影响及欧拉角转换咨询

问题描述 #

正在对飞机转弯动作建模，重点实现倾斜（Banking）动作：希望俯仰（Pitch）动作能根据滚转（Roll）角度改变实际的俯仰和偏航（Yaw）状态——比如无滚转时，俯仰只改变抬头/低头；有滚转时，俯仰会同时抬头+向侧方偏转。目前用矩阵变换但变换顺序导致俯仰、偏航和滚转相互独立，尝试了欧拉角分解的代码但效果不对，想知道是否有初等公式可以实现，或是需要换矩阵变换方案。

尝试的代码：

if (keys["arrowleft"]) {
  plane.roll -= 0.1;
}
if (keys["arrowright"]) {
  plane.roll += 0.1;
}
if (keys["arrowup"]) {
  plane.pitch -= 0.1*Math.cos(plane.roll);
  plane.yaw -= 0.1*Math.sin(plane.roll);
}
if (keys["arrowdown"]) {
  plane.pitch -= 0.1*Math.cos(plane.roll);
  plane.yaw -= 0.1*Math.sin(plane.roll);
}

解决方案 #

方案一：修正欧拉角更新逻辑（初等公式方式） #

你的核心思路是对的——滚转后，机体坐标系下的俯仰动作需要分解到世界坐标系的欧拉角，但代码有两个问题：上下箭头的处理完全相同（方向应该相反），以及符号可能需要根据坐标系定义调整。

修正后的代码示例（假设坐标系定义：Roll右侧倾为正，Pitch减小为抬头）：

if (keys["arrowleft"]) {
  plane.roll -= 0.1;
}
if (keys["arrowright"]) {
  plane.roll += 0.1;
}
// 抬头动作：机体俯仰轴的动作分解为世界坐标系的Pitch和Yaw
if (keys["arrowup"]) {
  const deltaBodyPitch = -0.1; // 机体抬头的增量
  plane.pitch += deltaBodyPitch * Math.cos(plane.roll);
  plane.yaw += deltaBodyPitch * Math.sin(plane.roll);
}
// 低头动作：方向与抬头相反
if (keys["arrowdown"]) {
  const deltaBodyPitch = 0.1; // 机体低头的增量
  plane.pitch += deltaBodyPitch * Math.cos(plane.roll);
  plane.yaw += deltaBodyPitch * Math.sin(plane.roll);
}

但这种方式存在欧拉角的固有缺陷：万向锁（当Roll接近90°时，俯仰动作会完全转化为偏航），且多次旋转后误差会累积，只适合简单场景。

方案二：改用四元数/旋转矩阵维护姿态（长期可靠方案） #

欧拉角的顺序依赖和万向锁问题很难彻底解决，更专业的方式是用四元数或旋转矩阵存储飞机姿态，所有旋转操作都在机体坐标系下进行，自然就能实现滚转后俯仰带动偏航的效果，且无万向锁、误差小。

四元数实现的伪代码示例：

// 工具函数：四元数乘法
function quatMultiply(q1, q2) {
  return {
    w: q1.w*q2.w - q1.x*q2.x - q1.y*q2.y - q1.z*q2.z,
    x: q1.w*q2.x + q1.x*q2.w + q1.y*q2.z - q1.z*q2.y,
    y: q1.w*q2.y - q1.x*q2.z + q1.y*q2.w + q1.z*q2.x,
    z: q1.w*q2.z + q1.x*q2.y - q1.y*q2.x + q1.z*q2.w
  };
}

// 工具函数：绕指定轴生成旋转四元数
function quatFromAxisAngle(axis, angle) {
  const halfAngle = angle / 2;
  const sinHalf = Math.sin(halfAngle);
  return {
    w: Math.cos(halfAngle),
    x: axis[0] * sinHalf,
    y: axis[1] * sinHalf,
    z: axis[2] * sinHalf
  };
}

// 工具函数：四元数转欧拉角（如需显示或其他用途）
function quatToEuler(q) {
  return {
    roll: Math.atan2(2*(q.w*q.x + q.y*q.z), 1 - 2*(q.x**2 + q.y**2)),
    pitch: Math.asin(2*(q.w*q.y - q.z*q.x)),
    yaw: Math.atan2(2*(q.w*q.z + q.x*q.y), 1 - 2*(q.y**2 + q.z**2))
  };
}

// 初始化飞机姿态：四元数表示（初始无旋转）
plane.orientation = {w: 1, x: 0, y: 0, z: 0};

// 处理滚转输入（绕机体前轴X轴旋转）
if (keys["arrowleft"]) {
  const rollQuat = quatFromAxisAngle([1, 0, 0], -0.1);
  plane.orientation = quatMultiply(plane.orientation, rollQuat);
}
if (keys["arrowright"]) {
  const rollQuat = quatFromAxisAngle([1, 0, 0], 0.1);
  plane.orientation = quatMultiply(plane.orientation, rollQuat);
}

// 处理俯仰输入（绕机体侧轴Y轴旋转）
if (keys["arrowup"]) {
  const pitchQuat = quatFromAxisAngle([0, 1, 0], -0.1); // 抬头
  plane.orientation = quatMultiply(plane.orientation, pitchQuat);
}
if (keys["arrowdown"]) {
  const pitchQuat = quatFromAxisAngle([0, 1, 0], 0.1); // 低头
  plane.orientation = quatMultiply(plane.orientation, pitchQuat);
}

// 如需获取欧拉角，随时转换
plane.euler = quatToEuler(plane.orientation);

这种方式下，所有旋转都是基于当前机体坐标系的叠加，完全符合真实飞机的运动逻辑，不需要手动分解欧拉角，是3D姿态建模的标准方案。

内容的提问来源于stack exchange，提问作者gosoccerboy5