差分

このページの2つのバージョン間の差分を表示します。

--- lecture:design_with_prototyping:p5.js編:14.繰返しの再構成 [2021/03/10 15:18] – ↷ lecture:design_with_prototyping:p5.js編:14.グリッドの再構成から lecture:design_with_prototyping:p5.js編:14.繰返しの再構成へページを名称変更しました。 baba
+++ lecture:design_with_prototyping:p5.js編:14.繰返しの再構成 [2021/03/10 18:12] (現在) – [再帰関数で描けるもの] baba
@@ 行 1: / 行 1: @@
-====== Composition ======
+{{ :lecture:design_with_prototyping:p5.js編:fractal_tree_simple_teaser_.png?nolink |}}
+====== 繰返しの再構成 ======
+繰返しと言われて皆さんなにを思い浮かべるでしょうか？一般的には同じことを何度もすることを意味しているわけですが、朝昼夜、春夏秋冬、デザイン思考等など、
+繰返しとは様々なプロセスにおいて一般的に語られるプロトコルであり私達の身の回りにあふれる概念です。このページでは繰返し処理をテーマにいくつかの視覚的な表現に関するコードをスケッチしてみたいと思います。
+===== Composition =====
 ピエト・モンドリアンの作品の中で最も有名とも言える，Compositionという作品群があります．
 >ピエト・モンドリアン（ピート・モンドリアン、Piet Mondrian、本名ピーテル・コルネーリス・モンドリアーン Pieter Cornelis Mondriaan 1872年3月7日 - 1944年2月1日）は19世紀末-20世紀のオランダ出身の画家。ワシリー・カンディンスキー、カジミール・マレーヴィチらと並び、本格的な抽象絵画を描いた最初期の画家とされる。 出典: フリー百科事典『ウィキペディア（Wikipedia）』
@@ 行 121: / 行 126: @@
 </WRAP>
+以下はこのページのトップにある画像を生成するコードです。上記のサンプルプログラムと見比べてみてもなにか発見があるかもしれません。
+<file js トップの画像を生成するコード.js>
+let number = 25;
+function setup() {
+  createCanvas(1280, 720);
+  background(0);
+  stroke(121, 84, 56, 150);
+  strokeWeight(1);
+  drawBar(width / 2, height - 10, 100, PI / 2, number);
+}
+function drawBar(x0, y0, length, theta, N) {
+  if (N > 0) {
+    let x = x0 + length * cos(theta);
+    let y = y0 - length * sin(theta);
+    line(x0, y0, x, y);
+    if (N < number / 2) {
+      stroke(49, 226, 22, 150 - 150 * (N / number));
+      if (random(0.0, 1.0) < 0.8) {
+        stroke(49, 226, 22, 20);
+        drawBar(x, y, length * random(0.6, 1.0), theta + random(PI / 8, PI / 7), N - 1);
+      }
+      if (random(0.0, 1.0) < 0.8) {
+        stroke(49, 226, 22, 20);
+        drawBar(x, y, length * random(0.6, 1.0), theta - random(PI / 8, PI / 7), N - 1);
+      }
+    }
+    else {
+      //stroke(121, 84, 56, 150 * (N / number));
+      if (random(0.0, 1.0) < 0.8) {
+        stroke(121, 84, 56, 150 * (N / number));
+        drawBar(x, y, length * random(0.6, 1.0), theta + random(PI / 8, PI / 7), N - 1);
+      }
+      if (random(0.0, 1.0) < 0.8) {
+        stroke(121, 84, 56, 150 * (N / number));
+        drawBar(x, y, length * random(0.6, 1.0), theta - random(PI / 8, PI / 7), N - 1);
+      }
+    }
+  }
+}
+function keyPressed() {
+  if (key == 's') {
+    save('fractal_tree_simple.png');
+  }
+}
+</file>
 ====== Reference ======