# Different function to every ellipse

Hi, I’m doing this thing, trying to make every ellipse appear and disappear with the same function but in a different time, like if every ellipse is in a different moment of the sine function.
I can write the function as I want, but I don’t know how to make the difference with every ellipse.

``````float a;
float b;
void setup() {
size(900, 900);
}

void draw() {
background(227,227,227);
a=(220+ sin(b)*227)/2;
noStroke();
fill(227,227,a);
for (int y=60; y<height; y+=60) {
for (int x=60; x<width; x+=60) {
ellipse(x, y, 60, 60);
}
}
b+=0.02;
}
``````

I’ve tried with random, but I don’t know how to make it right:

``````float a;
float b;
float c;
void setup() {
size(900, 900);
c=random(100);
}

void draw() {
background(227,227,227);
a=(2200+ sin(b+c)*227)/2;
noStroke();
fill(227,227,a);
for (int y=60; y<height; y+=60) {
for (int x=60; x<width; x+=60) {
ellipse(x, y, 60, 60);
}
}
b+=0.02;
}
``````

I thank any help

1 Like
``````float a;
float b;
void setup() {
size(900, 900);
}

void draw() {
background(227,227,227);
noStroke();

for (int y=60; y<height; y+=60) {
for (int x=60; x<width; x+=60) {
a=(220+ sin((b+(x+y)/10))*227)/2;
fill(227,227,a);
ellipse(x, y, 60, 60);
}
}
b+=0.02;
}
``````

The key lies in setting the fill color for every circle individually. That means these two lines of code need to be executed for every ellipse individually:

``````a=(220+ sin(b+((x+y)/10))*227)/2;
fill(227,227,a);
``````

As you can see, (x+y)/10 is added to b in the sin() function. It’s as if a circle with a high x and y position is further ahead in time than one with a low x and y position. This creates this diagonal gradient. You could also add just x or y, or any other mathematical combination of the two.

1 Like

And here is a proper fix with a few more nice changes. This one assigns each circle it’s own “starting position” along the sin curve in a 2D array.

``````float a;
float[][] b;
void setup() {
size(900, 900);
b = new float[(height-60)/60][(width-60)/60];
for (int y=0; y<(height-60)/60; y++) {
for (int x=0; x<(width-60)/60; x++) {
b[x][y] = random(TWO_PI);
}
}
}

void draw() {
background(227, 227, 227);
noStroke();
for (int y=0; y<(height-60)/60; y++) {
for (int x=0; x<(width-60)/60; x++) {
a=(220+ sin(b[x][y])*227)/2;
fill(227, 227, a);
ellipse(60 + 60 * x, 60 + 60 * y, 60, 60);
b[x][y]+=0.02;
}
}
}
``````
1 Like

Thank you, WeinSim and TfGuy44,
the solution more concrete I was looking for is TfGuy44’s, it’s perfect, I didn’t know that could be done. Now understand more things, even about the sine function.

Thank you very much!