new icn messageflickr-free-ic3d pan white

Draw a Circle (with Processing)

Ever since I started using Processing, I've wanted to understand how to draw a circle to the screen using a for loop. Now, thanks to an extended period off my feet (owing to rather severe knee injury) I finally understand why.


The deal is, circles are a representation of a curve. To draw them to the screen you need to know how to translate points on a curve into points in the traditional representation of flat space - i.e., X and Y.


(I'm sorry, there really isn't a great way to say it in a non-nerdy way. Or if there is, I'm not really sure what it is. If you've got a cooler way to say it, please let me know!)


I used this knowledge to make this representation of drawing a circle. Each frame has a number of dots; you can see that the simple equasion I used does not equally spread out it's points along the circle at higher numbers.


This is because the highest number of dots is 360 - the same as the number of degrees in a full circle. If the number of dots does not divide into 360 cleanly, you get strange effects in the spacing of the dots.


While I'm happy to have finally achieved this, I'm fully aware that this is no great feat in the world of Processing. But, after being stumped by this for years, I'm glad to have got it out into the real world.


You can read a little more about it, and download the source code and stand-alone applications for it, at

1 fave
Uploaded on June 12, 2008