javascript制作游戏开发碰撞检测的封装代码


Posted in Javascript onMarch 31, 2015

在JavaScript开发Web游戏时,需要使用到碰撞检测时,为了方便开发,封装了矩形和圆形的两个碰撞检测方式。

【附带案例操作捕获一枚】
【注意:代码上未做优化处理】

演示图

javascript制作游戏开发碰撞检测的封装代码

角色攻击区域碰撞检测.gif

javascript制作游戏开发碰撞检测的封装代码

塔防案例.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;
  }
}

以上所述就是本文的全部内容了,希望能够对大家了解javascript有所帮助。

Javascript 相关文章推荐
JQuery中form验证出错信息的查看方法
Oct 08 Javascript
讨论html与javascript在浏览器中的加载顺序问题
Nov 27 Javascript
JQuery鼠标移到小图显示大图效果的方法
Jun 10 Javascript
js小数运算出现多位小数如何解决
Oct 08 Javascript
实例讲解js验证表单项是否为空的方法
Jan 09 Javascript
AngularJS中的Directive自定义一个表格
Jan 25 Javascript
TypeScript Type Innference(类型判断)
Mar 10 Javascript
一种angular的方法级的缓存注解(装饰器)
Mar 13 Javascript
vue模式history下在iis中配置流程
Apr 17 Javascript
详解可以用在VS Code中的正则表达式小技巧
May 14 Javascript
在layui框架中select下拉框监听更改事件的例子
Sep 20 Javascript
浅谈vue项目利用Hbuilder打包成APP流程,以及遇到的坑
Sep 12 Javascript
jQuery选择器源码解读(二):select方法
Mar 31 #Javascript
jQuery选择器源码解读(一):Sizzle方法
Mar 31 #Javascript
JavaScript中创建字典对象(dictionary)实例
Mar 31 #Javascript
jQuery Ajax调用WCF服务详细教程
Mar 31 #Javascript
JavaScript父子窗体间的调用方法
Mar 31 #Javascript
JavaScript操作cookie类实例
Mar 31 #Javascript
javascript实现简单的贪吃蛇游戏
Mar 31 #Javascript
You might like
php 用checkbox一次性删除多条记录的方法
2010/02/23 PHP
在php和MySql中计算时间差的方法
2011/04/22 PHP
php中删除数组的第一个元素和最后一个元素的函数
2015/03/07 PHP
遍历指定目录,并存储目录内所有文件属性信息的php代码
2016/10/28 PHP
PHP基于SimpleXML生成和解析xml的方法示例
2017/07/17 PHP
如何修改Laravel中url()函数生成URL的根地址
2017/08/11 PHP
关于B/S判断浏览器断开的问题讨论
2008/10/29 Javascript
JavaScript prototype属性使用说明
2010/05/13 Javascript
javascript中的self和this用法小结
2014/02/08 Javascript
JS自调用匿名函数具体实现
2014/02/11 Javascript
BootStrap 智能表单实战系列(十)自动完成组件的支持
2016/06/13 Javascript
针对后台列表table拖拽比较实用的jquery拖动排序
2016/10/10 Javascript
jQuery插件HighCharts实现的2D面积图效果示例【附demo源码下载】
2017/03/15 Javascript
微信小程序--组件(swiper)详细介绍
2017/06/13 Javascript
gulp安装以及打包合并的方法教程
2017/11/19 Javascript
nodejs基于WS模块实现WebSocket聊天功能的方法
2018/01/12 NodeJs
JS判断字符串是否为整数的方法--简单的正则判断
2018/07/23 Javascript
解决layui轮播图有数据不显示的情况
2019/09/16 Javascript
js 实现碰撞检测的示例
2020/10/28 Javascript
[02:36]DOTA2亚洲邀请赛小组赛精彩集锦:EE凭借法力虚空拿下4杀
2017/03/30 DOTA
[01:08:32]DOTA2-DPC中国联赛 正赛 DLG vs PHOENIX BO3 第二场 1月18日
2021/03/11 DOTA
python opencv旋转图像(保持图像不被裁减)
2018/07/26 Python
python定间隔取点(np.linspace)的实现
2019/11/27 Python
python dumps和loads区别详解
2020/02/04 Python
canvas学习笔记之绘制简单路径
2019/01/28 HTML / CSS
html5 Canvas画图教程(5)—canvas里画曲线之arc方法
2013/01/09 HTML / CSS
沪江旗下的海量优质课程平台:沪江网校
2017/11/07 全球购物
史蒂夫·马登加拿大官网:Steve Madden加拿大
2017/11/18 全球购物
网络技术支持面试题
2013/04/22 面试题
毕业生个人求职信范例分享
2013/12/17 职场文书
大一军训感言
2014/01/09 职场文书
采购部经理岗位职责
2014/02/10 职场文书
春季运动会广播稿大全
2014/02/19 职场文书
运动会跳远广播稿
2015/08/19 职场文书
导游词之云南丽江古城
2019/09/17 职场文书
古诗文之爱国名句(77句)
2019/09/24 职场文书