Question

我有一个程序，可以在屏幕上画一个有4个花瓣的花，你可以点击它。我不是一次一个地重做花瓣，而是试图将花旋转四分之一圈，让它覆盖第一朵花，所以看起来有8个花瓣。问题是它在x和y方向上绘制第二朵花与第一朵花相距一定距离，但随着我越接近（0,0），它们越接近重叠（并且在（0,0）处做）。我不确定为什么会发生这种情况，并希望得到任何帮助。我正在使用Processing 3来完成这个程序。

int c_center = 15;
int c_petal = 20;
int petalsize = 70;
color rcol;

void setup(){
  fullScreen();
  background(0);
}

void draw(){
  rcol = color(random(255), random(255), random(255));
}

void mouseClicked(){
  pushMatrix();
  flower();
  translate(mouseX, mouseY);
  rotate(PI/4);
  flower();
  popMatrix();
}

void flower(){
  //left petal
  make_petal(mouseX - (petalsize - c_petal), mouseY, petalsize, c_petal);
  //right petal
  make_petal(mouseX + (petalsize - c_petal), mouseY, petalsize, c_petal);
  //top petal
  make_petal(mouseX, mouseY - (petalsize - c_petal), c_petal, petalsize);
  //bottom petal
  make_petal(mouseX, mouseY + (petalsize - c_petal), c_petal, petalsize);
  //flower center
  fill(random(255), random(255), random(255));
  ellipse(mouseX, mouseY, c_center, c_center);
}

void make_petal(int a, int b, int c, int d){
  fill(rcol);
  ellipse(a, b, c, d);
}

Answer 1

您将两种绘图风格混合在一起：flower()函数使用mouseX和mouseY来确定绘制花瓣的位置，但之后您也调用{{1 }}。因此，您将相对于鼠标绘制花瓣，然后通过鼠标位置移动整个画布，然后再次相对于鼠标绘制更多花瓣。

相反，您可能只想使用一种绘图方式。具体来说，您可能不希望translate(mouseX, mouseY);函数关注鼠标位置。把它当作一个“邮票”来对待flower()的原点。然后通过调用0,0移动原点并通过调用translate()旋转戳记。

Answer 2

由于反馈，我更正了代码，因此现在可以使用以防万一。我通过制作一个花瓣然后将它旋转一圈来浓缩它。

int c_center = 20;
int c_petal = int(random(5, 15));
int petalsize = int(random(30, 60));
color rcol;

void setup(){
  fullScreen();
  background(0);
}

void draw(){
  rcol = color(random(255), random(255), random(255));
}

void mouseClicked(){
  pushMatrix();
  translate(mouseX, mouseY);
  for(int r = 0; r < 360; r+=5){
  rotate(radians(r));
  flower();
  }
  popMatrix();
}

void flower(){
  //petal
  make_petal(0, 0 - (petalsize - c_petal), c_petal, petalsize);

  //flower center
  fill(random(255), random(255), random(255));
  ellipse(0, 0, c_center, c_center);
}

void make_petal(int a, int b, int c, int d){
  fill(rcol);
  ellipse(a, b, c, d);
}

使用pushMatrix（），popMatrix（），translate（）和rotate（）

2 个答案: