iFFT Wave Generator

Showcase
, , ,
1

I have been trying to find a good example of an iFFT (inverse fast fourier transform) wave generator written for three.js. One of the best examples is the FFT Wave generator written by Jeremy Bouny. However, this was written in 2016 and was only updated to r72. Here is a version of his program consolidated and updated to r101 using modules.

I have now gathered all my examples of waves created using various methods on a couple of pages:

  • Waves - examples of all the waves (the last one may be the best).
  • Pirates - dioramas of a Pirate ship on different types of waves.

They all seem to run at 60fps or more on my PC.

Let me know which you like best or what improvements I should make.

5 Likes
2

Thanks for the efforts of migrating the code to the latest Three.js. There are many gems out there that are stuck to old releases.

3 Likes
3

Definitely, I started porting an old demo too (from an early threejs contributor in 2012) which I found really well made: demo

But the gap is quite big with current three version. It was using some feat called deferred renderer that have been removed since then…

I will see if I can manage to finish the port… currently I have an halfway version, and one fully migrated to latest three, but with degraded graphics.

2 Likes
4

I have added a reference to an article about using shader buffers that was written about the same time as the JBouny program. It shows that people were doing some pretty amazing things back then… Unfortunately, Google is horrible at finding these gems - it took me about a month to find the right combination of search terms to find these kinds of articles.

1 Like
5

Were you able to find a copy of the deferred renderer? The WebGLDeferredRenderer was apparently available through version r112.1: See: js version. and jsm version.

6

Sorry for late reply, don’t remember what I tried already as it was a project I was working on a year ago.
Fortunately I documented where I left, but will have to immerse myself back into the code to see if I grabbed a version of three embedding deferred renderer (as the one you mentionned) or directly getting rid of deferred renderer.
The hard part was that the demo was using its own custom three version (called XG) and not an official release.

my notes below:

  • Legacy version launched from react

Refactoring

  • TS port + use ES6 standards

  • reorg split in files

Porting

xg lib decommissionning:

  • split XG lib

  • switch to THREE lib

  • port missing lib UTF8Loader, CTMLoader

  • improve daylight spotlight shadows

  • port all lights: probes, ambient, sky

  • port cars + physics

Bugfix

  • light toggling

  • cam switch

  • strange geom in terrain level

  • UI glitches

EDIT: maybe I should ask chatGPT to help porting :slight_smile: