Why this rectangle disappear?

Processing Coding Questions
1 
void setup(){
  size(1000,1000,P3D);
} 

void draw(){
  noStroke();
    fill(0, 20);
    rect(0, 0, width, height);
    pushMatrix();
         pushStyle();
           translate(500, 500);
           rotate(PI/2 + PI/2);
           rectMode(CENTER);
           rect(0, 0, 100, 400);
     popStyle();
     popMatrix();
}

If I understand correctly, translate(500,500) will translate (0,0) into position (500,500). rotate(PI/2 + PI/2) will rotate the coordinate system clock-wise for PI radians, then a rectangle with respect to this new coordinate system is drawn, with center (0,0), width and height 100 and 400. When I tried the above code, I did see the rectangle, it disappeared and then with a black screen. Could anyone please let me know how to understand this?

1 Like
2

Actually, translate(500,500) turns (0,0) into (-500,-500). The translate function moves the graph over by the amount specified(500 right, 500 down). To get the results you are looking for, change
translate(500,500);
into
translate(-500,-500);

3

Also, the rectangle is black.

4

Hello,

Use background() at start of draw() to set a background.

You are filling entire sketch window with a rect() that is black and drawing a rect() that is black over it.

Set different colors with fill() before each shape to see them.

References:
https://processing.org/tutorials/
https://processing.org/tutorials/drawing/
https://processing.org/tutorials/transform2d/
https://processing.org/reference/draw_.html
https://processing.org/reference/background_.html
https://processing.org/reference/fill_.html

:slight_smile:

1 Like