Processing Month, Day 14 - Manipulating Circles
Yesterday we’ve drawn regular polygons. If you draw a regular polygon with 360 points, you get something that gets really close to a circle. If we take that same function, and manipulate the radius with a sinewave or cosinewave, we can get really interesting results. This is the full function to draw a manipulated circle:
void circleShape( float radius, int numSpikes )
{
float amp = random( 0.05, 0.5 );
beginShape();
for (int i = 0; i < 360; i++) {
float a = (1 + amp * cos(radians(i * numSpikes)));
float x = cos(radians(i)) * radius * a;
float y = sin(radians(i)) * radius * a;
vertex(x, y);
}
endShape(CLOSE);
}
I’m drawing the circles in a grid of 50 pixels. You can do this easily with nested for-loops. In the examples, I tried drawing them with a different radius to get interesting results.
for (int i = 0; i < 10; i++) {
for (int j = 0; j < 9; j++) {
pushMatrix();
translate( i * 50, j * 50 );
rotate( random( TWO_PI ));
circleShape( r, floor(random(3, 6)) );
popMatrix();
}
}
Examples
The sketch is also available on OpenProcessing.






Download
Download the example for Procesing Day 14, Manipulating Circles.
Related Articles
- Processing Month (Blog)
- Processing Month, Day 13 - Regular Polygons (Blog)
- Processing Month, The Overview (Blog)
Browse Articles
Comments (0)
Popular Articles
- Introduction to openFrameworks
- Creating 3D Shapes with Hemesh
- Mirroring Video with openFrameworks
- An Introduction to colorLib
- How to create a FullScreen iPhone Application
Popular Tags
- processing (95)
- software (50)
- art (48)
- web design (40)
- photography (39)