javascript制作游戲開(kāi)發(fā)碰撞檢測(cè)的封裝代碼
在JavaScript開(kāi)發(fā)Web游戲時(shí),需要使用到碰撞檢測(cè)時(shí),為了方便開(kāi)發(fā),封裝了矩形和圓形的兩個(gè)碰撞檢測(cè)方式。
【附帶案例操作捕獲一枚】
【注意:代碼上未做優(yōu)化處理】
演示圖
角色攻擊區(qū)域碰撞檢測(cè).gif
塔防案例.gif
矩形區(qū)域碰撞檢測(cè)
/** * 矩形區(qū)域碰撞檢測(cè) * 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; //碰撞檢測(cè)(參數(shù)為此類(lèi)) 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; } }
圓形區(qū)域碰撞檢測(cè)
/** * 圓形區(qū)域碰撞檢測(cè) * Created by Administrator on 14-4-7. * author: marker * */ function RadiusRectangle(x, y, radius){ this.x = x; this.y = y; this.radius = radius; //碰撞檢測(cè)(參數(shù)為此類(lèi)) this.intersects = function(rr){ var maxRadius = rr.radius + this.radius; // 已知兩條直角邊的長(zhǎng)度 ,可按公式:c²=a²+b² 計(jì)算斜邊。 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));// 計(jì)算圓心距離 if(distance < maxRadius){ return true; } return false; } }
以上所述就是本文的全部?jī)?nèi)容了,希望能夠?qū)Υ蠹伊私鈐avascript有所幫助。
- JS實(shí)現(xiàn)碰撞檢測(cè)的方法分析
- js實(shí)現(xiàn)碰撞檢測(cè)特效代碼分享
- 原生JS實(shí)現(xiàn)的碰撞檢測(cè)功能示例
- 原生js實(shí)現(xiàn)碰撞檢測(cè)
- javascript實(shí)現(xiàn)多邊形碰撞檢測(cè)
- 基于javascript實(shí)現(xiàn)碰撞檢測(cè)
- js實(shí)現(xiàn)拖拽與碰撞檢測(cè)
- 原生js實(shí)現(xiàn)移動(dòng)小球(碰撞檢測(cè))
- js 實(shí)現(xiàn)碰撞檢測(cè)的示例
- three.js利用射線Raycaster進(jìn)行碰撞檢測(cè)
- js實(shí)現(xiàn)碰撞檢測(cè)
相關(guān)文章
JS實(shí)現(xiàn)簡(jiǎn)單的tab切換選項(xiàng)卡效果
這篇文章主要介紹了JS實(shí)現(xiàn)簡(jiǎn)單的tab切換選項(xiàng)卡效果,涉及javascript結(jié)合鼠標(biāo)事件對(duì)頁(yè)面元素屬性動(dòng)態(tài)操作的相關(guān)技巧,需要的朋友可以參考下2016-09-09js限制文本框只能輸入整數(shù)或者帶小數(shù)點(diǎn)的數(shù)字
如何用js限制文本框輸入,只允許輸入整數(shù)或帶一位小數(shù)的浮點(diǎn)數(shù),本文分享一例代碼,有需要的朋友參考下2015-04-04js中arguments,caller,callee,apply的用法小結(jié)
本篇文章只要是對(duì)js中arguments,caller,callee,apply的用法進(jìn)行了詳細(xì)的介紹,需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2014-01-01詳解使用grunt完成requirejs的合并壓縮和js文件的版本控制
這篇文章主要介紹了詳解使用grunt完成requirejs的合并壓縮和js文件的版本控制 ,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2017-03-03js實(shí)現(xiàn)無(wú)縫滾動(dòng)圖(可控制當(dāng)前滾動(dòng)的方向)
本文主要分享了js實(shí)現(xiàn)無(wú)縫滾動(dòng)圖的示例代碼,這個(gè)版本可以控制左右滾動(dòng),鼠標(biāo)點(diǎn)擊對(duì)應(yīng)的廣告會(huì)自動(dòng)滑動(dòng)把廣告完全展示出來(lái),當(dāng)鼠標(biāo)離開(kāi),接著繼續(xù)滾動(dòng)。具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧2017-02-02JS中不為人知的五種聲明Number的方式簡(jiǎn)要概述
聲明一個(gè)數(shù)值類(lèi)型的變量我看到三種;我嘴角微微一笑:少年你還嫩了點(diǎn),哪止三種,我知道的至少有五種,好奇的你可以參考下哈,希望本文可以幫助到你2013-02-02詳解webpack打包第三方類(lèi)庫(kù)的正確姿勢(shì)
這篇文章主要介紹了詳解webpack打包第三方類(lèi)庫(kù)的正確姿,我們主要介紹了webpack.optimize.CommonsChunkPlu,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-10-10JS獲取當(dāng)前網(wǎng)址、主機(jī)地址項(xiàng)目根路徑
本文為大家提供JS如何獲取當(dāng)前網(wǎng)址、主機(jī)地址之后的目錄及項(xiàng)目根路徑的方法,喜歡的朋友可以收藏下2013-11-11