html5 迷宫游戏(碰撞检测)实例一
来源: 阅读:1164 次 日期:2016-07-13 13:58:39
温馨提示: 小编为您整理了“html5 迷宫游戏(碰撞检测)实例一”,方便广大网友查阅!

通过鼠标拖拽在画布上添加墙壁,通过方向键控制多边形上下左右移动,遇到墙壁则无法前进,下面为大家介绍下需要解决的问题及具体的实现代码,感兴趣的朋友可以学习下

需要解决的问题

鼠标按下,鼠标拖动,鼠标释放事件的检测

多边形的绘制

墙壁的绘制

多边形和墙壁的碰撞检测(实质上是圆和线段的相交判断)

MYCode:

代码如下:

迷宫

Baidu
map

难点

多边形和线段碰撞检测的方法

函数intersect()负责检测多边形和线段是否相交

记线段上一点p(x,y)

线段2个端点是(sx,sy)和(fx,fy)

dx=fx-sx

dy=fy-sy

x和y可以表示如下

x=sx+t*dx

y=sy+t*dy

要判断线段和多边形是否相交,转化为判断线段和多边形的外接圆是否相交

为此需要找到线段上离圆心o最近的一点p

如果|op|<圆的半径,则可以判断线段和圆相交。

否则不相交。

怎么找到线段上离圆心距离最近的点呢?

p点到o点的距离可以表示为

distance=sqrt((x-cx)*(x-cx)+(y-cy)*(y-cy));

代入

x=sx+t*dx和y=sy+t*dy

可以得到distance是一个关于t的函数

对此函数求导

求出函数值为0时对应的t值就可以得到距离圆心最近的点

更多信息请查看 网页制作
由于各方面情况的不断调整与变化, 提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!

2025国考·省考课程试听报名

  • 报班类型
  • 姓名
  • 手机号
  • 验证码
关于我们| 联系我们| 人才招聘| 网站声明| 网站帮助| 非正式的简要咨询| 简要咨询须知| 新媒体/短视频平台| 手机站点| 投诉建议
工业和信息化部备案号:滇ICP备2023014141号-1 云南省教育厅备案号:云教ICP备0901021 滇公网安备53010202001879号 人力资源服务许可证:(云)人服证字(2023)第0102001523号
云南网警备案专用图标
联系电话:0871-65099533/13759567129 获取招聘考试信息及咨询关注公众号:
咨询QQ:1093837350(9:00—18:00) 版权所有:
云南网警报警专用图标
Baidu
map