I am rewriting my question on P5.js. The same I had asked on this video[https://youtu.be/5Q9cA0REztY] and Dan suggested me to post here.
I tried to do the same example myself. I was able to achieve many things except one … bubble turning on and Off. In your example, when you say b.intersects(other) and then you set color of intersecting bubble with b.changeColor(255). My question is how both intersecting bubbles change their color. In my case only one of the intersecting bubble changes its color.
Another question:
I am using for i = 0 loop syntax and this does not work same file for…of loop. My code below.
for (let i = 0; i < bubbles.length; i++) {
bubbles[i].show();
bubbles[i].move();
let overlapping = false;
for (let j = 0; j <= i; j++) {
if(i != j && bubbles[i].intersect(bubbles[j])){
overlapping = true;
}
}
if(overlapping) {
bubbles[i].changeColor(255);
} else {
bubbles[i].changeColor(0);
}
}
same code with for…of loop works. Dont understand how
for (let b of bubbles) {
b.show();
b.move();
let overlapping = false;
for (let other of bubbles) {
if (b != other && b.intersect(other)) {
overlapping = true;
}
}
if(overlapping) {
b.changeColor(255);
}
else {
b.changeColor(0);
}
}
