处理For循环序列

Question

我正在尝试沿 canvas 的 y 轴和 x 轴依次绘制几个椭圆。这些点是在随机的 y 位置绘制的。

我之前在 x 轴上按顺序在随机高度绘制椭圆。然而，沿 y 轴的所有椭圆都是一次绘制的。

 for (int x = 0; x < xStep; x++) {
    int mh = int(map(noise(offset+(x*0.05)), 0, 1, 0, h));


    for (int y = mh; y > mh - 3; y--) {
      ellipse(x*diam, y*diam, diam, diam);
    }
  }
  xStep++;
  if (xStep > w) {
    xStep = 0;
    offset = random(1000);
  }

然后我继续添加另一个 for 循环以尝试沿 y 轴和 x 轴对椭圆进行排序。因此，在绘制下一列（x 轴）之前，每个椭圆在 y 轴上一个接一个地绘制。但是，使用下面的代码，我得到的是 y 轴和 x 轴 'drawing' 的顺序，但同时在视觉上看起来不像在绘制下一列之前完成一行。

  //count rows and frames
  if (counter > 7) {
    counter = 0;
    rowCounter++;
  }

for (int j=0; j<7; j++) { //set values to match counter
        if (j == counter){

          for (int x = 0; x < xStep; x++) {
            int mh = int(map(noise(offset+(x*0.05)), 0, 1, 0, h));

            for (int y = mh; y > mh - 3; y--) {
              y=y-j;
              ellipse(x*diam, y*diam, diam, diam);

            }
          }
        }
      }
  xStep++;

  counter++;

  if (rowCounter > 7) {
    rowCounter = 0;
  }

  if (xStep > w) {
    xStep = 0;
    offset = random(1000);
  }

或者，如果我尝试对 xStep 使用条件，我只会绘制一行椭圆。

  //count rows and frames
  if (counter > 7) {
    counter = 0;
    rowCounter++;
  }

  for (int j=0; j<7; j++) { //set values to match counter
    if ((j == counter) && (xStep != lastXstep)) {

      for (int x = 0; x < xStep; x++) {
        int mh = int(map(noise(offset+(x*0.05)), 0, 1, 0, h));

        for (int y = mh; y > mh - 3; y--) {
          y=y-j;
          ellipse(x*diam, y*diam, diam, diam);
          xStep=lastXstep;
        }
      }
    }
  }

  xStep++;

  counter++;

  if (rowCounter > 7) {
    rowCounter = 0;
  }

  if (xStep > w) {
    xStep = 0;
    offset = random(1000);
  }

任何人都可以帮助指出我在 for 循环构造中出错的方向吗？谢谢

Answer 1

请记住，每次调用 draw() 函数都会绘制一个帧。处理是双缓冲的，所以屏幕直到 draw() 函数结束时才更新。这就是为什么您只看到最终结果而不是中间步骤的原因。

如果要渲染中间步骤，则必须将其拆分为多个帧。为此，您可以在一组变量中跟踪程序的状态，随时间改变这些变量，并使用这些变量绘制每一帧。

无耻的自我推销：here 是 Processing 中的动画教程，更详细地描述了上述方法。

处理For循环序列

Processing For loop sequence

processing

ellipse

sequence