# Spin rectangles in place
**URL:** https://discourse.processing.org/t/spin-rectangles-in-place/31145
**Category:** Coding Questions
**Created:** [July 10, 2021, 12:43am UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145 "2021-07-10T00:43:27Z")
**Posts on this page:** 6
**Page:** 1
### Author:  [@seldomcoder](https://discourse.processing.org/u/seldomcoder)
#### Post date: [July 10, 2021, 12:43am UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145/1 "2021-07-10T00:43:27Z")
I have created a spiral of rectangles. Now, I want those rectangles to spin in their respective places. How do I go about it? I have attached the code here:
\< // import the library
import com.hamoid.\*;
// create a new VideoExport-object
VideoExport videoExport;
int nbr\_circles = 100;
float angle\_incr = radians(2);
int r = 0;
int fspeed = 1;
void setup() {
size(1024,1024);
smooth();
background(255);
rectMode(CENTER);
videoExport = new VideoExport(this);
videoExport.setFrameRate(1);
videoExport.startMovie();
}
void draw() {
fill(0);
float cx = width/2;
float cy = height/2;
float outer\_rad = width\*.45;
float sm\_diameter = 20;
for (int i = 1; i \<= 1000; i = i+10) {
float ratio = i/float(500);
float spiral\_rad = ratio \* outer\_rad_0.5;
float angle = i_angle\_incr;
float x = cx + cos(angle) \* spiral\_rad - Math.floorDiv(i,100);
float y = cy + sin(angle) \* spiral\_rad - Math.floorDiv(i,100);
```
rect(x, y, sm_diameter, sm_diameter);
```
}
videoExport.saveFrame()
}
void keyPressed() {
if (key == ‘q’) {
videoExport.endMovie();
exit();
}
} \>
---
### Author:  [@tabreturn](https://discourse.processing.org/u/tabreturn)
#### Post date: [July 10, 2021, 2:19am UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145/2 "2021-07-10T02:19:08Z")
Welcome @seldomcoder
Have you checked the _Transform_ section of the Processing reference? In particular, the [`pushMatrix()`](https://processing.org/reference/pushMatrix_.html), [`popMatrix()`](https://processing.org/reference/popMatrix_.html), and [`rotate()`](https://processing.org/reference/rotate_.html) functions.
---
### Author:  [@seldomcoder](https://discourse.processing.org/u/seldomcoder)
#### Post date: [July 10, 2021, 1:02pm UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145/3 "2021-07-10T13:02:28Z")
Hey @tabreturn - thank you…
Yes, I have tried that inside the for loops and also outside them but they are going out of the frame and forming a vinyl disc feel (which in itself is cool though)…but I want them spinning in place…can you please let me know where to add those?
---
### Author:  [@soegaard](https://discourse.processing.org/u/soegaard)
#### Post date: [July 10, 2021, 1:45pm UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145/4 "2021-07-10T13:45:49Z")
Before drawing each rectangle,
1. Use pushMatrix() to store the current coordianate system.
2. Use translate(centerx,centery) to put (0,0) in the center of the rectangle.
3. Use rotate(angle) to rotate the coordinate system.
4. Draw a rectangle with center (0,0).
5. Use popMatrix() to return to the original coordinate system.
See a complete example here: [Rotate \ Examples \ Processing.org](https://processing.org/examples/rotate.html)
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [July 10, 2021, 2:49pm UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145/5 "2021-07-10T14:49:57Z")
Hello,
Please format your code:
_[FAQ - Processing Foundation](https://discourse.processing.org/faq#format-your-code)_
There are resources (tutorials, references and examples) here:
_[https://processing.org/](https://processing.org/)_
Another example to look at:
_[Arm \ Examples \ Processing.org](https://processing.org/examples/arm.html)_
Try this in your code:
```auto
//Places rectangle at (x,y)
stroke(255, 0, 0);
rect(x, y, sm_diameter, sm_diameter);
//Translates rectangle at (0,0) to (x,y)
//Rotates rectangle; uncomment different combinations to see what this does
push();
//rotate(angle);
translate(x, y);
translate(10,10); //Shift it over to see the red rectangle!
//rotate(angle);
stroke(0, 255, 0);
rect(0, 0, sm_diameter, sm_diameter);
pop();
}
```
I commented the rotate()'s in the above code.
Uncomment them (try different combinations) to see what happens.
Explore the tutorials, references and examples to understand transformations.
For starters:
_[2D Transformations \ Processing.org](https://processing.org/tutorials/transform2d/)_
`:)`
---
### Author:  [@debxyz](https://discourse.processing.org/u/debxyz)
#### Post date: [July 10, 2021, 7:46pm UTC](https://discourse.processing.org/t/spin-rectangles-in-place/31145/6 "2021-07-10T19:46:50Z")
Hello @seldomcoder
Here is a really good tutorial by Abe Pazos illustrating several of the points by the previous commenters in this thread:
[![]( " - YouTube") ](https://www.youtube.com/watch?v=Fxu3I85xzMg)
Also, check his YouTube playlist for additional tutorials on rotation. Lots of useful information there…
Good luck!
🤓