# Different values for position when rotating around a circle
**URL:** https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395
**Category:** Coding Questions
**Created:** [August 15, 2019, 10:53am UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395 "2019-08-15T10:53:54Z")
**Posts on this page:** 9
**Page:** 1
### Author:  [@fedpep](https://discourse.processing.org/u/fedpep)
#### Post date: [August 15, 2019, 10:53am UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/1 "2019-08-15T10:53:54Z")
Hello, I was refactoring some old code and I noticed a problem with this sketch. It starts getting weird when there are 7 or 11, 13 (ad so on…) values in the array. I’m sure that’s because there are floating variables but I tried to round them, converting to int etc… but wasn’t able to solve the issues. Any help would be much appreciated.
```auto
int lineLength = 300;
int[] values = new int[0];
int[] val = new int[0];
void setup() {
size(800, 800);
pixelDensity(2);
values = append(values, int(random(100)));
val = append(val, int(random(100)));
}
void draw() {
background(50);
pushMatrix();
translate(width/2, height/2);
rotate(radians(180)); // rotate everything to put the first value at the top - center.
// DRAW GUI
float intraLineAngle = 360/values.length;
float angleInRadians = radians(intraLineAngle);
noFill();
stroke(150, 50);
for (int i = 10; i <= 100; i += 10) {
float diam = map(i, 0, 100, 0, lineLength*2);
ellipse(0, 0, diam, diam);
}
stroke(150);
for (int i = 0; i < values.length; i++) {
float posx = lineLength * sin(i*angleInRadians);
float posy = lineLength * cos(i*angleInRadians);
line(0, 0, posx, posy);
fill(255);
}
// DRAW FIRST CHART
beginShape();
for (int i=0; i < values.length; i++) {
float posx = map(values[i], 0, 100, 0, lineLength) * sin(i*angleInRadians);
float posy = map(values[i], 0, 100, 0, lineLength) * cos(i*angleInRadians);
fill(255, 0, 0, 50);
stroke(255, 0, 0);
vertex(-posx, posy); // -pos to rotate correctly clockwise
}
endShape(CLOSE);
popMatrix();
}
void mouseClicked() {
values = append(values, int(random(100)));
val = append(val, int(random(100)));
}
```
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [August 15, 2019, 10:59am UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/2 "2019-08-15T10:59:56Z")
Imo for x you use cos and for y sin
---
### Author:  [@fedpep](https://discourse.processing.org/u/fedpep)
#### Post date: [August 15, 2019, 11:06am UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/3 "2019-08-15T11:06:19Z")
Hi @Chrisir thanks, I didn’t notice that. Anyway, I changed sin to cos and viceversa but the issue is still there
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [August 15, 2019, 11:15am UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/4 "2019-08-15T11:15:15Z")
> [@fedpep](#):
>
> int values = new int[0];
> int val = new int[0];
It could be rounding errors
Try to make those to float and don’t use int() with random
---
### Author:  [@fedpep](https://discourse.processing.org/u/fedpep)
#### Post date: [August 15, 2019, 11:34am UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/5 "2019-08-15T11:34:06Z")
I changed the code as this:
```auto
int lineLength = 300;
float[] values = new float[0];
float[] val = new float[0];
void setup() {
size(800, 800);
pixelDensity(2);
values = append(values, random(100));
val = append(val, random(100));
}
void draw() {
background(50);
pushMatrix();
translate(width/2, height/2);
rotate(radians(-90)); // rotate everything to put the first value at the top - center.
// DRAW GUI
float intraLineAngle = 360/values.length;
float angleInRadians = radians(intraLineAngle);
noFill();
stroke(150, 50);
for (int i = 10; i <= 100; i += 10) {
float diam = map(i, 0, 100, 0, lineLength*2);
ellipse(0, 0, diam, diam);
}
stroke(150);
for (int i = 0; i < values.length; i++) {
float posx = lineLength * cos(i*angleInRadians);
float posy = lineLength * sin(i*angleInRadians);
line(0, 0, posx, posy);
fill(255);
}
// DRAW FIRST CHART
beginShape();
for (int i=0; i < values.length; i++) {
float posx = map(values[i], 0, 100, 0, lineLength) * cos(i*angleInRadians);
float posy = map(values[i], 0, 100, 0, lineLength) * sin(i*angleInRadians);
fill(255, 0, 0, 50);
stroke(255, 0, 0);
vertex(posx, -posy); // -pos to rotate correctly clockwise
}
endShape(CLOSE);
popMatrix();
fill(255);
text(values.length, 100, 100);
noFill();
}
void mouseClicked() {
values = append(values, random(100));
val = append(val, random(100));
}
```
But it doesn’t seem to work. I think it’s a rounding error that need to be addressed in the map of the values xpos and ypos but, as I said, I tried round(), int() etc… but the problem persists.
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [August 15, 2019, 12:01pm UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/6 "2019-08-15T12:01:53Z")
> [@fedpep](#):
>
> cos(i\*angleInRadians);
This looks suspicious
Shouldn’t you multiply by i before converting to radians?
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [August 15, 2019, 1:24pm UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/7 "2019-08-15T13:24:42Z")
here:
use `360.0` instead of `360`
`float intraLineAngle = 360.0/values.length; // use 360.0 instead of 360`
(reason: when no value is float on the right side of the `=` sign (360 and values.length are both integer), but integer values, Java tends to make the result integer as well (casting) iirc. Hence when 360 is not divisible by values.length, the numbers of lines are too small, because they get rounded)
AND I used `radians(i*intraLineAngle)` instead
Chrisir
full sketch :
```auto
int lineLength = 300;
float[] values = new float[0];
float[] val = new float[0];
void setup() {
size(800, 800);
pixelDensity(2);
values = append(values, random(100));
val = append(val, random(100));
}
void draw() {
background(50);
pushMatrix();
translate(width/2, height/2);
rotate(radians(-90)); // rotate everything to put the first value at the top - center.
// DRAW GUI
float intraLineAngle = 360.0/values.length; // use 360.0 instead of 360
//float angleInRadians = radians(intraLineAngle);
noFill();
stroke(150, 50);
for (int i = 10; i <= 100; i += 10) {
float diam = map(i, 0, 100, 0, lineLength*2);
ellipse(0, 0, diam, diam);
}
stroke(150);
for (int i = 0; i < values.length; i++) {
float posx = lineLength * cos(radians(i*intraLineAngle));
float posy = lineLength * sin(radians(i*intraLineAngle));
line(0, 0, posx, posy);
fill(255);
}
// DRAW FIRST CHART
beginShape();
for (int i=0; i < values.length; i++) {
float posx = map(values[i], 0, 100, 0, lineLength) * cos(radians(i*intraLineAngle));
float posy = map(values[i], 0, 100, 0, lineLength) * sin(radians(i*intraLineAngle));
fill(255, 0, 0, 50);
stroke(255, 0, 0);
vertex(posx, -posy); // -pos to rotate correctly clockwise
}
endShape(CLOSE);
popMatrix();
fill(255);
text(values.length, 100, 100);
noFill();
}
void mouseClicked() {
values = append(values, random(100));
val = append(val, random(100));
}
```
---
### Author:  [@fedpep](https://discourse.processing.org/u/fedpep)
#### Post date: [August 15, 2019, 1:36pm UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/8 "2019-08-15T13:36:52Z")
Thank you very much! This seems to work perfectly
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [August 15, 2019, 1:39pm UTC](https://discourse.processing.org/t/different-values-for-position-when-rotating-around-a-circle/13395/9 "2019-08-15T13:39:28Z")
You are most welcome!
Chrisir