Monday, March 12, 2018

2D Ripple Algorithm

2D Ripple Algorithm

by Maciej Matyka, Wrocław, 2018-03-13

(play here)

Once upon a time... I saw this on the famous Hugo Elias website (bouncy 2d graphics website). It was around 1998. Now I found it's web archived version of the algorithm and quickly done some re-implementation in javascript.

The basic algorithm works on two 2D tables. You ping-pong the data between tables, so you first run from 1 to 2 and then back from 2 to 1.

The main wave propagation goes like this:

      for each particle (x.y) calculate:
                 map2(x,y) = (map(x-1, y) +
                                    map(x+1, y) +
                                    map(x, y+1) +
                                    map(x, y-1)) /2 - map2(x,y)
                 map2(x,y) = map2(x,y) * damping

where damping is a number between 0-1. After one step map becomes map2 and vice-versa.
It is worth to add some smoothing as well (simply average each pixel between rendering).

Note: I discovered that using single pixel as the starting point for the wave gives really ugly picture and, thus I put the 3x3 picel each time I want to seed the wave.

Below is the first result of the model implemented in 2018 by me.

The app will be soon available at

Labels: , ,


At April 23, 2018 at 4:56 AM , Blogger sandy star said...

This comment has been removed by a blog administrator.

At May 15, 2018 at 8:07 AM , Blogger FrEindz4 eVer said...

This comment has been removed by a blog administrator.


Post a Comment

Subscribe to Post Comments [Atom]

<< Home