My inspiration of this project is from my first time experience of using processing—to build an application for visualizing Smith chart to help myself learning electromagnetic theory. When I think of generative art or animation by code, I always think about math. Therefore, I draw Cardioid learned in high school on paper and envision something like water wave or magnetic field… I try the equations on processing. And try to make some change of the equation. Finally I use this equation:
y=a*(3*cos(rad)-cos(3*rad));
x=a*(3*sin(rad)-sin(3*rad));
Next, I make the curves move out to intimate magnetic field. Finally, I tried 3D function to render the curves. After trials, I found white line reduce the sense of 3D but seems more harmony in the image.
int nFramesInLoop = 10;
int nElapsedFrames;
boolean bRecording;
String myName="wanfangdiao";
//===================================================
void setup() {
size (1500, 1500,P3D);
bRecording = false;
nElapsedFrames = 0;
frameRate (nFramesInLoop);
}
//===================================================
void keyPressed() {
// Press a key to export frames to the output folder
bRecording = true;
nElapsedFrames = 0;
}
//===================================================
void draw() {
// Compute a percentage (0...1) representing where we are in the loop.
float percentCompleteFraction = 0;
if (bRecording) {
percentCompleteFraction = (float) nElapsedFrames / (float)nFramesInLoop;
}
else {
float modFrame = (float) (frameCount % nFramesInLoop);
percentCompleteFraction = modFrame / (float)nFramesInLoop;
}
// Render the design, based on that percentage.
renderMyDesign (percentCompleteFraction);
// If we're recording the output, save the frame to a file.
if (bRecording) {
saveFrame("output/"+ myName + "-loop-" + nf(nElapsedFrames, 4) + ".png");
nElapsedFrames++;
if (nElapsedFrames == nFramesInLoop) {
bRecording = false;
}
}
}
//===================================================
void renderMyDesign (float percent) {
background(255);
strokeWeight(2);
//smooth();
for(int i=0; i<= 200; i+=20)
{
drawCardioid(percent*2, i);
}
}
void drawCardioid (float change, int startpoint)
{
float a=startpoint+10*change;
int centerX=750;
int centerY=750;
//
//stroke(0,30);
//noFill();
stroke(255);
float x, y;
float lastx=-2999;
float lasty=-2999;
for(float t=0; t <= 360; t+=5){
pushMatrix();
float rad=radians(t);
y=centerY-a*(3*cos(rad)-cos(3*rad));
x=centerX+a*(3*sin(rad)-sin(3*rad));
translate(x,y,0);
rotateZ(0.5);
fill(100,0,200,50);
box(40);
popMatrix();
}
}