Processing 中的数学变量

Question

我想在 window 的每个点上制作一个颜色变化的背景，具体取决于处理中该点与 window 中心的距离。我只需要一个变量来指定屏幕的 x 和 y 坐标。我该怎么做？

现在，我尝试在Processing 中定义这样一个变量，但没有成功。但是，我使用内置变量 mouseX 和 mouseY 编写了这段代码。这是我写的代码：

void setup(){
 size(640,360);
 frameRate(144);
}

void draw(){
  int x=0;
  int y=0;
  x=x+1;
  y=y+1;
  float d=dist(width/2,height/2, mouseX,mouseY);
  float maxd=dist(width/2,height/2, width,height);
  float colour=map(d,0,maxd,0,255);
 stroke(50,20,30);
 strokeWeight(2);
 for(x=0; x<width; x=x+20){
  for(y=0; y<height; y=y+20){
    rect(x,y,20,20);
    fill(colour);
  }
 }
}

它如我所料完美运行。现在，我只需要一些变量（比如在某个定义范围内更改值的数学变量）来指定屏幕上每个点的坐标。任何提示表示赞赏。

Answer 1

您已经完成了使用此嵌套 for 循环描述的大部分内容：

for(x=0; x<width; x=x+20){
  for(y=0; y<height; y=y+20){

这个嵌套的 for 循环创建了 x 和 y 变量，它们遍历帧中的每个点。

从这里开始，您可以使用这些变量来计算颜色。这是一个简化的例子：

for(x=0; x<width; x=x+20){
  for(y=0; y<height; y=y+20){
    fill(x, y, 0);
    rect(x, y, 20, 20);
  }
 }

此代码现在在 fill 颜色的计算中直接使用 x 和 y 变量。

从这里，您可以添加根据 0,0 和 x,y 之间的距离计算颜色的逻辑。您也已经拥有了大部分逻辑，但是您需要将其移动到这个嵌套的 for 循环中。

无耻 self-promotion：here is a tutorial on for loops, and here 是一些使用 for 循环的示例，包括在每个点绘制不同颜色的示例。

Processing 中的数学变量

Mathematical variable in Processing

processing