mirror of
https://github.com/nature-of-code/noc-book-2
synced 2024-09-29 05:36:56 +02:00
Merge pull request #933 from nature-of-code/notion-update-docs
minor layout updates
This commit is contained in:
commit
22890f9eb5
3 changed files with 13 additions and 10 deletions
|
@ -910,12 +910,14 @@ for (let animal of kingdom) {
|
|||
emitter.run();
|
||||
}</pre>
|
||||
<p>Of course, if I call an <code>applyForce()</code> method on the <code>Emitter</code> object in <code>draw()</code>, I then have to define that method in the <code>Emitter</code> class. In English, that method needs to be able to receive a force as a <code>p5.Vector</code> and apply that force to all the particles. Here’s the translation into code:</p>
|
||||
<pre class="codesplit" data-code-language="javascript"> applyForce(force) {
|
||||
<div class="avoid-break">
|
||||
<pre class="codesplit" data-code-language="javascript"> applyForce(force) {
|
||||
for (let particle of this.particles) {
|
||||
particle.applyForce(force);
|
||||
}
|
||||
}</pre>
|
||||
<p>It almost seems silly to write this method. The code is essentially saying, “Apply a force to a particle system so that the system can apply that force to all the individual particles.” Although this may sound a bit roundabout, this approach is quite reasonable. After all, the emitter is in charge of managing the particles, so if you want to talk to the particles, you’ve got to talk to them through their manager. (Also, here’s a chance to use an enhanced <code>for...of</code> loop, since no particles are being deleted!)</p>
|
||||
</div>
|
||||
<p>It almost seems silly to write this method. The code is essentially saying, “Apply a force to a particle system so that the system can apply that force to all the individual particles.” Although this may sound a bit roundabout, this approach is quite reasonable. After all, the emitter is in charge of managing the particles, so if you want to talk to the particles, you’ve got to talk to them through their manager. (Also, here’s a chance to use a <code>for...of</code> loop, since no particles are being deleted!)</p>
|
||||
<p>Here’s the full example, including this change. (The code assumes the existence of the <code>Particle</code> class written earlier; there’s no need to show it again, since nothing has changed.)</p>
|
||||
<div data-type="example">
|
||||
<h3 id="example-46-a-particle-system-with-forces">Example 4.6: A Particle System with Forces</h3>
|
||||
|
@ -940,7 +942,6 @@ function draw() {
|
|||
emitter.run();
|
||||
}
|
||||
|
||||
|
||||
class Emitter {
|
||||
constructor(x, y) {
|
||||
this.origin = createVector(x, y);
|
||||
|
|
|
@ -1197,7 +1197,7 @@ function draw() {
|
|||
<p>Modify Example 5.10 so that the behavior weights change over time. For example, what if the weights were calculated according to a sine wave or Perlin noise? Or what if some vehicles are more concerned with seeking and others are more concerned with separating? Can you introduce other steering behaviors as well?</p>
|
||||
</div>
|
||||
<h3 id="flocking">Flocking</h3>
|
||||
<p><strong>Flocking</strong> is a group animal behavior found in many living creatures, such as birds, fish, and insects. In 1986, Reynolds created a computer simulation of flocking behavior and documented the algorithm in his paper “Flocks, Herds, and Schools: A Distributed Behavioral Model.” Re-creating this simulation in p5.js will bring together all the concepts in this chapter:</p>
|
||||
<p><strong>Flocking</strong> is a group animal behavior found in many living creatures, such as birds, fish, and insects.<br>In 1986, Reynolds created a computer simulation of flocking behavior and documented the algorithm in his paper “Flocks, Herds, and Schools: A Distributed Behavioral Model.” Re-creating this simulation in p5.js will bring together all the concepts in this chapter:</p>
|
||||
<ol>
|
||||
<li>I will use the steering force formula (steer = desired – velocity) to implement the rules of flocking.</li>
|
||||
<li>These steering forces will be group behaviors and will require each vehicle to perceive all the other vehicles.</li>
|
||||
|
@ -1232,7 +1232,7 @@ function draw() {
|
|||
this.applyForce(alignment);
|
||||
this.applyForce(cohesion);
|
||||
}</pre>
|
||||
<p>Now, it’s just a matter of implementing the three rules. I applied separation already; it’s identical to the previous example. Instead, I’ll focus on alignment, or steering in the same direction as the neighboring boids. As with all other steering behaviors, I have to express this concept as a desire: the boid’s desired velocity is the average velocity of its neighbors. The algorithm is therefore to calculate the average velocity of all the other boids and set that to the desired velocity:</p>
|
||||
<p>Now, it’s just a matter of implementing the three rules. I applied separation already; it’s identical<br>to the previous example. Instead, I’ll focus on alignment, or steering in the same direction as the neighboring boids. As with all other steering behaviors, I have to express this concept as a desire: the boid’s desired velocity is the average velocity of its neighbors. The algorithm is therefore to calculate the average velocity of all the other boids and set that to the desired velocity:</p>
|
||||
<pre class="codesplit" data-code-language="javascript"> align(boids) {
|
||||
// Add up all the velocities and divide by the total
|
||||
// to calculate the average velocity.
|
||||
|
|
|
@ -743,11 +743,13 @@ board = next;</pre>
|
|||
<h3 id="exercise-711">Exercise 7.11</h3>
|
||||
<p>Create a CA in which each pixel is a cell and the pixel’s color is its state.</p>
|
||||
</div>
|
||||
<h3 id="historical">Historical</h3>
|
||||
<p>In the object-oriented Game of Life example, I used two variables to keep track of a cell’s current and previous states. What if you use an array to keep track of a cell’s state history over a longer period? This relates to the idea of a <em>complex adaptive system</em>, one that has the ability to change its rules over time by learning from its history. (Stay tuned for more on this concept in <a href="/genetic-algorithms#section-genetic-algorithms">Chapters 9</a> and <a href="/neural-networks#section-neural-networks">10</a>.)</p>
|
||||
<div data-type="exercise">
|
||||
<h3 id="exercise-712">Exercise 7.12</h3>
|
||||
<p>Visualize the Game of Life by coloring each cell according to the amount of time it has been alive or dead. Can you also use the cell’s history to inform the rules?</p>
|
||||
<div class="avoid-break">
|
||||
<h3 id="historical">Historical</h3>
|
||||
<p>In the object-oriented Game of Life example, I used two variables to keep track of a cell’s current and previous states. What if you use an array to keep track of a cell’s state history over a longer period? This relates to the idea of a <em>complex adaptive system</em>, one that has the ability to change its rules over time by learning from its history. (Stay tuned for more on this concept in <a href="/genetic-algorithms#section-genetic-algorithms">Chapters 9</a> and <a href="/neural-networks#section-neural-networks">10</a>.)</p>
|
||||
<div data-type="exercise">
|
||||
<h3 id="exercise-712">Exercise 7.12</h3>
|
||||
<p>Visualize the Game of Life by coloring each cell according to the amount of time it has been alive or dead. Can you also use the cell’s history to inform the rules?</p>
|
||||
</div>
|
||||
</div>
|
||||
<h3 id="moving-cells">Moving Cells</h3>
|
||||
<p>In these basic examples, cells have a fixed position on a grid, but you could build a CA with cells that have no fixed position and instead move about the canvas.</p>
|
||||
|
|
Loading…
Reference in a new issue