根据椭圆的速度为椭圆分配颜色

Question

我有 n 个球对象（每个都以随机速度 (0,4) 开始）在屏幕上（在 2D 中）相互碰撞。我想要做的是根据每个球的速度为每个球分配一个颜色，这样速度最高的球（比如 v）具有蓝色，并且随着速度下降，颜色变得越来越红（中间速度取范围彩虹色）。我知道这是一个范围转换问题。

我该怎么做？

我试图获取球的速度大小并将其重新调整到一个范围 (0,255)。然后我使用填充方法给球上色。

public void display(){

    float v = sqrt(pow(this.getDX(),2)+pow(this.getDY(),2));
    int scale = (int)(v * 255)/8;
    stroke(0);

    fill(scale,0,scale);   
    ellipse(this.xpos, this.ypos, this.size ,this.size);
  }
}

我无法获得想要的结果。主要是因为我不知道如何混合颜色，在这种情况下，为最慢的球获得红色，为最快的球获得蓝色。

Answer 1

[...] 使得速度最快的球（比如 v）具有蓝色，并且随着速度的降低颜色变得越来越红（中间速度采用彩虹色的范围）[...]

了解HSL and HSV 颜色范围，并编写一个方法，将 [0.0, 1.0] 范围内的 hue 值转换为 RGB 颜色并设置fill() 颜色：

public void SetFillFromHUE(float hue) {

    float R = Math.abs(hue * 6.0 - 3.0) - 1.0;
    float G = 2.0 - Math.abs(hue * 6.0 - 2.0);
    float B = 2.0 - Math.abs(hue * 6.0 - 4.0);
    fill(R*255.0, G*255.0, B*255.0); 
}

我调查了v 的值始终在 [0, 10.0] 范围内（来自您之前的问题 Buggy bouncing balls。

所以

float v = sqrt(pow(this.getDX(),2)+pow(this.getDY(),2)) / 10.0;

将给出一个取决于速度 v 在范围 [0.0, 1.0] 内的值。

调查 hue 颜色范围，发现 0.0 是红色，0.66 是蓝色。

SetFillFromHUE(v * 2.0/3.0);

设置范围从红色到黄色到绿色到蓝色的颜色。

最终的方法display看起来像这样：

public void display(){

    float v = sqrt(pow(this.getDX(),2)+pow(this.getDY(),2)) / 10.0;

    stroke(0);
    SetFillFromHUE( v * 4.0/6.0 ); 
    ellipse(this.xpos, this.ypos, this.size ,this.size);
}