Merge pull request #405 from nature-of-code/notion-update-docs

Chapter 7 and 8 edits
nature-of-code · Aug 24, 2023 · 37346ee · 37346ee
2 parents 54374f9 + 7953d0f
commit 37346ee
Show file tree

Hide file tree

Showing 13 changed files with 211 additions and 76 deletions.
diff --git a/content/07_ca.html b/content/07_ca.html
diff --git a/content/08_fractals.html b/content/08_fractals.html
diff --git a/content/examples/08_fractals/example_8_9_l_system/index.html b/content/examples/08_fractals/example_8_9_l_system/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.min.js"></script>
+    <meta charset="utf-8" />
+    <link rel="stylesheet" type="text/css" href="style.css" />
+  </head>
+  <body>
+    <script src="lsystem.js"></script>
+    <script src="turtle.js"></script>
+    <script src="sketch.js"></script>
+  </body>
+</html>
diff --git a/content/examples/08_fractals/example_8_9_l_system/lsystem.js b/content/examples/08_fractals/example_8_9_l_system/lsystem.js
@@ -0,0 +1,34 @@
+// The Nature of Code
+// Daniel Shiffman
+// http://natureofcode.com
+
+// An LSystem has a starting sentence
+// An a ruleset
+// Each generation recursively replaces characters in the sentence
+// Based on the ruleset
+
+// Construct an LSystem with a starting sentence and a ruleset
+class LSystem {
+  constructor(axiom, rules) {
+    this.sentence = axiom; // The sentence (a String)
+    this.ruleset = rules; // The ruleset (an array of Rule objects)
+  }
+
+  // Generate the next generation
+  generate() {
+    // An empty string that we will fill
+    let nextgen = "";
+    // For every character in the sentence
+    for (let i = 0; i < this.sentence.length; i++) {
+      // What is the character
+      // We will replace it with itself unless it matches one of our rules
+      let c = this.sentence.charAt(i);
+      let next = this.ruleset[c] || c;
+      // Append replacement String
+      nextgen += next;
+    }
+    // Replace sentence
+    this.sentence = nextgen;
+  }
+
+}
diff --git a/content/examples/08_fractals/example_8_9_l_system/screenshot.png b/content/examples/08_fractals/example_8_9_l_system/screenshot.png
diff --git a/content/examples/08_fractals/example_8_9_l_system/sketch.js b/content/examples/08_fractals/example_8_9_l_system/sketch.js
@@ -0,0 +1,41 @@
+// The Nature of Code
+// Daniel Shiffman
+// http://natureofcode.com
+
+let lsystem;
+let turtle;
+
+function setup() {
+  createCanvas(640, 240);
+
+  let rules = {
+    F: "FF+[+F-F-F]-[-F+F+F]",
+  };
+  lsystem = new LSystem("F", rules);
+  turtle = new Turtle(4, radians(25));
+
+  for (let i = 0; i < 4; i++) {
+    lsystem.generate();
+  }
+
+  // Some other rules
+  // let ruleset = {
+  //   F: "F[F]-F+F[--F]+F-F",
+  // };
+  // lsystem = new LSystem("F-F-F-F", ruleset);
+  // turtle = new Turtle(4, PI / 2);
+
+  // let ruleset = {
+  //   F: "F--F--F--G",
+  //   G: "GG",
+  // };
+  // lsystem = new LSystem("F--F--F", ruleset);
+  // turtle = new Turtle(8, PI / 3);
+}
+
+function draw() {
+  background(255);
+  translate(width / 2, height);
+  turtle.render(lsystem.sentence);
+  noLoop();
+}
diff --git a/content/examples/08_fractals/example_8_9_l_system/style.css b/content/examples/08_fractals/example_8_9_l_system/style.css
@@ -0,0 +1,7 @@
+html, body {
+ margin: 0;
+ padding: 0;
+}
+canvas {
+  display: block;
+}
diff --git a/content/examples/08_fractals/example_8_9_l_system/turtle.js b/content/examples/08_fractals/example_8_9_l_system/turtle.js
@@ -0,0 +1,29 @@
+// The Nature of Code
+// Daniel Shiffman
+// http://natureofcode.com
+
+class Turtle {
+  constructor(length, angle) {
+    this.length = length;
+    this.angle = angle;
+  }
+
+  render(sentence) {
+    stroke(0);
+    for (let i = 0; i < sentence.length; i++) {
+      let c = sentence.charAt(i);
+      if (c === "F" || c === "G") {
+        line(0, 0, 0, -this.length);
+        translate(0, -this.length);
+      } else if (c === "+") {
+        rotate(this.angle);
+      } else if (c === "-") {
+        rotate(-this.angle);
+      } else if (c === "[") {
+        push();
+      } else if (c === "]") {
+        pop();
+      }
+    }
+  }
+}
diff --git a/content/images/08_fractals/08_fractals_2.png b/content/images/08_fractals/08_fractals_2.png
diff --git a/content/images/08_fractals/08_fractals_3.png b/content/images/08_fractals/08_fractals_3.png
diff --git a/content/images/08_fractals/08_fractals_4.png b/content/images/08_fractals/08_fractals_4.png
diff --git a/content/images/08_fractals/08_fractals_5.png b/content/images/08_fractals/08_fractals_5.png
diff --git a/content/images/08_fractals/08_fractals_6.png b/content/images/08_fractals/08_fractals_6.png