WebGL Genetic Algorithm: Evolving an Image

Initializing

Original Image:

Best Approximation So Far:

This is an only-partly successful attempt to apply the genetic algorithm to evolve an approximation of a given image. The original image is very simple. The candidate approximations are grayscale images made up of 500 small squares. As time goes on, for example, you should see a darker region emerging in the upper right corner, corresponding to the black disk in the original image. However, big improvements don't seem to come up much after the first couple of hundred generations. (Still, you might get a decent approximation after several thousand generations.)

In any case, the main point of this exercise was to use an optional extension to the WebGL 3D graphics system that makes it possible to work with a "floating-point color buffer", and to demonstrate some techniques for doing computational work in WebGL. The page is not functional if the required extension is not available, even if your browser does support WebGL.