今天代码哥,要跟大家从传统文化 “太极” 聊起 ……
太极
是阐明宇宙从无极而太极,以至万物化生的过程。
太极即为天地未开、混沌未分阴阳之前的状态。易经系辞:“是故易有太极,是生两仪”。两仪即为太极的阴、阳二仪。
本人十分赞同和认可道家的哲学概念,每次看到旋转的太极图,总能无穷的联想,其言简意赅,阐述着这个世界和社会的运行规律。
于是想用 Processing 绘制一个动态的 TaiChi 图,不断的提醒自己不要忘记这个世界的本质(一生二,二生三,三生万物)。
构思
先构建一张平面的静态图。一张太极图由半圆和圆,黑色和白色共同组成。
代码语言:javascript复制 translate(width/2, height/2);
fill(230,5);
rect(-width/2, -height/2, width, height);
fill(0);
arc(0, 0, width, height, PI/2, PI*3/2);
fill(255);
arc(0, 0, width, height, -PI/2, PI/2);
noStroke();
arc(width/4 * cos(-PI/2),height/4 * sin(-PI/2),width/2,width/2,PI/2, PI*3/2);
fill(0);
arc(width/4 * cos(PI/2),height/4 * sin(PI/2),width/2,width/2,-PI/2, PI/2);
fill(255);
ellipse(width/4 * cos(PI/2),height/4 * sin(PI/2),width/10, width/10);
fill(0);
ellipse(width/4 * cos(-PI/2),height/4 * sin(-PI/2),width/10,width/10);
使太极图不断旋转
想使圆不断的旋转,那么就要分析,在圆旋转的过程中,半圆弧变化的规律,圆心的坐标变化的规律。
这时,只需要引入:一个角度变化变量deltaAngle,通过调节deltaAngle的大小来控制太极旋转的速率。通过调节不同的速率,可以发现一些有意思的现象。
- 30x
- 60x
- 90x
随着旋转频率的增加,可以观察到有意思的现象。
代码
代码语言:javascript复制float deltaAngle = 0.0f;
void setup(){
size(800,800);
}
void draw(){
translate(width/2, height/2);
fill(230,5);
rect(-width/2, -height/2, width, height);
deltaAngle = -TWO_PI/360 * 1;
// 绘制两个外半圆
fill(0);
arc(0, 0, width, height, PI/2 deltaAngle, PI*3/2 deltaAngle);
fill(255);
arc(0, 0, width, height, -PI/2 deltaAngle, PI/2 deltaAngle);
// 绘制两个内半圆
noStroke();
arc(width/4 * cos(-PI/2 deltaAngle),height/4 * sin(-PI/2 deltaAngle),width/2,width/2,PI/2 deltaAngle, PI*3/2 deltaAngle);
fill(0);
arc(width/4 * cos(PI/2 deltaAngle),height/4 * sin(PI/2 deltaAngle),width/2,width/2,-PI/2 deltaAngle, PI/2 deltaAngle);
// 绘制两个圆
fill(255);
ellipse(width/4 * cos(PI/2 deltaAngle),height/4 * sin(PI/2 deltaAngle),width/10,width/10);
fill(0);
ellipse(width/4 * cos(-PI/2 deltaAngle),height/4 * sin(-PI/2 deltaAngle),width/10,width/10);
}
-END-
专栏作者:恒成立
上海理工大学 光电硕士
热爱折腾与创造
一个人的探索有些孤单,
一群人的探索会更有意思。
加入社群交流
在这里 (扫码)!