楕円の回転
ELLIPSE-0100 楕円をrotate()で回転させます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
//=========================================== // 楕円を回転させる //=========================================== // CreationDate: 2025年3月6日 木曜日14:45:39 //=================【環境設定】================ size(400, 400); //画面サイズ translate(width/2, height/2); //原点を移動 //=================【初期設定】================ noFill(); //塗りつぶしなし float a=radians(10);//回転角度 float dt=PI/a-1; //回転数 int w=350, h=50; //楕円の大きさ //==================メイン==================== for(int i=0; i<dt; i ++) { rotate(a); //回転する ellipse(0, 0, w, h); //楕円の描画 } |
ELLIPSE-0101 これに色を付けます。lerpColor(）でグラデーションにします。不透明度を下げて色を重ねますが、背景が黒の場合濁った感じになるので、バックに同じパターンの白を引いておきます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
//=========================================== // 楕円を回転させる //=========================================== // CreationDate: 2025年3月6日 木曜日17:51:31 //=================【環境設定】================ size(400, 400); //画面サイズ translate(width/2, height/2); //原点を移動 background(0); //=================【初期設定】================ colorMode(HSB, 360, 100, 100); color c1=color(0, 97, 99, 50); color c2=color(298, 79, 91, 50); noStroke(); float dt=radians(10); //回転角度 float dt=PI/a-1; //回転数 int w=350, h=50; //楕円の大きさ //==================メイン==================== for (int k=0; k<2; k++) { for(int i=0; i<dt; i ++) { rotate(a); if (k==0) { fill(0, 0, 100, 100); //色が暗くならないように白を引く } else { fill(lerpColor(c1, c2, norm(th, 0, PI-dt))); } ellipse(0, 0, w, h); } } |
ELLIPSE-0102 楕円を少し上に移動したものを回転させてみましょう。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
//=========================================== // 楕円を移動後 に回転させる //=========================================== // CreationDate: 2025年3月6日 木曜日18:24:50 //=================【環境設定】================ size(400, 400); //画面サイズ translate(width/2, height/2); //原点を移動 //=================【初期設定】================ noFill(); //塗りつぶしなし float a=radians(10); //回転角度 float dt=TWO_PI/a-1; //回転数 int w=50, h=120; //楕円の大きさ //==================メイン==================== for(int i=0; i<dt; i ++) { rotate(a); ellipse(0, 120, w, h); //現在の座標を復元 } |
ELLIPSE-0103 楕円の大きさを変えるとまた変わったパターンに見えます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
//=========================================== // 楕円を回転させる //=========================================== // CreationDate: 2025年3月6日 木曜日18:47:44 //=================【環境設定】================ size(400, 400); //画面サイズ translate(width/2, height/2); //原点を移動 //=================【初期設定】================ noFill(); //塗りつぶしなし float a=radians(10); //回転角度 float dt=PI/a-1; //回転数 int w=350, h=200; //楕円の大きさ //==================メイン==================== for (int i=0; i<dt; i ++) { rotate(a); ellipse(0, 0, w, h); //現在の座標を復元 } |
ELLIPSE-0104 楕円を徐々に拡大して円に近づけたものを回転させます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
//=========================================== // 楕円の幅を少しづつ拡大して回転させる //=========================================== // CreationDate: 2025年3月7日 金曜日19:14:02 //=================【環境設定】================ size(400, 400); //画面サイズ translate(width/2, height/2); //原点を移動 //=================【初期設定】================ noFill(); //塗りつぶしなし int h=350; //楕円の高さ int w=150; //楕円の幅 float k; //楕円の回転数 float a=radians(60); //楕円の回転角度 //==================メイン==================== for (k=0; k<PI; k+=a) { pushMatrix(); //現在の座標を保存 rotate(k); //回転する for ( int i=0; i<14; i++) { //楕円の幅を拡大する ellipse(0, 0, w+i*15, h); //楕円の描画 } popMatrix(); //現在の座標を復元 } |
ELLIPSE-0105 さらに最初の楕円を小さくしてから拡大してみます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
//=========================================== // 楕円の幅を少しづつ拡大して回転させる //=========================================== // CreationDate: 2025年3月7日 金曜日19:21:06 //=================【環境設定】================ size(400, 400); //画面サイズ translate(width/2, height/2); //原点を移動 //=================【初期設定】================ background(0); colorMode(HSB, 360, 100, 100, 100); color c1=color(0, 50, 100, 100); color c2=color(247, 50, 100, 100); noFill(); //塗りつぶしなし int h=350; //楕円の高さ float w=1; //楕円の幅 float k; //楕円の回転数 float a=radians(60); //楕円の回転角度 int t; //楕円を拡大して円に近づける //==================メイン==================== for (k=0; k<PI; k+=a) { pushMatrix();//現在の座標を保存 rotate(k);//回転する for (t=0; t<34; t++) { w+=10; //幅を拡大 stroke(lerpColor(c1, c2, norm(t, 0, 33))); ellipse(0, 0, w, h);//楕円の描画 } w=1; popMatrix(); //現在の座標を復元 } |
コメント