Survey of an Island

// composition: one surveyed landmass low center-left; annotations reach into the empty upper-right
// layering: faint plate grid, old stains, hatched landmass, contour rings, ink markup last
const PALETTE = [
  "#efe7d2", // aged paper
  "#8b6b4a", // sepia
  "#3a3730", // drafting ink
  "#7d93a1", // water line
  "#a53f2b", // survey red
];

function landmassOutline(scale, jitter) {
  brush.beginShape(0.35);
  brush.vertex(228 + randomGaussian(0, jitter) * scale, 486 + randomGaussian(0, jitter));
  brush.vertex(300 - 30 * (scale - 1) * 4, 420 - 36 * (scale - 1) * 4 + randomGaussian(0, jitter));
  brush.vertex(392 + randomGaussian(0, jitter), 398 - 44 * (scale - 1) * 4);
  brush.vertex(470 + 40 * (scale - 1) * 4, 438 + randomGaussian(0, jitter));
  brush.vertex(494 + 48 * (scale - 1) * 4, 520 + randomGaussian(0, jitter));
  brush.vertex(430 + randomGaussian(0, jitter), 588 + 40 * (scale - 1) * 4);
  brush.vertex(316 + randomGaussian(0, jitter), 604 + 46 * (scale - 1) * 4);
  brush.vertex(232 - 40 * (scale - 1) * 4, 560 + 30 * (scale - 1) * 4);
  brush.endShape(true);
}

function setup() {
  createCanvas(800, 800, WEBGL);
  angleMode(DEGREES);
  brush.scaleBrushes(2.2);
  noLoop();
}

function draw() {
  translate(-width / 2, -height / 2);
  background("#efe7d2");

  // plate grid, faint, imperfect
  brush.set("2H", "#8b6b4a", 0.35);
  for (let x = 60; x <= 740; x += 68) {
    brush.line(x + randomGaussian(0, 1), 52, x + randomGaussian(0, 1), 748);
  }
  for (let y = 60; y <= 740; y += 68) {
    brush.line(52, y + randomGaussian(0, 1), 748, y + randomGaussian(0, 1));
  }

  // age stains before any drawing
  brush.noStroke();
  brush.fillBleed(0.6, "out");
  brush.fillTexture(0.8, 0.7);
  brush.fill("#8b6b4a", 34);
  brush.circle(618, 176, 64, true);
  brush.fill("#8b6b4a", 26);
  brush.circle(160, 250, 44, true);
  brush.fill("#7d93a1", 22);
  brush.circle(672, 636, 58, true);

  // the landmass: sepia wash under ink hatching
  brush.noStroke();
  brush.fillBleed(0.25, "in");
  brush.fillTexture(0.6, 0.6);
  brush.fill("#8b6b4a", 70);
  landmassOutline(1, 3);

  brush.hatchStyle("HB", "#3a3730", 0.45);
  brush.hatch(5.5, 38, { rand: 0.12 });
  brush.noFill();
  landmassOutline(1, 2);
  brush.noHatch();

  // contour rings stepping outward
  brush.set("rotring", "#3a3730", 0.5);
  brush.noFill();
  landmassOutline(1.045, 3);
  brush.set("rotring", "#3a3730", 0.35);
  landmassOutline(1.09, 4);
  brush.set("2H", "#3a3730", 0.35);
  landmassOutline(1.14, 5);

  // water: three easy lines in the lower right
  brush.set("2H", "#7d93a1", 0.6);
  brush.line(548, 664, 736, 656);
  brush.line(572, 690, 748, 684);
  brush.line(600, 716, 726, 712);

  // survey markup: leader lines into the empty upper-right
  brush.set("rotring", "#3a3730", 0.55);
  brush.line(392, 400, 560, 208);
  brush.circle(566, 202, 3);
  brush.line(572, 202, 640, 202);
  brush.line(470, 440, 648, 330);
  brush.circle(654, 326, 3);
  brush.line(660, 326, 716, 326);
  brush.line(300, 424, 196, 300);
  brush.circle(192, 294, 3);
  brush.line(186, 294, 122, 294);

  // one red station: the point the whole plate exists for
  brush.set("rotring", "#a53f2b", 0.8);
  brush.circle(392, 398, 6);
  brush.line(392, 384, 392, 358);
  brush.line(378, 398, 352, 398);

  // scale bar, lower left
  brush.set("rotring", "#3a3730", 0.6);
  brush.line(84, 712, 220, 712);
  brush.line(84, 706, 84, 718);
  brush.line(152, 708, 152, 716);
  brush.line(220, 706, 220, 718);
}