在处理中创建绘图

Question

我需要在Processing中创建这样一张图片：

()

不幸的是，我遇到了问题，因为我的字母重叠，我得到了这样的东西：

()

这是我的代码：

void setup() {
  size(1000, 1000);
  background(0, 70, 100);
}
void monogram (int x, int y) {
  int los=int(random(0, 255));
  stroke(0, 185, 255, los);
  strokeWeight(5);

  // U //
  noFill();
  arc(x + 25, y + 60, 20, 20, 0, PI);
  line(x + 15, y + 20, x + 15, y + 57);
  line(x + 35, y + 20, x + 35, y + 57);

  // VV //
  noFill();
  beginShape();
  vertex(x + 35, y + 20);
  vertex(x + 55, y + 70);
  vertex(x + 75, y + 20);
  endShape();

  // V //
  noFill();
  beginShape();
  vertex(x + 55, y + 20);
  vertex(x + 75, y + 70);
  vertex(x + 95, y + 20);
  endShape();
}

void draw() {
 
  for (int y = 0; y < height / 50; y++) {
    for (int x = 0; x < width / 70; x++) {
      int los2 = int(random(0, 4));

      pushMatrix();

      if (los2 == 1) {
        scale(-1, 1);
        translate(-width, 0);
      } else if (los2 == 2) {
        scale(1, -1);
        translate(0, -height);
      } else if (los2 == 3) {
        scale(-1, -1);
        translate(-100 , -height);
      }

      monogram(-15+80 * x, -18+50 * y);

      popMatrix();
    }
  }   
  noLoop();
}

你知道我做错了什么吗？

Answer 1

我建议在setup()中使用标准网格运行一次，而不是使用draw()。以下源代码创建一个 13x12 字母网格。如果您想调整此演示，您可以尝试每个字母组合的宽度和高度设置以及水平和垂直间隙：

void monogram (int x, int y) {
  int los=int(random(0, 255));
  stroke(0, 185, 255, los);
  strokeWeight(5);

  // U //
  noFill();
  arc(x + 25, y + 60, 20, 20, 0, PI);
  line(x + 15, y + 20, x + 15, y + 57);
  line(x + 35, y + 20, x + 35, y + 57);

  // VV //
  noFill();
  beginShape();
  vertex(x + 35, y + 20);
  vertex(x + 55, y + 70);
  vertex(x + 75, y + 20);
  endShape();

  // V //
  noFill();
  beginShape();
  vertex(x + 55, y + 20);
  vertex(x + 75, y + 70);
  vertex(x + 95, y + 20);
  endShape();
}

void monogramGrid(int l, int t, int w, int h, int hg, int vg) { 
  for (int k = 0; k < 13; k++) {
    for (int j = 0; j < 12; j++) {      
     int x = l + j*(w+vg);
      int y = t + k*(h+hg);
      monogram(x,y);
    }
  }
}


void setup() {
  size(1000, 800);
  background(0, 70, 100);
  monogramGrid(0, 0, 80, 60, 0, 0);
}

void draw() { 
}