Lors du développement de jeux Web avec JavaScript, la détection de collision est requise Afin de faciliter le développement, deux méthodes de détection de collision, rectangulaire et circulaire, sont encapsulées.
【Capturez-en un avec le fonctionnement du boîtier】
[Remarque : le code n'a pas été optimisé]
Photo de démonstration
Détection de collision de zone d'attaque de personnage.gif
Affaire Tower Defense.gif
Détection de collision dans une zone rectangulaire
/** * 矩形区域碰撞检测 * 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; } }
Détection de collision dans une zone circulaire
/** * 圆形区域碰撞检测 * 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; } }
Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à tout le monde pour comprendre le javascript.