Processing How do you vary the colour depending on the location in the sketch?

Question

I've been trying to create cellular automata, using the Moore neighborhood, in processing and have been pretty successful so far. I've managed to get the basic system working and now I'm looking to play around with it by adding different features. Right now, I check whether the cell is alive or not. If it is, I apply a color using the fill() function and then I might vary the saturation of that color based on how long the cell has been alive for. But, I want to be able to vary the color of the live cells based on their location such as the

Image shown here:

From the looks of it, it seems like an equation was used to achieve this effect although I'm not entirely sure. This has had me stumped for about 2 days now. I don't want the answer as I would like to figure it out on my own. However, if someone could point me in the right direction I would be very grateful!

Right now, I've made each cell an object of the class Cell. In there I store the cell's x,y coordinates, and current living state. It also contains a draw() method:

which applies a different colour to the cell depending on whether it is living or not (the age variable stores the number for how long the cell has been alive for in seconds).

This:

is what the output looks like so far. Like I said before I would like to get it to look like the example image in the first link.

Answer 1

Use noise(x,y) to calculate a Perlin Noise value for each cell, based upon its coordinates. Map this value to a hue (or saturation, or brightness) when drawing the cells for a global color gradient effect.

---

Update: Example code to generate noise that maps better to the whole color spectrum (see before vs after).

{
    final float resolution = 0.0175f;
    noiseDetail(20);
    colorMode(HSB, 1, 1, 1);

    float[] hues = new float[width * height];

    loadPixels();

    float hueMax = 0;
    float hueMin = 1;

    for (int x = 0; x < width; x++) { // Create value hue per pixel.
        for (int y = 0; y < height; y++) {
            int i = (y * width) + x;

            hues[i] = noise(x * resolution, y * resolution); 

            if (hues[i] > max) {
                max = s[i];
            } else {
                if (hues[i] < min) {
                    min = hues[i];
                }
            }
        }
    }

    for (int x = 0; x < width; x++) { // Maps hue value to a more complete spectrum; updates PApplet pixels[].
        for (int y = 0; y < height; y++) {
            int i = (y * width) + x;

            float hue = map(hues[i], min/0.4f, max*0.9f, 0, 1); // constants found by experimenting

            pixels[i] = color(hue, 1, 1); // only map hues in this example
        }
    }

    updatePixels();
}