Mengapa bolaku menghilang? [Tutup]

Maafkan judul yang lucu. Saya telah membuat demo grafis kecil dengan 200 bola yang memantul dan bertabrakan, baik di dinding dan satu sama lain. Anda dapat melihat apa yang saya miliki saat ini di sini: http://www.exeneva.com/html5/multipleBallsBouncingAndColliding/

Masalahnya adalah bahwa setiap kali mereka bertabrakan, mereka menghilang. Saya tidak yakin mengapa. Bisakah seseorang melihat dan membantu saya?

PEMBARUAN: Rupanya susunan bola memiliki bola dengan koordinat NaN. Di bawah ini adalah kode di mana saya mendorong bola ke array. Saya tidak sepenuhnya yakin bagaimana koordinat mendapatkan NaN.

// Variables
var numBalls = 200;  // number of balls
var maxSize = 15;
var minSize = 5;
var maxSpeed = maxSize + 5;
var balls = new Array();
var tempBall;
var tempX;
var tempY;
var tempSpeed;
var tempAngle;
var tempRadius;
var tempRadians;
var tempVelocityX;
var tempVelocityY;

// Find spots to place each ball so none start on top of each other
for (var i = 0; i < numBalls; i += 1) {
  tempRadius = 5;
  var placeOK = false;
  while (!placeOK) {
    tempX = tempRadius * 3 + (Math.floor(Math.random() * theCanvas.width) - tempRadius * 3);
    tempY = tempRadius * 3 + (Math.floor(Math.random() * theCanvas.height) - tempRadius * 3);
    tempSpeed = 4;
    tempAngle = Math.floor(Math.random() * 360);
    tempRadians = tempAngle * Math.PI/180;
    tempVelocityX = Math.cos(tempRadians) * tempSpeed;
    tempVelocityY = Math.sin(tempRadians) * tempSpeed;

    tempBall = {
      x: tempX, 
      y: tempY, 
      nextX: tempX, 
      nextY: tempY, 
      radius: tempRadius, 
      speed: tempSpeed,
      angle: tempAngle,
      velocityX: tempVelocityX,
      velocityY: tempVelocityY,
      mass: tempRadius
    };
    placeOK = canStartHere(tempBall);
  }
  balls.push(tempBall);
}

Awalnya kesalahan Anda berasal dari baris ini:

var direction1 = Math.atan2(ball1.velocitY, ball1.velocityX);

Anda memiliki ball1.velocitY(yang undefined) bukannya ball1.velocityY. Begitu Math.atan2juga memberi Anda NaN, dan NaNnilai itu menyebar melalui semua perhitungan Anda.

Ini bukan sumber kesalahan Anda, tetapi ada hal lain yang mungkin ingin Anda ubah pada empat baris ini:

ball1.nextX = (ball1.nextX += ball1.velocityX);
ball1.nextY = (ball1.nextY += ball1.velocityY);
ball2.nextX = (ball2.nextX += ball2.velocityX);
ball2.nextY = (ball2.nextY += ball2.velocityY);

Anda tidak memerlukan tugas tambahan, dan cukup menggunakan +=operator saja:

ball1.nextX += ball1.velocityX;
ball1.nextY += ball1.velocityY;
ball2.nextX += ball2.velocityX;
ball2.nextY += ball2.velocityY;

Ada kesalahan dalam collideBallsfungsi:

var direction1 = Math.atan2(ball1.velocitY, ball1.velocityX);

Harus:

var direction1 = Math.atan2(ball1.velocityY, ball1.velocityX);