[Solved] Drawing lots of circles

Processing Beginners
1

Hi,

I am new to Processing and still have lots to learn and there is a ton I don’t understand.

I watched the Youtube Coding Train video on For Loops and While Loops. In the video he uses a while loop to draw lot’s of lines.

I basically changed his code, as I am trying to draw lot’s of circles, but I only get one circle. I left in the code that draws lot’s of lines so you can see what I am referencing.

I think this is the first step to what I am trying to do, which is create a more complex animation around this, but I want to start with this concept.

Thanks you, I’m posting my code below.

int r = 0;
int x = 0;
int circles = 300;


void setup(){

size(600,600);
  background(255);
}



void draw(){
  



while (r  < width){
  ellipse(width/2, height/2, r, r);   // while loop
  r = r + 10;
}

while (x  < width){
  line(x, 0, x,height);   // while loop
  x = x + 20;
}


}
2 Likes
2

you can try a

  noFill();

in setup();

like:

int r = 0,x = 0;

void setup() {
  size(600, 600);
  background(255);
  noFill();
}

void draw() {
  while (r  < width) circle(width/2, height/2, r+=40); 
  while (x  < width) line(x+=20, 0, x, height); 
}

also i want show a FOR loop version

void setup() {
  size(600, 600);
  noFill();
  stroke(0);
}

void draw() {
  background(200,200,0);
  for ( int d=0;d < width;  d+=40) circle(width/2, height/2, d); 
  for ( int x=0;x < width;  x+=20) line(x, 0, x, height); 
  for ( int y=0;y < height; y+=20) line(0, y, width, y); 
}
2 Likes
3

Yes. noFill(); that’s it!!

thanks, Nick

4

In order to know what was happening, is just that you were drawing the circles but all in the same point, and the draws are done in the same order you write in your code, so the circles were being painted each one over the last one , that’s why you could only see the bigger one, you could also do drawing in the opposite order:

int r = 0;
int x = 0;
int circles = 300;

void setup(){

size(600,600);
  background(255);
}

void draw(){
  
while (r  < width){
  ellipse(width/2, height/2, width - r , width - r);   // while loop
  r = r + 10;
}

while (x  < width){
  line(x, 0, x,height);   // while loop
  x = x + 20;
}

}

:smiley:

2 Likes