### Lesson 41

— golan @ 12:06 pm

Reproduce this figure. It consists of two (stretched) 100×100 squares which have been rotated by 30 degrees and -30 degrees, respectively. You may find it helpful to interactively print the mouse coordinates in order to test out various translations, etc. Note that there are several possible solutions.

Here’s one solution:

```void setup() {
size(400, 400);
noLoop();
}

void draw() {
background(129);

pushMatrix();
translate (234,0);
scale (2.0, 1.0);
fill (255);
rect (0, 0, 100, 100);
fill (0);
text ("ONE", 5, 15);
popMatrix();

pushMatrix();
scale(1.0, 2.0);
translate (0, 40);
fill (255, 128);
rect(0, 0, 100, 100);
fill (0);
text ("TWO", 5, 15);
popMatrix();

// saveFrame("transforms.jpg");
}```

Declare, allocate and initialize an array of 5 floats. Init them with random numbers between 0-255. Use these floats to control the gray-level color of 5 corresponding circles. Now create a time-based program in which, on each time-step (draw() call), the values in these arrays are increased by 1. When the value stored in each position is greater than 255, have it reset to 0.

```float myArray[]; // declaration
int nCircles = 5;

void setup(){
size (500,200);
smooth();
myArray = new float[nCircles];
for (int i=0; i 255){
myArray[i] = 0;
}
}
}

void drawFromMyArray(){
for (int i=0; i
```