\u00a0<\/p>\n
Maths:<\/strong><\/em><\/p>\n Imagine a square, with side length a<\/strong>.<\/p>\n Our octagon will fit in this square.<\/p>\n We will call the length of a side of the octagon b<\/strong>.<\/p>\n \u00a0<\/p>\n Now you put a<\/strong> into this equation:<\/p>\n Which can also be written as:<\/p>\n And you get b<\/strong>.<\/p>\n Now, round b<\/strong> to the nearest number. We can\u2019t be dealing with fractions of pixels now, can we?<\/p>\n Now you have b<\/strong>, we can draw the octagon.<\/p>\n \u00a0<\/p>\n Drawing:<\/strong><\/em><\/p>\n For this example, our reference point will be in the center of the octagon, which is also the center of our imaginary square.<\/p>\n Our first 2 co-ordinates will be a\/2<\/strong> up and b\/2<\/strong> to either side.<\/p>\n For the sides, it will be a\/2<\/strong> to the side and b\/2<\/strong> up or down.<\/p>\n Then, draw lines between the co-ordinates to finish the octagon.<\/p>\n And there you have a regular octagon!<\/p>\n \u00a0<\/p>\n Pseudo code:<\/strong><\/em><\/p>\n Initialize<\/b>:<\/strong><\/p>\n size = (length of side of square) Loop:<\/strong><\/p>\n coord_1x = x \u2013 oct_side\/2 \/\/draw_line(from_x,from_y,to_x,to_y)<\/em><\/p>\n draw_line(coord_1x,coord_1y,coord_2x,coord_2y) \u00a0<\/p>\n And that\u2019s how to draw a perfect octagon!<\/p>\n Coming soon: How to draw a perfect hexagon!<\/strong><\/p>\n \u00a0<\/p>\n To those interested in the maths involved to get the equation:<\/p>\n \u00a0<\/p>\n I originally calculated this to be able to draw the Aperture Science logo by hand, but I also saw the use of it on the computer!<\/p>\n Tags: code<\/a>, drawing<\/a>, maths<\/a>, octagon<\/a>, tutorial<\/a><\/p>","time":"November 11th, 2014 4:45 am","title":"How to draw a Perfect Octagon!","title_was_empty":false}![\"001\"](\"\/data\/posts\/2014\/11\/e0c56219f57f06f0102c7a99d555c337.png\")
<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n<\/a><\/p>\n