javascript_javascript 기술을 사용하여 게임 개발에서 충돌 감지를 위한 캡슐화 코드

JavaScript로 웹 게임을 개발할 때 충돌 감지가 필요합니다. 개발을 용이하게 하기 위해 직사각형과 원형의 두 가지 충돌 감지 방법이 캡슐화됩니다.

【케이스작전으로 한마리 잡기】
[참고: 코드가 최적화되지 않았습니다.]

데모사진

캐릭터 공격영역 충돌감지.gif

타워디펜스 케이스.gif

직사각형 영역 충돌 감지

/**
 * 矩形区域碰撞检测
 * Created by Administrator on 14-4-7.
 * author: marker
 */
function Rectangle(x, y, _width, _height){
  this.x = x;
  this.y = y; 
  this.width = _width;
  this.height = _height;
   
  //碰撞检测(参数为此类)
  this.intersects = function(obj){
    var a_x_w = Math.abs((this.x+this.width/2) - (obj.x+obj.width/2));
    var b_w_w = Math.abs((this.width+obj.width)/2);
    var a_y_h = Math.abs((this.y+this.height/2) - (obj.y+obj.height/2)); 
    var b_h_h = Math.abs((this.height+obj.height)/2);
    if( a_x_w < b_w_w && a_y_h < b_h_h ) return true;
    else return false;
  }
 
}

원형 영역 충돌 감지

/**
 * 圆形区域碰撞检测
 * Created by Administrator on 14-4-7.
 * author: marker
 *
 */
function RadiusRectangle(x, y, radius){
  this.x = x;
  this.y = y;
  this.radius = radius;
 
  //碰撞检测(参数为此类)
  this.intersects = function(rr){
    var maxRadius = rr.radius + this.radius;
    // 已知两条直角边的长度 ，可按公式：c²=a²+b² 计算斜边。
    var a = Math.abs(rr.x - this.x);
    var b = Math.abs(rr.y - this.y);
    var distance = Math.sqrt(Math.pow(a,2) + Math.pow(b,2));// 计算圆心距离
    if(distance < maxRadius){
      return true;
    }
    return false;
  }
}

이상은 이 글의 전체 내용입니다. 자바스크립트를 이해하시는 모든 분들께 도움이 되었으면 좋겠습니다.