在javascript中碰撞檢測

我正在實施一個自定義空間侵略者在HTML/JavaScript中。到目前爲止，一切正常，但碰撞檢測似乎是一個問題。在網上尋找一些解決方案之後，這裏是我迄今爲止的。在javascript中碰撞檢測

我的敵人被表示在陣列中是這樣的：

function Logo(I){ 
    I = I || {}; 
    I.sprite = new Image(); 
    I.active = true; 

    I.width = 25; 
    I.height = 25; 

    I.explode = function(){ 
     this.active = false; 
    } 

    I.draw = function(){ 
     context.drawImage(I.sprite,this.x,this.y); 
    } 

    I.setRes = function(name){ 
     this.sprite.src = name; 
    } 

    return I; 
}

其中填充這樣的：

var logoArray = []; 
    for(i=0;i<logoData.length;i++){ 
     logoArray.push(Logo({ 
      x: logoData[i].x, 
      y: logoData[i].y 
     })); 
     logoArray[i].setRes("./graphics/logo_slices/logo_" + logoData[i].name + ".png"); 
     console.log(logoArray[i].sprite.src); 
    }

碰撞被這樣處理（enemy.explode做this.active =假）：

function handleCollision(){ 
    playerBullets.forEach(function(bullet) { 
     logoArray.forEach(function(enemy) { 
      if (isCollide(bullet, enemy)) { 
      enemy.explode(); 
      bullet.active = false; 
      } 
     }); 
    }); 
} 

function isCollide(a, b) { 
    return a.x < b.x + b.width && 
     a.x + a.width > b.x && 
     a.y < b.y + b.height && 
     a.y + a.height > b.y; 
}

問題是，它使得處於非活動狀態的所有影響poi的左側NT。據我所知，很難說清楚我的問題很高興澄清。

繪製函數的過濾器僅繪製陣列的有源元件：

logoArray.forEach(function(logo_slice){ 
    logo_slice.draw(); 
});

感謝您的幫助，您可以給！

來源

2016-06-28 aur8l

'isCollide'的代碼在哪裏？這不是你的代碼中最相關的部分嗎？ – smarx

回答這個問題所需的一切都在你沒有提供的代碼中 - 'isCollide' – Jamiec

另外，你打算執行每像素碰撞檢測嗎？或者只是矩形重疊檢測？ – Arnauld

關於你的碰撞邏輯，我會採取相反的做法：

取4例定義一個沒有衝突和否定他們。在上方，在下方，除了左/右。不是這四個中的任何一個都必然會造成碰撞。

正如我想這是原因。「引擎」的其餘部分看起來很合理，應該可以工作。

collide = 

!(a.x + a.width < b.x || 
    a.x > b.x + b.width || 

    a.y + a.height < b.y|| 
    a.y > b.y + b.height)

此外，您可以定義一個參與碰撞的實體的半徑，並通過半徑使用交點。當然，你需要這個實體的中心來工作。

編輯：有關JS中不同碰撞檢測方法的更多詳細信息和詳細示例，請參閱 https://developer.mozilla.org/en-US/docs/Games/Techniques/2D_collision_detection。

來源

2016-06-29 00:05:58 Lemonade

我之前嘗試過這種方法，但最終得到相同的結果。我覺得我的方法在實際定位「敵人」方面存在問題。如果這有助於診斷，則碰撞似乎在到達任何切片之前被檢測到。 – aur8l

嗨，再次抱歉，但我真的迷失了，我完全不知道什麼是錯的。 – aur8l

你確定你嘗試了上述「方法」嗎？ – Lemonade

在javascript中碰撞檢測

回答

相關問題