0
ユーザーが任意のパーティクルをクリックすると、そのパーティクルが拡大して消滅し、他のパーティクルと衝突するとそのパーティクルも膨張して消滅します。今私の問題は、衝突したときにそれらの粒子（この場合はコンストラクタで作成されたもの）を互いに影響させる方法があるかどうかを知りたいということです。 Codepenパーティクル（コンストラクタで作成）は、衝突時に拡大してフェードする
var bubbles = [];
function setup() {
\t frameRate(25);
\t // Creates Canvas
\t createCanvas(windowWidth, windowHeight);
\t //Genrates 100 Particles with random a & y
\t for (var i = 0; i < 80; i++) {
\t \t var x = random(width);
\t \t var y = random(height);
\t \t bubbles[i] = new Bubble(x, y);
\t }
}
function mousePressed() {
\t for (var i = 0; i < bubbles.length; i++) {
\t \t bubbles[i].clicked();
\t }
}
function draw() {
\t clear();
\t //Adds color and motion
\t for (var bubble of bubbles) {
\t \t fill(bubble.color.red, bubble.color.green, bubble.color.blue);
\t \t bubble.move();
\t \t bubble.display();
\t }
}
function Bubble(x, y) {
\t this.x = x;
\t this.y = y;
\t this.wh = 15;
\t this.speedX = random(1, 5);
\t this.speedY = random(1, 5);
\t //Individual Particle Creation
\t this.display = function() {
\t \t noStroke();
\t \t ellipse(this.x, this.y, this.wh, this.wh);
\t };
\t //Interactivity
\t this.clicked = function() {
\t \t var d = dist(this.x, this.y, mouseX, mouseY);
\t \t if (d < 8) {
\t \t \t this.wh = 100;
\t \t }
\t };
\t //Randomizes colors
\t this.color = {
\t \t red: random(255),
\t \t green: random(255),
\t \t blue: random(255)
\t };
\t //Particle Motion
\t this.move = function() {
\t \t //Motion in X direction
\t \t this.x += this.speedX;
\t \t //Bouncing back on X-axis
\t \t if (this.x > windowWidth || this.x < 0) {
\t \t \t this.speedX = -this.speedX;
\t \t }
\t \t //Motion in Y Direction
\t \t this.y += this.speedY;
\t \t //Bouncing back on Y-axis
\t \t if (this.y > windowHeight || this.y < 0) {
\t \t \t this.speedY = -this.speedY;
\t \t }
\t };
}
function windowResized() {
\t resizeCanvas(windowWidth, windowHeight);
}::-webkit-scrollbar{
\t display:none;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.10/p5.js"></script>
気泡のループと気泡のループ。気泡が同じでない場合は、衝突を確認してください... –