Hello! I’m trying to generate a sphere using circles of different sizes. I want it to be adapt if I change the NUM_RING variable. Right now, the my code creates overlapping circles, and I don’t get why. Maybe it’s somthing I don’t understand about the map function.
let i = map(this.layer, 0, this.NUM_RING, 0, TWO_PI);
let x = sin(i) * this.ballRadius;
let y = cos(i) * this.ballRadius;
this.ringRadius = y;
this.zPositionOffset = x;
In a 2D circle x has cos, y has sin, not vice versa
Not sure here tho
Maybe you should use separate i‘s for x and y because your z (derived from x) should go only from 0 to PI and not TWO_PI
You may want to change variable names to better represent what they are used for.
This was a very quick morning exercise and I recycled some variables.
Use the code as a “hint” only.
Oh wow that works! thank you so much! I’m still having a hard time figuring out why the angle should not be from 0 to TWO_PI though Also, why did you devide the rad by two for the y variable?
Thanks so much
Does this help?
I used circle() to draw my circles.
The circle() function uses diameter:
diameter = 2*radius
let x = cos(angle) * 2*ballRad;
let y = sin(angle) * ballRad;
It is helpful to use print() statements to understand code:
I use them all the time in development!
I suggest you find a good tutorial on trigonometry.
Do some experimenting and then apply that to your code.
Yeah, when you look at the cos curve, for a full circle (aka TWO_PI) it goes up and down again (hence you had the double lines!). Using -PI/2 (or HALF_PI) to HALF_PI avoids this. In this segment of the cos graph it’s straight in one direction.
so that the sphere is round and not ellipsoid
An animated gif sweeping from -PI/2 to PI/2 and drawing the circles:
I added to the original code.