iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 18
0
Software Development

用Canvas打造自己的遊樂場系列 第 18

[Day18]用Canvas打造自己的遊樂場-Galaxian 找出問題點

  • 分享至 

  • xImage
  •  

實在是很抱歉~今天白天都在山上的關係,時間上也不是很充裕,今天就先找出為什麼會有昨天bug的可能原因,之後再做修改.
這是昨天的bug

可以看到子彈打到目標後,死亡的可能是其他位置的敵人,這有兩種可能的原因,先從比較簡單解決的方式來看.可能是在我們把座標位置轉換成敵人陣列index時,行跟列輸入錯了


// 敵人位置轉序列
enemyToIndex = (col, row) => {
    return (col + ENEMY_COLS * row);
} 

// 對應序列敵人存在
isEnemyExist = (col, row) => {
    var enemy_index = enemyToIndex(col, row);
    return (enemy_grid[enemy_index] == 1);
}

// 重置敵人數量
resetEnemy = () => {
    enemy_left = 0;

    for(var row = 0; row < ENEMY_ROWS; row++) {
        for (var col = 0 ; col <ENEMY_COLS; col++) {
            var enemy_index = enemyToIndex(col, row);
            if (row > 1) {
                enemy_grid[enemy_index] = 1;
                enemy_left++;
            } else {
                enemy_grid[enemy_index] = 0;
            }
        }
    }
}

// 顯示敵人
showEnemy = () => {
    for(var col = 0; col < ENEMY_COLS; col++) {
        for(var row = 0; row < ENEMY_ROWS; row++) {
            if (isEnemyExist(col, row)) {
                var enemy_x = col * (ENEMY_R + ENEMY_SPACING_X);
                var enemy_y = row * (ENEMY_R + ENEMY_SPACING_Y);
                drawCircle(enemy_x + enemy_distance, enemy_y, ENEMY_R, 'red');
            }
        }
    }
}

從這幾個韓式看起來,輸入的行列沒有寫反的狀況.
這就表示,我們在showenemy中,對每個enemy作的位移,跟子彈的座標是對不上的

if (isEnemyExist(col, row)) {
    var enemy_x = col * (ENEMY_R + ENEMY_SPACING_X);
    var enemy_y = row * (ENEMY_R + ENEMY_SPACING_Y);
    drawCircle(enemy_x + enemy_distance, enemy_y, ENEMY_R, 'red');
}

明天解決的辦法就是針對子彈來做敵人位移的計算,應該就能夠對應上實際的擊殺目標了.


上一篇
[Day17]用Canvas打造自己的遊樂場-Galaxian 有bug 明天要除蟲
下一篇
[Day19]用Canvas打造自己的遊樂場-Galaxian 終究得除蟲
系列文
用Canvas打造自己的遊樂場30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言