更多JS AI会导致HTML Canvas中的AI移动速度变慢

时间:2016-10-16 09:08:22

标签: javascript performance canvas collision bounding-box

我有一个简单的小游戏,一个角色作为玩家,四个敌人角色。我创造了一个非常基本的AI,当玩家在附近时,它向玩家移动。这一切都运行良好,但当我添加AI-AI碰撞(使用边界框模型)时,它大大减慢了速度,并且指数越多,AI就越多。有了四个人工智能,他们的行动非常缓慢3 AI好一点。 2是完美的,1太快了。

我有以下功能来计算玩家附近的AI动作。

function updateAI() {
    for (i = 0; i < aiCount; i++) {
        if (aiCounterAI >= aiCount) {
            aiCounterAI = 0;
        }
        checkArmyAIcol = armyAI[aiCounterAI][1];
        checkArmyAIrow = armyAI[aiCounterAI][2];
        enemySpeed = enemies[armyAI[aiCounterAI][0][0]][3];
        enemyPlayerCollision = false;
        if (playerBattle.xCoord - 6 <= checkArmyAIcol && playerBattle.xCoord + 6 >= checkArmyAIcol) {
            if (playerBattle.yCoord - 6 <= checkArmyAIrow && playerBattle.yCoord + 6 >= checkArmyAIrow) {
                if (playerBattle.x < armyAI[aiCounterAI][3] - 48) {
                    armyAI[aiCounterAI][3] = armyAI[aiCounterAI][3] - enemySpeed;
                    aiDirection = 'left';
                }
                if (playerBattle.x > armyAI[aiCounterAI][3] + 48) {
                    armyAI[aiCounterAI][3] = armyAI[aiCounterAI][3] + enemySpeed;
                    aiDirection = 'right';
                }
                if (playerBattle.y < armyAI[aiCounterAI][4] - 48) {
                    armyAI[aiCounterAI][4] = armyAI[aiCounterAI][4] - enemySpeed;
                    aiDirection = 'up'; 
                }
                if (playerBattle.y > armyAI[aiCounterAI][4] + 48) {
                    armyAI[aiCounterAI][4] = armyAI[aiCounterAI][4] + enemySpeed;
                    aiDirection = 'down'; 
                }
                checkBattleCollision('ai',aiCounterAI);
                armyAI[aiCounterAI][1] = Math.ceil(armyAI[aiCounterAI][3] / 48);
                armyAI[aiCounterAI][2] = Math.ceil(armyAI[aiCounterAI][4] / 48);
            }
        }
        aiCounterAI++;
    }
}

最后我有这个功能来计算AI碰撞。

if (type == 'ai') {
    enemyEnemyCollision = false;
    if (aiCount > 1) {
    checkArmyAIcol1 = armyAI[ai][1];
    checkArmyAIrow1 = armyAI[ai][2];
    checkArmyAIx1 = armyAI[ai][3];
    checkArmyAIy1 = armyAI[ai][4];
    var aiCounter2 = 0;
    for (i = 0; i < aiCount; i++) {
        if (aiCounter2 != ai) {
            checkArmyAIcol2 = armyAI[aiCounter2][1];
            checkArmyAIrow2 = armyAI[aiCounter2][2];
            checkArmyAIx2 = armyAI[aiCounter2][3];
            checkArmyAIy2 = armyAI[aiCounter2][4];
            // Check if the AI is near the other AI before checking if collision is true
            if (checkArmyAIcol1 - 1 <= checkArmyAIcol2 && checkArmyAIcol1 + 1 >= checkArmyAIcol2) {
                if (checkArmyAIrow1 - 1 <= checkArmyAIrow2 && checkArmyAIrow1 + 1 >= checkArmyAIrow2) {
                    if (checkArmyAIx1 < checkArmyAIx2 + 48 &&
                        checkArmyAIx1 + 48 > checkArmyAIx2 &&
                        checkArmyAIy1 < checkArmyAIy2 + 48 &&
                        checkArmyAIy1 + 48 > checkArmyAIy2) {
                        enemyEnemyCollision = true;
                        checkEnemyEnemyCollision(ai,aiCounter2);
                    }
                }
            }
        }
        aiCounter2++;
    }
}
}

function checkEnemyEnemyCollision(enemy1,enemy2) {
enemySpeed = enemies[armyAI[enemy1][0][0]][3];
    if (enemyEnemyCollision == true) {
        if (aiDirection == 'left') {
            armyAI[enemy1][3] = armyAI[enemy1][3] + enemySpeed;}
        if (aiDirection == 'right') {
            armyAI[enemy1][3] = armyAI[enemy1][3] - enemySpeed;}
        if (aiDirection == 'up') {
            armyAI[enemy1][4] = armyAI[enemy1][4] + enemySpeed;}
        if (aiDirection == 'down') {
            armyAI[enemy1][4]= armyAI[enemy1][4] - enemySpeed;}
        console.log("ya'll collided ya clumsy potatoes");
    }
}

updateAI功能快速且运行良好。如前所述添加碰撞(使用边界框模型)可以大大减慢速度。通过我的游戏循环中的requestAnimationFrame,这些函数每秒调用60次。我的猜测是它在与帧速率的碰撞中不能保持足够快的速度,因此它们不能移动得太多。然而,我不知道如何解决这个问题。有没有人有什么建议?边界框碰撞和多个移动项目对我来说是一个新的领域,所以我不会介意改进我的代码。

0 个答案:

没有答案