html5怎么實現(xiàn)神經(jīng)貓游戲

發(fā)布時間：2022-03-03 13:43:21 來源：億速云閱讀：96 作者：iii 欄目：web開發(fā)

本文小編為大家詳細(xì)介紹“html5怎么實現(xiàn)神經(jīng)貓游戲”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“html5怎么實現(xiàn)神經(jīng)貓游戲”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習(xí)新知識吧。

　　游戲設(shè)計思路

　　從貓當(dāng)前的位置找六個方向中可通行的鄰居，然后從這些鄰居出發(fā)，再找它們各自的可通行鄰居，一直這樣找下去，一邊找的過程中，一邊判斷當(dāng)前已經(jīng)找到的鄰居中有沒有處在游戲區(qū)邊緣的，如果有，那么尋找過程提前結(jié)束，判斷結(jié)果是：貓沒有被圍住。如果直到所有的可通行鄰居都找到了，里面都沒有處在游戲區(qū)邊緣的，那么判斷結(jié)果是：貓被圍住了。

　　參考代碼

　　cat.html

　　app.js

　　var stage = new createjs.Stage("gameView");

　　createjs.Ticker.setFPS(30);

　　createjs.Ticker.addEventListener("tick",stage);

　　var gameView = new createjs.Container();

　　gameView.x = 30;

　　gameView.y = 30;

　　stage.addChild(gameView);

　　var circleArr = [[],[],[],[],[],[],[],[],[]];

　　var currentCat;

　　//定義7種狀態(tài) 表示移動位置

　　var MOVE_NONE = -1,MOVE_LEFT = 0,MOVE_UP_LEFT = 1,MOVE_UP_RIGHT = 2,MOVE_RIGHT = 3,MOVE_DOWN_RIGHT = 4,MOVE_DOWN_LEFT = 5;

　　function getMoveDir(cat){

　　//分別判斷能走的位置

　　var distanceMap = [];

　　//left

　　var can = true;

　　for (var x = cat.indexX;x>=0;x--) {

　　if(circleArr[x][cat.indexY].getCircleType() == Circle.TYPE_SELECTED){

　　can = false;

　　distanceMap[MOVE_LEFT] = cat.indexX - x;

　　break;

　　}

　　if(can){

　　return MOVE_LEFT;

　　}

　　//left up

　　can =true;

　　var x = cat.indexX , y = cat.indexY;

　　while(true){

　　if(circleArr[x][y].getCircleType() == Circle.TYPE_SELECTED){

　　can = false;

　　distanceMap[MOVE_UP_LEFT] = can.indexY-y;

　　break;

　　}

　　if(y%2 == 0){

　　x--;

　　}

　　y--;

　　if(y<0 ||x<0){

　　break;

　　}

　　if(can){

　　return MOVE_UP_LEFT;

　　}

　　//right up

　　can =true;

　　var x = cat.indexX , y = cat.indexY;

　　while(true){

　　if(circleArr[x][y].getCircleType() == Circle.TYPE_SELECTED){

　　can = false;

　　distanceMap[MOVE_UP_RIGHT] = can.indexY-y;

　　break;

　　}

　　if(y%2 == 1){

　　x++;

　　}

　　y--;

　　if(y <0||x>8){

　　break;

　　}

　　if(can){

　　return MOVE_UP_RIGHT;

　　}

　　//right

　　can =true;

　　for (var x= cat.indexX;x<9;x++) {

　　if(circleArr[x][cat.indexY].getCircleType() == Circle.TYPE_SELECTED){

　　can =false;

　　distanceMap[MOVE_RIGHT] = x -cat.indexX;

　　break;

　　}

　　if(can){

　　return MOVE_RIGHT;

　　}

　　//ritht down

　　can = true;

　　x= cat.indexX,y = cat.indexY;

　　while(true){

　　if(circleArr[x][y].getCircleType() == Circle.TYPE_SELECTED){

　　can =false;

　　distanceMap[MOVE_DOWN_RIGHT] = y -cat.indexY;

　　break;

　　}

　　if(y%2 == 1){

　　x++;

　　}

　　y++;

　　if(y>8 ||x>8){

　　break;

　　}

　　if(can){

　　return MOVE_DOWN_RIGHT;

　　}

　　//left down

　　can = true;

　　x= cat.indexX,y = cat.indexY;

　　while(true){

　　if(circleArr[x][y].getCircleType() == Circle.TYPE_SELECTED){

　　can = false;

　　distanceMap[MOVE_DOWN_LEFT] = y -cat.index;

　　break;

　　}

　　if(y%2 == 0){

　　x--;

　　}

　　y++;

　　if(y>8 || x<0){

　　break;

　　}

　　if(can){

　　return MOVE_DOWN_LEFT;

　　}

　　var maxDir = -1,maxValue = -1;

　　for (var dir = 0;dir

　　if(distanceMap[dir]>maxValue){

　　maxValue = distanceMap[dir];

　　maxDir = dir;

　　}

　　if(maxValue > 1){

　　return maxDir;

　　}else{

　　return MOVE_NONE;

　　}

　　function circleClicked(event){

　　if(event.target.getCircleType() != Circle.TYPE_CAT){

　　event.target.setCircleType(Circle.TYPE_SELECTED);

　　}else{

　　return;

　　}

　　//表示碰到邊緣游戲結(jié)束

　　if(currentCat.indexX == 0 ||currentCat.indexX == 8 ||currentCat.indexY==0 ||currentCat.indexY==8){

　　alert("游戲結(jié)束");

　　return;

　　}

　　var dir = getMoveDir(currentCat);

　　switch (dir){

　　//判斷他要走那一個方向

　　case MOVE_LEFT: