# Trouble rotating an array of objects
**URL:** https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423
**Category:** Coding Questions
**Created:** [November 11, 2018, 6:29am UTC](https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423 "2018-11-11T06:29:08Z")
**Posts on this page:** 3
**Page:** 1
### Author:  [@Speedofox](https://discourse.processing.org/u/Speedofox)
#### Post date: [November 11, 2018, 6:29am UTC](https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423/1 "2018-11-11T06:29:08Z")
I have created an array of objects using a class call Triangle. How can I translate each of these objects so that they all spin independently on their own axis? So far I have gotten them all to rotate correctly but the are all at x=0 and y=0. Everytime I try and translate they only spin around the origin.
Here is the code:
let triangles = [];
let angle = 0;
let speed = 0.001;
let x;
let y;
function setup() {
createCanvas(400, 400);
for (let i = 0; i \< 10; i++) {
x = 0;
y = 0;
let s = random(20,50);
triangles[i] = new Triangle(x, y, s);
}
}
function draw() {
background(0);
for (let i = 0; i \< triangles.length; i++) {
triangles[i].show();
triangles[i].move();
}
}
class Triangle {
constructor(x, y, s) {
this.x = x;
this.y = y;
this.s = s;
}
show() {
stroke(255);
fill(200, 10);
triangle(this.x, this.y - this.s \* 5 / 6,
this.x - this.s, this.y + this.s / 2,
this.x + this.s, this.y + this.s / 2
);
}
move() {
rotate(angle);
angle+=speed;
}
}
---
### Author:  [@kll](https://discourse.processing.org/u/kll)
#### Post date: [November 11, 2018, 6:45am UTC](https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423/2 "2018-11-11T06:45:05Z")
only small idea of change: ( sorry its my NEON period )
```auto
let triangles = [];
let angle = 0;
let speed = 0.001;
let x, y, s;// _____________ change
function setup() {
createCanvas(400, 400);
for (let i = 0; i < 10; i++) {
x = 0;
y = i*10;// _____________ change
s = random(10, 50);
triangles[i] = new Triangle(x, y, s);
}
}
function draw() {
background(0, 200, 0);// _____________ change
translate(width/2, height/2); // _____________ add
for (let i = 0; i < triangles.length; i++) {
triangles[i].show();
triangles[i].move();
}
}
class Triangle {
constructor(x, y, s) {
this.x = x;
this.y = y;
this.s = s;
}
show() {
stroke(0, 0, 200);// _____________ change
fill(200, 200, 0);// _____________ change
triangle(this.x, this.y - this.s * 5 / 6,
this.x - this.s, this.y + this.s / 2,
this.x + this.s, this.y + this.s / 2
);
}
move() {
rotate(angle);
angle+=speed;
}
}
```
---
### Author:  [@Lexyth](https://discourse.processing.org/u/Lexyth)
#### Post date: [November 11, 2018, 9:57am UTC](https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423/3 "2018-11-11T09:57:01Z")
Rotation is pretty Messed up in processing…ok, technically it‘s how it should be, But it is annoying and someone should have added a simpler and direct method… like a transform method! Ok, now to how to fix your code. You have to translate the object before rotating it. If you want to rotate it around x=50, y=100, then do
```auto
obj.translate(50,100);
obj.rotate(radians(90));
```
You can also use
```auto
translate(50,100);
rotate(radians(90);
translate(-50,-100);
```
But it’s more code and affects every object drawn Till now since this draw() started.
And then there‘s also pushPop.
```auto
pushMatrix();
translate(50,100);
rotate(radians(90));
popMartix();
```
This works in a pretty specific way, and i don‘t wanna say something wrong… It‘s like the Transformations are done in a newly created Layer and pop deleted the Layer, But the changes stay.