物理模拟中如何沿物体自身角度平移？基于Matter.js的计算问题

核心计算逻辑 #

2D平面内沿指定角度平移的坐标换算规则非常明确：

• 沿角度方向平移的x轴位移分量：dx = 平移距离 * cos(刚体当前弧度角)
• 沿角度方向平移的y轴位移分量：dy = 平移距离 * sin(刚体当前弧度角)

注意：Matter.js内置Body.angle属性默认使用弧度制，逆时针旋转为正方向，0角度对应x轴正方向（朝右），无需额外做角度单位转换。
你提到的旋转45度场景对应弧度为Math.PI / 4，代入40单位的平移距离计算可得dx≈28.28、dy≈28.28，刚好符合沿45度方向平移40单位的预期。

代码实现 #

方式1：瞬间完成平移 #

直接修改刚体坐标即可，适合无动画需求的场景：

// squareBody 为你的正方形刚体实例
const moveDistance = 40;
const dx = moveDistance * Math.cos(squareBody.angle);
const dy = moveDistance * Math.sin(squareBody.angle);
Matter.Body.setPosition(squareBody, {
  x: squareBody.position.x + dx,
  y: squareBody.position.y + dy
});

方式2：平滑移动 #

通过设置速度实现匀速平移，适合需要动画效果的场景：

const moveDistance = 40;
const moveDuration = 1000; // 平移总耗时，单位ms，可自行调整
// 计算每帧需要的速度，默认60帧/s
const velocityX = (moveDistance * Math.cos(squareBody.angle)) / (moveDuration / 1000 * 60);
const velocityY = (moveDistance * Math.sin(squareBody.angle)) / (moveDuration / 1000 * 60);
Matter.Body.setVelocity(squareBody, {x: velocityX, y: velocityY});
// 到达目标位置后停止移动
setTimeout(() => {
  Matter.Body.setVelocity(squareBody, {x: 0, y: 0});
}, moveDuration);

内容的提问来源于stack exchange，提问作者Dr. Chocolate