游戏的基础：运动

运动是游戏的核心要素之一，理解和实现各种物理运动对游戏开发至关重要。本文将介绍游戏中常见的运动类型及其实现原理

根据物体的运动方式，可以将运动分为：移动、转动、滚动、震动等。而根据物体运动的路线，又可以分为直线运动和曲线运动

匀速直线运动

一个物体沿任意方向移动一般分为在 x 和 y 轴两个方向的移动，匀速直线运动是最基本的运动形式，决定物体运动的关键参数有：

x = 0; // 物体初始位置
v = 3; // 物体在 x 方向的位置

需要注意的是，物体的实际移动速度不仅取决于设定的速度值，还与游戏的帧率（每秒更新次数）有关

任意方向移动

在二维平面上，物体的任意方向移动可以分解为在 x 轴和 y 轴上的两个分量，实现这种运动需要用到三角函数

// 物体位置
let x = 0;
let y = 0;

// 目标位置
let targetX;
let targetY;

let angle = Math.atan2(targetY - y, targetX - x); // 计算运动方向角度
let vx = speed * Math.cos(angle);                 // x 方向速度分量
let vy = speed * Math.sin(angle);                 // y 方向速度分量

x += vx;
y += vy;

重力影响下的运动

模拟重力影响下的运动（如抛物运动）需要考虑重力加速度

const GRAVITY = 9.8;         // 重力加速度，单位：像素/秒^2
let vy = 0;                  // 初始垂直速度

function update(deltaTime) {
  vy += GRAVITY * deltaTime; // 速度随时间变化
  y += vy * deltaTime;       // 位置随速度变化
}

随机飞溅效果

实现随机飞溅效果需要生成均匀分布或正态分布的随机数

// 均匀分布
function getRandomInRange(min, max) {
  return Math.random() * (max - min) + min;
}

// 近似正态分布（使用 Box-Muller 变换）
function getRandomNormal(mean = 0, stdDev = 1) {
  let u = 0, v = 0;
  while (u === 0) u = Math.random();
  while (v === 0) v = Math.random();
  return mean + stdDev * Math.sqrt(-2.0 * Math.log(u)) * Math.cos(2.0 * Math.PI * v);
}

圆周运动

圆周运动需要考虑角速度和向心力

const centerX = 100, centerY = 100; // 圆心坐标
const radius = 50; // 半径
let angle = 0; // 初始角度
const angularSpeed = 0.05; // 角速度

function update() {
  angle += angularSpeed;
  x = centerX + radius * Math.cos(angle);
  y = centerY + radius * Math.sin(angle);
}

视差滚动

视差滚动可以创造出层次感和深度感

const layers = [
  { element: document.querySelector('.bg-far'), speed: 0.1 },
  { element: document.querySelector('.bg-mid'), speed: 0.4 },
  { element: document.querySelector('.bg-near'), speed: 0.7 }
];

function updateParallax(scrollY) {
  layers.forEach(layer => {
    const yOffset = scrollY * layer.speed;
    layer.element.style.transform = `translateY(${yOffset}px)`;
  });
}

window.addEventListener('scroll', () => {
  const scrollY = window.pageYOffset;
  updateParallax(scrollY);
});

碰撞检测

碰撞检测是游戏物理的重要组成部分，以下是一个简单的矩形碰撞检测示例：

光线

旋转，向量，圆，伪影，左右判定，外积，旋转速度，曲率，反射，