javascriptを学び始めたばかりの初心者です 背景で小さい丸が上がり続け、'a'をタイプするとマウスの位置から波紋のように円が広がっていくコードを作りました この波紋が当たった丸を消して再び下から上がるようにしたいのですが、どうコードを組み込めばいいですか？ let motions = []; let numberOfTriangles = 300; let positionX = []; let positionY = []; let velocityY = []; let size = []; let colorIndex =[]; let colorList = [ [150, 180, 200,80], [150,130,255,80], [150,100, 220,80] ]; function setup() { createCanvas(windowWidth,windowHeight); for(let i = 0; i < numberOfTriangles; i++) { positionX[i] = random(width); positionY[i] = random(height); velocityY[i] = random(3, 10); size[i] = random(10); colorIndex[i] = floor(random(colorList.length)); } } function draw() { background(230,255,255); for (let i = 0; i < motions.length; i++) { motions[i].draw(); if (motions[i].lifetime < 0) { motions.splice(i, 1); } } for(let i = 0; i < numberOfTriangles; i++) { positionY[i] -= velocityY[i]; fill(colorList[colorIndex[i]]); strokeWeight(); ellipse(positionX[i],positionY[i],size[i]); if (positionY[i] < - size[i]) { positionY[i] = height + size[i]; } } } function keyTyped() { if (key == 'a') { motions.push(new MotionA()); } } class MotionA { constructor() { this.positionX2 = mouseX; this.positionY2 = mouseY; this.size2 = random(100); this.color = color(0, random(150,255), 255, 200); this.lifetime = 200; } draw() { this.size2 += 10; this.lifetime--; noFill(); stroke(this.color); ellipse(this.positionX2, this.positionY2, this.size2); }
JavaScript
