Physical Simulations


More Complex Sine Waves

Here's an example of just how far we can push this stuff. If we combine the formula for a three-dimensional sine wave with our code for automatically distributing layers in a grid we can set up a pretty cool undulating grid. Please note that even though it appears that the layers are undulating in the y direction in the demo movie they are actually laid out in an x/y grid and are moving back and forth in the z direction. I moved the camera to give a better perspective view of the action. Here's the code for position:

undulating grid


numCol = 8; //number of columns
gap = 20; // distance between cells (pixels)
amp = 40; //amplitude in pixels
wave = 100; //wavelength in pixels
freq = 0.5; //cycles per second

origin = [gap/2,gap/2,0]; //upper left hand corner of grid
x = ((index-1)%numCol)*gap;
y = Math.floor((index-1)/numCol)*gap;
z = 25*Math.cos((x + y)/wave + freq*Math.PI*2*time);

origin + [x,y,z]

Almost all of this code is just concerned with the positioning a layer in the grid and is similar to code we've looked at previously. The undulations come from the next-to-the-last line which is the formula for a cosine wave that depends on x position, y position, and time to calculate the z position of the layer. You'll notice that the layers rock back and forth as they undulate up and down. This is accomplished by the following expression for orientation:


numCol = 8; //number of columns
gap = 20; // distance between cells (pixels)
wave = 100; //wavelength in pixels
freq = 0.5; //cycles per second
damp = .5; //damping factor

x = ((index-1)%numCol)*gap;
y = Math.floor((index-1)/numCol)*gap;

xRot = Math.atan(Math.sin(x/wave + freq*Math.PI*2*time))*damp;
yRot = Math.atan(Math.sin(y/wave + freq*Math.PI*2*time))*damp;

[radiansToDegrees(xRot),radiansToDegrees(yRot),0]

Most of the code here is just a duplication of what's in the Position expression except for the last three lines, which calculate the layer's Orientation based the current action of the "wave" at the layer's Position. If you really dig into to this, you get into a mathematical concept called derivatives, which we're not going to get into here, except to say that conveniently for us, the derivative of a cosine wave is a sine wave, which works out quite well in this case.




previous next