Javascript 碰撞檢測問題

Question

我有一個帶有這種碰撞檢測方法的類：

wallCollisionDetection(){
    if((this.position.x >= canvasWidth-this.radius) || (this.position.x <= this.radius) ){
        this.speed.x = -this.speed.x
    }
    
    if((this.position.y >= canvasHeight-this.radius) || (this.position.y <= this.rafius) ){
        this.speed.y = -this.speed.y
    }
}

很簡單，而且很有效。 有時（很少但仍然如此），當粒子撞擊垂直牆壁時，它往往會垂直移動，粘在牆上。 同樣，當它碰到水平牆壁時（然后它往往只會水平移動）。

作為參考，如果我生成 200 個粒子並讓它們隨機移動 5 分鍾，平均有 2 個粒子會卡在一個方向上。

我認為這個代碼示例應該足夠了，因為沒有拋出錯誤。 所以我相信我只是在這種方法中遺漏了一些額外的條件。 但是，如果您認為您需要更多，請提出要求。

Answer 1

好的，斯昆利夫給我指路了。 似乎當一個粒子越過邊界時，它仍然停留在一個無限的“如果”循環中。

所以這就是它的解決方法（基本上，我只是將位置設置為其最大/最小允許值，這樣循環就不會發生）：

wallCollisionDetection(){

    if(this.position.x > canvasWidth-this.radius){
        this.position.x = canvasWidth-this.radius;
        this.speed.x = -this.speed.x
    }
    else if(this.position.x < this.radius){
        this.position.x = this.radius
        this.speed.x = -this.speed.x
    }

    if(this.position.y > canvasHeight-this.radius ){
        this.position.y = canvasHeight-this.radius;
        this.speed.y = -this.speed.y
    }
    else if(this.position.y < this.radius){
        this.position.y = this.radius;
        this.speed.y = -this.speed.y
    }
}

不漂亮，但它有效。 謝謝！