无法使用Processing在double for循环中旋转每个单独的元素

时间:2015-10-01 10:51:33

标签: java 2d processing generative

因此,如果你运行这个草图,你会看到一个加号的网格。我想旋转每个人,但我似乎无法弄明白。我试过翻译,pushMatrix / popMatrix。但也许它不在正确的地方。我现在删除它,也许有人可以指出如何围绕它自己的轴旋转每个人加号。

int rib;
void setup() {
  size(1200, 800);
  rib = 7;
}


void draw() {
  background(0);
  for (int i = -100; i < width+100; i = i + rib * 10) {
    for (int j = -100; j < height+100; j = j + rib * 10) {
      noStroke();
      fill(255);

      plus(i, j);
      plus(3*rib+i, 1*rib+j);
      plus(6*rib+i, 2*rib+j);
      plus(9*rib+i, 3*rib+j);
      plus(2*rib+i, 4*rib+j);
      plus(5*rib+i, 5*rib+j);
      plus(8*rib+i, 6*rib+j);
      plus(1*rib+i, 7*rib+j);
      plus(4*rib+i, 8*rib+j);
      plus(7*rib+i, 9*rib+j);
    }
  }
}

void plus(int x, int y) {
  pushMatrix();
  beginShape();
  vertex(x+0, y+0);
  vertex(x+0, y+-rib);
  vertex(x+rib, y+-rib);
  vertex(x+rib, y+0);
  vertex(x+2*rib, y+0);
  vertex(x+2*rib, y+rib);
  vertex(x+rib, y+rib);
  vertex(x+rib, y+2*rib);
  vertex(x+0, y+2*rib);
  vertex(x+0, y+rib);
  vertex(x+-rib, y+rib);
  vertex(x+-rib, y+0);
  endShape(CLOSE);
  popMatrix();
}

2 个答案:

答案 0 :(得分:1)

旋转轴始终位于原点(0,0)。因此,我们必须将原点转换为我们想要旋转轴的位置。在您的情况下,使用它的中心位于(0,0)绘制加号并使用平移将其移动到所需位置。我用更简单的方块制作了这个例子,但想法是一样的。 (我在这里没时间了:) 看看这是否可以帮到你。

void setup() {
  size(1200, 800);
  noStroke();
  fill(255);
}


void draw() {
  background(0);
  float a  = map(mouseY, 0, height, 30, 270);
  for (int i = -100; i < width+100; i+=40) {
    for (int j = -100; j < height+100; j+=40) {

      plus(i, j, a);
    }
  }
}

void plus(int x, int y, float a) {

  pushMatrix();
  translate(x, y);
  rotate(radians(a));
  beginShape();
  vertex(-10, -10);
  vertex(10, -10);
  vertex(10, 10);
  vertex(-10, 10);
  endShape(CLOSE);
  popMatrix();
}

您可能会喜欢这些教程:

http://processing.org/tutorials/transform2d/

https://processing.org/tutorials/pshape/

答案 1 :(得分:1)

第1步:使用pushMatrix()保存当前矩阵的状态。

你需要这样做,因为你不希望轮换累积。如果将一个形状旋转30度,另一个旋转45度,则不希望第二个形状旋转(30 + 45)度。

HerepushMatrix()的参考。

第2步:使用translate()将形状移动到需要的位置。

确保然后以该坐标作为原点绘制您的形状!现在,当你需要在翻译后使用0,0作为原点时,你以x,y为原点绘制形状。

Heretranslate()的参考。

第3步:使用rotate()围绕原点旋转形状。

请记住,您现在已经感动了#34; 0,0到x,你传递到translate()函数!

第4步:画出你的形状。

同样,请记住使用0,0作为原点,而不是x,y。

Hererotate()的参考。

第5步:调用popMatrix()恢复调用`pushMatrix()&#39;时的矩阵。

这会使旋转和平移恢复正常,因此下一次平移和旋转不会累积。

HerepopMatrix()的参考。

第6步:重复。

将上述所有内容放入函数中,然后从for循环中调用它以绘制多个形状。

以下是绘制矩形的简化示例:

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

void draw() {
  background(0);

  noStroke();
  fill(255);

  plus(100, 100);
  plus(200, 200);
}

void plus(float x, float y) {
  pushMatrix();
  translate(x, y);
  rotate(mouseX);
  rect(-20, -40, 40, 80);
  popMatrix();
}