# Trouble animating plane geometry

Hello, I am trying to animate a plane geometry with a moving sine wave: Ray Test - CodeSandbox

I put comments in my code; each animated item has a tick function (cube, plane) that gets called by the clock each render cycle.

Here is the tick function for the plane. It used the elapsed time

``````plane.tick = (delta, elapsedTime) => {
const { position } = planeGeo.attributes;
plane.tick = (delta, elapsedTime) => {
const { position } = planeGeo.attributes;
for (let i = 0; i < position.count; i++) {
let x = position.getX(i);
let y = position.getY(i);
let z = position.getZ(i);
// This should cause the z axis to wave over time
z = Math.sin(
Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2)) +
Math.sin(2 * Math.PI * elapsedTime)
);
// Attemptd animated sine wave 2d
// z = Math.sin(x + elapsedTime);
// Basic, non-animated sine wave
// Math.sin(Math.pow(x, 2) + Math.pow(y, 2))
position.setXYZ(i, x, y, z);
}
};
``````

I sourced my equation from here: Sine Wave Surface

While my equation for making the plane wave overtime may be wrong, it should be moving. If I try the following equation that is more correct:

``````// Attemptd animated sine wave 2d
z = Math.sin(x + elapsedTime);
``````

If elapsedTime is changing, why is only my cube animating?

Hi!
Try this:

``````      for (let i = 0; i < position.count; i++) {
let x = position.getX(i);
let y = position.getY(i);
let z = position.getZ(i);
// This should cause the z axis to wave over time
z = Math.sin(
Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2)) +
Math.sin(2 * Math.PI * elapsedTime)
);
// Attemptd animated sine wave 2d
// z = Math.sin(x + elapsedTime);
// Basic, non-animated sine wave
// Math.sin(Math.pow(x, 2) + Math.pow(y, 2))
position.setXYZ(i, x, y, z);
}
position.needsUpdate = true; //add this line
``````
1 Like