Weird background stroke of a growing circle

Processing Coding Questions
1

Hello everyone! I’m very new to processing and have a few questions regarding this code:
It is supposed to be a growing and a shrinking circle, and it works, but the background is such a weird black pattern, that I don’t know how to get rid of. Does anyone have an idea? I’d like to incoorperate the variables into the void draw() but I don’t know how to do that

Bildschirmfoto 2022-04-25 um 16.27.01
Bildschirmfoto 2022-04-25 um 16.27.01991×981 220 KB 


 int c = 0;
 int d = 500;
 
 void setup() 
{
  size(500, 500);
  background(200);
}

void draw() { 



 if ( c <= 500) {
   
  fill(270, 72, 204);
  circle(width/2, height/2, c); 
  c += 1;
  fill(200, 91, 71);
  circle(width/2, height/2, d);
  d -= 2;
 
  } else {
    
   c = 0;
   d = 500;
     
  }
}
2

Repeat this line at the start of draw()

3

yes I’ve tried that and it works, but I want to add another thing to draw that would be covered by the background then

4

Just draw it in draw() after the background command

5

Hi

May this close to your demand

void setup () {
size (600,600);
colorMode(HSB);
}
void draw(){
for(int i= 500; i >0; i=i -2) {
  stroke((i/2) + (mouseX/3), 255,255);
ellipse (300,300,i,i);
}
}

Screenshot_2022-04-25-23-09-32-310
Screenshot_2022-04-25-23-09-32-310725×640 36 KB

Screenshot_2022-04-25-23-10-07-140
Screenshot_2022-04-25-23-10-07-140662×718 87 KB

1 Like
6

Hello @hannymymy,

The default strokeWeight is 1 pixel.

What your are seeing is the black stroke (outline) of the circle being painted to the screen and generating moiré patterns:

Try adding stroke(2) to setup() and see what happens.

Reference:

Remove strokeWeight(2) and try adding noStroke() to setup() and see what happens.

Reference:

Have fun!

:)

1 Like