diff --git a/content/03_oscillation.html b/content/03_oscillation.html index 39cc7b96..3913f97d 100644 --- a/content/03_oscillation.html +++ b/content/03_oscillation.html @@ -20,9 +20,9 @@

Gala by Brid

To model oscillation, you need to understand a little bit about trigonometry, the mathematics of triangles. Learning some trig will give you new tools to generate patterns and create new motion behaviors in a p5.js sketch. You’ll learn to harness angular velocity and acceleration to spin objects as they move. You’ll be able to use the sine and cosine functions to model nice ease-in, ease-out wave patterns. You’ll also learn to calculate the more complex forces at play in situations that involve angles, such as a pendulum swinging or a box sliding down an incline.

I’ll start with the basics of working with angles in p5.js, then cover several aspects of trigonometry. In the end, I’ll connect trigonometry with what you learned about forces in Chapter 2. This chapter’s content will pave the way for more sophisticated examples that require trig later in this book.

Angles

-

Before going any further, I need to make sure you understand how the concept of an angle fits into creative coding in p5.js. If you have experience with p5.js, you’ve undoubtedly encountered this issue while using the rotate() function to rotate and spin objects.

+

Before going any further, I need to make sure you understand how the concept of an angle fits into creative coding in p5.js. If you have experience with p5.js, you’ve undoubtedly encountered this issue while using the rotate() function to rotate and spin objects. You’re most likely to be familiar with the concept of an angle as measured in degrees (see Figure 3.1).

- Figure 3.1: Angles measured in degrees + Figure 3.1: Angles measured in degrees
Figure 3.1: Angles measured in degrees
@@ -31,7 +31,7 @@

Angles

Figure 3.2: A square rotated by 45 degrees
-

You’re most likely to be familiar with the concept of an angle as measured in degrees (see Figure 3.1). A full rotation goes from 0 to 360 degrees, and 90 degrees (a right angle) is one-fourth of 360, shown in Figure 3.1 as two perpendicular lines.

+

A full rotation goes from 0 to 360 degrees, and 90 degrees (a right angle) is one-fourth of 360, shown in Figure 3.1 as two perpendicular lines.

Angles are commonly used in computer graphics to specify a rotation for a shape. For example, the square in Figure 3.2 is rotated 45 degrees around its center.

diff --git a/content/images/03_oscillation/03_oscillation_2.jpg b/content/images/03_oscillation/03_oscillation_2.jpg new file mode 100644 index 00000000..bf5857b4 Binary files /dev/null and b/content/images/03_oscillation/03_oscillation_2.jpg differ diff --git a/content/images/03_oscillation/03_oscillation_2.png b/content/images/03_oscillation/03_oscillation_2.png deleted file mode 100644 index 40efc004..00000000 Binary files a/content/images/03_oscillation/03_oscillation_2.png and /dev/null differ