Pixel Joint Forum: Math meets art.

Message

   OK I plan to list some usefull math to help make pixel art. 
 -Play along it's more text than trouble.-

This formula will find a point a given distance and direction away from a base point.

startx= the starting pointx
starty= the starting pointy
radius= the distance away you want the new point

ok now we have to fid the new points x and y

endx=basex+cos(angle)*radius

endy=basey+sin(angle)*radius

          Why would you use this you ask? Well lets say you have objects you want arranged in a circle around a central point, now you simply incriment the angles and use the same starting point and you have evenly spaced objects.

Also you can use this to make PERFECT iso circles you simply use the radius/2 for the y radius.

Lets try it out and see how it works.

Ok we have a pixel ar (12,3) and we want to put a planet at a 45 degree angle away from it with a radius of 24 pixels.

Ok we know our base point x and y
basex=12
basey=3
radius=24
angle= 45

endx=basex+cos(angle)*radius - this will  find the new x coordinate
endy=basey+sin(angle)*radius - this will  find the new y coordinate
endx=12+cos(45)*24 = 28.97 rounded to 29  *note never truncate 
endy=3+sin(45)*24 = 19.97 rounded to 20

Hope it helps! I'll have more soon.

this could be used to make perfect triangles and other ngons by using more than one angle.

Lets say we want to make a perfect triangle.
We would use the angles 0,120,240 and our base point would reside in the middle. If we want to rotate the direction of the triangle we simply add the same rotation angle to all of the angles. If you want to rotate your triangle 10 degrees the angles for the formula would be (10,130,250).

You use the same base point for basex and basey, you only change the angle variable. If you are willing to spend the time you can get breat results.

It gets a bit more diffcult when you are working with even widths as they have no central point, you have to use the four points that form the middle "cluster".

Edited by Pixel_Outlaw - 17 October 2006 at 9:12pm

Author	Message
Pixel_Outlaw Commander Joined: 01 September 2005 Online Status: Offline Posts: 3829	Topic: Math meets art. Posted: 17 October 2006 at 9:03pm
	OK I plan to list some usefull math to help make pixel art. -Play along it's more text than trouble.- This formula will find a point a given distance and direction away from a base point. startx= the starting pointx starty= the starting pointy radius= the distance away you want the new point ok now we have to fid the new points x and y endx=basex+cos(angle)radius endy=basey+sin(angle)radius Why would you use this you ask? Well lets say you have objects you want arranged in a circle around a central point, now you simply incriment the angles and use the same starting point and you have evenly spaced objects. Also you can use this to make PERFECT iso circles you simply use the radius/2 for the y radius. Lets try it out and see how it works. Ok we have a pixel ar (12,3) and we want to put a planet at a 45 degree angle away from it with a radius of 24 pixels. Ok we know our base point x and y basex=12 basey=3 radius=24 angle= 45 endx=basex+cos(angle)radius - this will find the new x coordinate endy=basey+sin(angle)radius - this will find the new y coordinate endx=12+cos(45)24 = 28.97 rounded to 29 note never truncate endy=3+sin(45)*24 = 19.97 rounded to 20 Hope it helps! I'll have more soon. this could be used to make perfect triangles and other ngons by using more than one angle. Lets say we want to make a perfect triangle. We would use the angles 0,120,240 and our base point would reside in the middle. If we want to rotate the direction of the triangle we simply add the same rotation angle to all of the angles. If you want to rotate your triangle 10 degrees the angles for the formula would be (10,130,250). You use the same base point for basex and basey, you only change the angle variable. If you are willing to spend the time you can get breat results. It gets a bit more diffcult when you are working with even widths as they have no central point, you have to use the four points that form the middle "cluster". Edited by Pixel_Outlaw - 17 October 2006 at 9:12pm

	IP Logged

jalonso Admiral Joined: 29 November 2022 Online Status: Offline Posts: 13537	Posted: 17 October 2006 at 9:51pm
	It needs some AA and maybe some dithering too
	PJs FAQ <•> Sticky Reads
	IP Logged

Blueberry_pie Rear Admiral Joined: 24 July 2015 Online Status: Offline Posts: 2176	Posted: 18 October 2006 at 3:35am
	I am confused by the lack of pretty pictures!
	IP Logged

Pixel_Outlaw Commander Joined: 01 September 2005 Online Status: Offline Posts: 3829	Posted: 18 October 2006 at 6:39am
	sorry guys I have to go to school, I'll add more this afternoon.

	IP Logged

Pixel_Outlaw Commander Joined: 01 September 2005 Online Status: Offline Posts: 3829	Posted: 18 October 2006 at 2:13pm
	Ok this is a TRUE iso cube made with 6 angle calculations and one centerpoit. The radius is 32 pixels. If you wanted to make it point up you would just take the angles shown here and add 15 degrees to each angle. This is not the main point for this though. These cubes don't tesselate well this is just a demo. Just to give you an idea of what you can do. I used the radius of 32 and the angles of a hexagon to find the points, then I simply connected them. Really you could do professionaly made 3D art if you have the time you can make any polygon or any polyhedron. Edited by Pixel_Outlaw - 18 October 2006 at 2:17pm

	IP Logged

Pixel_Outlaw Commander Joined: 01 September 2005 Online Status: Offline Posts: 3829	Posted: 18 October 2006 at 2:22pm
	*Originally posted by Pixel_Outlaw* Ok this is a TRUE iso cube made with 6 angle calculations and one centerpoit. The radius is 32 pixels. If you wanted to make it point up you would just take the angles shown here and add 15 degrees to each angle. This is not the main point for this though. These cubes don't tesselate well this is just a demo. Just to give you an idea of what you can do. I used the radius of 32 and the angles of a hexagon to find the points, then I simply connected them. Really you could do professionaly made 3D art if you have the time you can make any polygon or any polyhedron. There are many uses for this. Ok you want your wheel to be divided into equal sections for spokes? Simply decide how many spokes you want then use 360/num_angles to get the incriment value for each spoke.

	IP Logged

Resources and Support
Pixel Joint Forum : The Lounge : Resources and Support