以下是一个简单的实现碰撞到圆形后反弹的角度的示例代码:

// 计算两点之间的距离
function distance(x1, y1, x2, y2) {
  var dx = x2 - x1;
  var dy = y2 - y1;
  return Math.sqrt(dx * dx + dy * dy);
}

// 计算角度
function angle(x1, y1, x2, y2) {
  var dx = x2 - x1;
  var dy = y2 - y1;
  return Math.atan2(dy, dx);
}

// 碰撞检测
function checkCollision(circle, rect) {
  var cx = circle.x;
  var cy = circle.y;
  var cr = circle.radius;
  var rx = rect.x + rect.width / 2;
  var ry = rect.y + rect.height / 2;
  var rw = rect.width;
  var rh = rect.height;
  var dx = Math.abs(cx - rx);
  var dy = Math.abs(cy - ry);

  if (dx > (rw / 2 + cr)) {
    return false;
  }
  if (dy > (rh / 2 + cr)) {
    return false;
  }

  if (dx <= (rw / 2)) {
    return true;
  }
  if (dy <= (rh / 2)) {
    return true;
  }

  var dist = distance(cx, cy, rx, ry);
  return (dist <= cr);
}

// 反弹角度计算
function getBounceAngle(circle, rect) {
  var cx = circle.x;
  var cy = circle.y;
  var cr = circle.radius;
  var rx = rect.x + rect.width / 2;
  var ry = rect.y + rect.height / 2;
  var rw = rect.width;
  var rh = rect.height;

  var dx = cx - rx;
  var dy = cy - ry;
  var angle = Math.atan2(dy, dx);

  var x = Math.abs(dx) - rw / 2;
  var y = Math.abs(dy) - rh / 2;

  if (x <= 0 && y <= 0) {
    return angle + Math.PI;
  }

  if (x > 0 && y > 0) {
    var cornerDistance = distance(cx, cy, rx + (dx > 0 ? rw / 2 : -rw / 2), ry + (dy > 0 ? rh / 2 : -rh / 2));
    if (cornerDistance < cr) {
      return angle + Math.PI;
    }
  }

  return angle;
}

使用时,可以先调用 checkCollision 方法检测是否碰撞到圆形,如果碰撞到了,则调用 getBounceAngle 方法计算反弹角度。其中,circle 表示圆形的信息,包括圆心坐标和半径,rect 表示矩形的信息,包括左上角坐标和宽高。

用js写-碰撞到圆形后-反弹的角度

原文地址: http://www.cveoy.top/t/topic/rnY 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录