Earth

What

ノイズを使って空、海、大地を表現しました。
海は雲のようにまばらではなく、横方向に線が流れるようにノイズの発生を調整しています。

How

var w = 300;
var h = 300;
var d = h/3;
function setup() {
  createCanvas(w, h);
  background(255);
}

function draw(){
  noLoop();
  noStroke();

  // sky
  fill(0, 0, 255);
  rect(0, 0, w, d);
  for(y = 0; y < d; y++){
    for(x = 0; x < w; x++){
      var c = noise(x * 0.01, y * 0.01) * 255;
      fill(255, c);
      rect(x, y, 1, 1);
    }
  }

  //ocean
  fill("#00d0f9");
  rect(0, d, w, d);
  for(y = d; y < d*2; y++){
    for(x = 0; x< w; x++){
      var c = noise(x * 0.001, y * 0.03);
      fill(`rgba(0, 29, 161, ${c})`);
      rect(x, y, 1, 1);
    }
  }

  // ground
  fill("#543c0f");
  rect(0, d*2, w, d);
  for(y = d*2; y < d*3; y++){
    for(x = 0; x < w; x++){
      var c = noise(x * 0.01, y * 0.01);
      fill(`rgba(84, 233, 33 ,${c})`);
      rect(x, y, 1, 1);
    }
  }
}