如何使用处理创建适当的渐变

Question

我是编程新手，我想创建如图所示的图表。

size(300,300);
colorMode(HSB,360,100,100);
background(#FFFFFF);


int x,y;
for (x = 0; x <100 ; x++ )
{
  for(y = 0 ; y <100 ; y++)
  {
    stroke (0, x, y );
    rect(y,x,y*3,x*3);

  }
}

当我运行程序时，我得到这样的图，其中缺少图的右下角。

我该如何解决这个问题？

谢谢！

Answer 1

您当前的代码正在绘制一堆具有不同轮廓颜色的白色矩形。图表的左上角就是您要查找的内容。如果你想让它填满整个屏幕，我会这样做：

for (int x = 0; x < 100; x++) {
  for (int y = 0; y < 100; y++) {
    fill(0, x, y);
    rect(map(x, 0, 100, 0, width), map(y, 0, 100, 0, height), width/100, height/100);
  }
}

使用 map() 命令。

Answer 2

这将产生您正在寻找的输出。你可能想看看 lerpColor().

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

void draw(){
  colorMode(HSB,360,100,100);
  background(#FFFFFF);
  
  for (int x = 0; x < width; x++ ){
    for(int y = 0; y < height; y++){
      stroke(0, x, y);
      point(y, x);
    }
  }
}

如何使用处理创建适当的渐变

How can I create proper gradient using processing

java

processing