Buna am o mica probleam si nu inteleg de ce nu functioneaza sa incerc sa explic.
Pe scurt dorect sa modific opacity la classa Particle toate particle sunt salvate in array particlesData.
In functia draw am folosit ctx.save() si ctx.restore() le-am facut ca sa afecteze doar codul dintre draw() si restore() ,in draw() am definit
ctx.globalAlpha = this.alpha
unde this.alpha este definit in constructor 1
Dupa aceaa in functia update() am definitt
this.alpha -= 0.02
unde se scade din alpha -0.02 in asa fel ar trebui sa creeze un efect si dispare in timp
Apoi iau toate particle si in animatia fac forEach ca sa accesezz toate particulele si pun conditiade mai jos
DAR NU MERGE si nu inteleg de ce .
Apoi cand se lovesc daca particle.alpha<=0 adica or disparut de pe ecran le sterg din particlesData
Sper sa se inteleaga ce dorect sa fac am incercat sa explic logica mea sper sa fie si buna
daca cineva poate intelege problema ar fi dragut din partea voastra sa ma ajutati
Orice ajutor este bine venit multumesc
const ctx = canvas.getContext("2d");
class Particle {
constructor(x, y, radius, color, velocity) {
this.x = x;
this.y = y;
this.radius = radius;
this.color = color;
this.velocity = velocity;
this.alpha = 1;
}
draw() {
ctx.save();
ctx.globalAlpha = this.alpha;
ctx.beginPath();
ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);
ctx.fillStyle = this.color;
ctx.fill();
ctx.restore();
}
update() {
this.draw();
this.x = this.x + this.velocity.x;
this.y = this.y + this.velocity.y;
this.alpha -= 0.01;
}
}
particlesData.forEach((particle, index) => {
if (particle.alpha <= 0) {
//delete particles if they are not visible >> particle.alpha <= 0 alpha
particlesData.splice(index, 1);
} else {
particle.update();
}
});