Geologic cross section with a rule

I’ve trying to make a geologic cross section for a while but I have not even had any idea on how to start.
My goal is to do this 2d random graphic based on a simple rule. the idea is to:

  1. Draw a line
  2. Divide that line in n amount of points.
  3. Select those points.
  4. Move those points on Y axis at -1 , 0 or 1.
  5. Draw a line using these new points.
    (Now here it get even more complex).
  6. I think the second line should now consider the last line drawn, to avoid overlapping.

I think it might be a good idea to make a addition or difference between the last point drawn and the new point to be drawn, because the probability of 1/3 to get a value could add up if I get P1 = 1, P2 = P1+1, P3 = P2+1 so if runs adding, it can go beyond.

These are some images from the internet that might serve as inspiration.

Thanks! and HAppy new year!!

1 Like


Happy new year! :wink:

I think there’s a better way to achieve what you want :

  • First of all geologic lines are random in a noisy way so using perlin noise is going to help us

  • The idea is that each line have an offset that push it from the previous one so they never intersect. It’s like if you would take layers of colored sand and apply force on some areas, you would see this kind of deformation I think.

Here is a code that does this kind of visuals (with ugly colors :sweat_smile:):

// The resolution of the curves
int steps = 150;

// An array storing the previous height of the last curve
float[] previousPointsHeight = new float[steps + 1];

void setup() {
  size(1000, 500);

void draw() {
  // Loop until we fill all the screen
  while(previousPointsHeight[0] < height) {
    // Random fill color
    fill(random(255), random(255), random(255));
    // Fill the bottom part of the screen
    vertex(0, height);
    for (int j = 0; j <= steps; j++) {
      float x = j * (width / (float) steps);
      float offset = noise(j * 0.01) * 50;
      // The height of the point is the previous height with an offset
      // so they can never touch
      float y = previousPointsHeight[j] + offset;
      // Replace the last point with that point
      previousPointsHeight[j] += offset;
      vertex(x, y);
    // Close the shape
    vertex(width, height);


This is just a code example, feel free to make your own or improve it!

Hope it helps :wink: