How to smooth out animating geomety vertices

Hi there.

I created simple plane and tried to animate it’s top edge vertices in a wave-like animation. Most parts of the code work, however they look very sharp.

Here is an example of my working code: https://codepen.io/richardevcom/pen/bGJQqrx

What would be the best approach to maintain the current animation & overall shape, but also smooth out those sharp edges?

Thank you in advance,
Richard

If I have to keep the current way of forming the wave shape, I’d use spline curve over 32 wave control points, but the actual wave will have more points (taken from the spline curve).

Also, I’d switch to a newer Three.js release, because the one you use is rather all.

https://codepen.io/boytchev/full/ZEZmeqG

image

If you have time, you may also consider this.

3 Likes

Thank you. This is exactly what I was going after. And it’s also faster than my previous code. :pray:
I forked random three.js codepen and just noticed it’s outdated, but nonetheless it works.

2 Likes