用 Processing 绘制 「太极图」| 数字艺术专栏
用 Processing 绘制 「太极图」| 数字艺术专栏
mixlab
发布于 2021-03-25 12:30:55
发布于 2021-03-25 12:30:55
今天代码哥，要跟大家从传统文化 “太极” 聊起 ……
太极
是阐明宇宙从无极而太极，以至万物化生的过程。
太极即为天地未开、混沌未分阴阳之前的状态。易经系辞：“是故易有太极，是生两仪”。两仪即为太极的阴、阳二仪。
本人十分赞同和认可道家的哲学概念，每次看到旋转的太极图，总能无穷的联想，其言简意赅，阐述着这个世界和社会的运行规律。
于是想用 Processing 绘制一个动态的 TaiChi 图，不断的提醒自己不要忘记这个世界的本质（一生二，二生三，三生万物）。
构思
先构建一张平面的静态图。一张太极图由半圆和圆，黑色和白色共同组成。
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
随着旋转频率的增加，可以观察到有意思的现象。
代码
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-
专栏作者：恒成立
上海理工大学 光电硕士
热爱折腾与创造
一个人的探索有些孤单，
一群人的探索会更有意思。
加入社群交流
在这里 （扫码）！
本文参与 腾讯云自媒体分享计划，分享自微信公众号。
原始发表：2021-03-15，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录