Vuelva a crear el efecto de onda lateral 2D del juego Worms

Respuestas:

14

Sí, tiene razón, este efecto de agua 2D puede simularse utilizando la función seno matemática :

wave = sin(phase + t * frequency) * amplitude

ingrese la descripción de la imagen aquí

  • phase es una constante, pon lo que quieras.
  • establecer ten posición horizontal de píxel / vértice que está procesando:t = x;
  • cambiar amplitudecon el tiempo (eso hará que las olas se muevan hacia arriba y hacia abajo):

    amplitude = sin(t * wave_speed) * wave_height

  • Combina varias ondas para obtener un efecto más relajado:

    wave_final = wave0 + wave1 + ... .

    Para cada onda, cambie algunos parámetros un poco (por ejemplo: fase, frecuencia, ...).

Aquí hay un ejemplo rápido que hice, usando solo dos ondas:

http://glslsandbox.com/e#4988.0 (requiere navegador reciente y WebGL habilitado)

NOTA: este es un sombreador, pero hacer esto usando primitivas 2D es el mismo enfoque.

EDITAR: no especifica ningún marco o sistema de representación 2D, pero así es como se podría representar utilizando polígonos / tiras triangulares:

ingrese la descripción de la imagen aquí

tigrou
fuente
Wow, esa es una respuesta increíble, gracias por la respuesta muy completa. Sí, estoy usando HTML5 Canvas api para renderizar. Gracias de nuevo por eso, ¡extremadamente útil!
Ciarán
Correcto, aunque las olas en Worms son claramente no solo pecados sino más complejas; muy posiblemente solo superposiciones de senos.
Leftaroundabout
1
@leftaroundabout: técnicamente , cada función de onda es realmente solo una superposición de un número infinito de senos. Prácticamente, esto sigue siendo cierto, pero las aproximaciones más crudas pueden facilitarle la vida.
Nombre falso el