If you’ve ever used Processing you’ve probably used the ‘map’ function. From the Processing Reference section it reads: “Re-maps a number from one range to another. In the example above, the number ‘25′ is converted from a value in the range 0..100 into a value that ranges from the left edge (0) to the [...]

After seeing a post on the Puny Blog about displacement maps I became interested in how they did it. Unfortunately there wasn’t any source code so I’ve replicated the effect from scratch.
Turns out displacement maps are really hard to wrap your head around, so I’ll try to explain it very carefully and slowly.