We are about to switch to a new forum software. Until then we have removed the registration on this forum.
I got rid of the code that didn't work, but with the intersect function below.... I tried to put it in the var bubble area like the display: function that is in there.. but I would get the error in the safari console as the title of this post above.
In other words, does any one know why I can't put this intersect in the var bubble area like this:
intersect: function() {
var d = dist(this.x, this.y, ellip.x, ellip.y);
if (d < this.r + ellip.rad) {
return true;
} else {
return false;
}
}
this code should work below but I'm trying to interact with all four bubble objects one at a time... but to start with I think I need the intersect function in the var bubble area, then I can write another function where I change the colors (or change the size) of the four bubbles one at a time as the ellip goes through the bubbles... I already wrote all that but it didn't work so I deleted it and may start over.
var ellip = {
x: 0,
y: 200,
rad: 10,
show: function() {
ellipse(this.x, this.y, this.rad);
}
}
var bubble = {
x: 150,
y: 200,
r: 50,
display: function() {
noStroke();
fill(col);
ellipse(this.x, this.y, this.r, this.r);
ellipse(this.x*2, this.y, this.r, this.r);
ellipse(this.x*3, this.y, this.r, this.r);
ellipse(this.x*4, this.y, this.r, this.r);
}
}
function intersect(){
var d = dist(bubble.x, bubble.y, ellip.x, ellip.y);
if (d < bubble.r + ellip.rad) {
bubble.r += .3;
// return true;
//} else {
// return false;
//}
}
}
function setup() {
createCanvas(800, 400);
col = color(214, 42, 29);
}
function draw() {
background(200);
bubble.display();
intersect();
noStroke();
fill(0);
ellip.show();
ellip.x += 2;
}
Answers
You have an extra "}" in your second block of code in your intersect function if you enable all the lines there inside that function.
Try this:
Notice you need to divide your radius by two. By default when you declare an ellipse, you are defining the actual diameter and not the radius: http://p5js.org/reference/#/p5/ellipse
If you want to work with radius, then you need to check ellipseMode: http://p5js.org/reference/#/p5/ellipseMode
Kf
function intersect() { return dist(bubble.x, bubble.y, ellip.x, ellip.y) < bubble.r + ellip.rad >> 1; }
:ar!What I'm wondering is why do I get this error when I try to move the intersect function into the bubble object?
https://openprocessing.org/sketch/418089
@ line # 22
intersect: intersect() {
the 2nd intersect should befunction
instead! #-oBtW, why don't you use a more simplified syntax like I did in my previous reply:
intersect() { return dist(bubble.x, bubble.y, ellip.x, ellip.y) < bubble.r + ellip.rad >> 1; }
Much less boilerplate than:
intersect: function () { return dist(bubble.x, bubble.y, ellip.x, ellip.y) < bubble.r + ellip.rad >> 1; }
This 1 is nice too. But doesn't work for OOP though:
intersect: () => dist(bubble.x, bubble.y, ellip.x, ellip.y) < bubble.r + ellip.rad >> 1;
Hi GoToLoop,
I noticed those errors (intersect: intersect) in my code just after I posted.. so I fixed them but I still get the same error. It is the same error I got yesterday in Safari. I put in your code above and still get the error message.
https://openprocessing.org/sketch/418089