HSL 到 RGB 颜色转换问题

Question

我喜欢随机生成 - 和随机颜色 - 所以我决定将它们结合起来制作一个简单的 2d 景观生成器。我的想法是，根据方块的高度（是的，地形是由方块组成的）使其更亮或更暗，靠近顶部的东西更亮，靠近底部的东西更暗。我让它在灰度下工作，但正如我发现的那样，你不能真正使用基本的 RGB 颜色并使其更亮，因为 RGB 值之间的比率或任何类似的值似乎无法使用。解决方案？ HSL。或者也许是 HSV，老实说我仍然不知道其中的区别。我指的是 H 0-360，S & V/L = 0-100。虽然...嗯，360 = 0，所以是 360 的值，但如果你真的有 0-100，那就是 101。真的是 0-359 和 1-100（或 0-99？），但是颜色选择编辑器（目前指的是 GIMP...MS 画图有超过 100 的饱和度）允许您输入这样的值吗？

无论如何，我找到了 HSL->RGB 转换的公式（here & here。据我所知，最终公式是相同的，但我还是会提供代码（注​​意这是来自后者easyrgb.com链接）：

Hue_2_RGB

float Hue_2_RGB(float v1, float v2, float vH)             //Function Hue_2_RGB
{
if ( vH < 0 )
    vH += 1;

if ( vH > 1 )
    vH -= 1;

if ( ( 6 * vH ) < 1 )
    return ( v1 + ( v2 - v1 ) * 6 * vH );

if ( ( 2 * vH ) < 1 )
    return ( v2 );

if ( ( 3 * vH ) < 2 )
    return ( v1 + ( v2 - v1 ) * ( ( 2 / 3 ) - vH ) * 6 );

return ( v1 );
}

还有另一段代码：

float var_1 = 0, var_2 = 0;

        if (saturation == 0)                       //HSL from 0 to 1
        {
           red = luminosity * 255;                      //RGB results from 0 to 255
           green = luminosity * 255;
           blue = luminosity * 255;
        }
        else
        {
            if ( luminosity < 0.5 )
                var_2 = luminosity * (1 + saturation);
            else
                var_2 = (luminosity + saturation) - (saturation * luminosity);

            var_1 = 2 * luminosity - var_2;

            red = 255 * Hue_2_RGB(var_1, var_2, hue + ( 1 / 3 ) );
            green = 255 * Hue_2_RGB( var_1, var_2, hue );
            blue = 255 * Hue_2_RGB( var_1, var_2, hue - ( 1 / 3 ) );
        }

抱歉，不确定修复这些空白的好方法。

我用我自己的名字、色调、饱和度和亮度替换了 H、S、L 值。我回头看了看，但除非我遗漏了什么，否则我会正确替换它。但是，除了 C++ 所需的部分之外，hue_2_RGB 函数完全未经编辑。 （例如变量类型）。我也曾经对所有东西都有整数 - R、G、B、H、S、L - 然后我想到了...... HSL 是公式的浮点数 - 或者至少，它看起来应该是。所以我使用变量（var_1，var_2，所有的v，R，G，B，色调，饱和度，亮度）来浮动。所以我不相信这是某种数据丢失错误。此外，在输入公式之前，我有色相 /= 360、饱和度 /= 100 和亮度 /= 100。请注意，在此之前，我有色相 = 59、饱和度 = 100 和亮度 = 70。我相信我得到了色调正确为 360 以确保 0-1，但尝试 /= 100 也没有解决它。

所以，我的问题是，为什么公式不起作用？感谢您的帮助。

编辑：如果问题不清楚，请发表评论。

Answer 1

你的前提是错误的。您可以缩放 RGB 颜色。例如，Java 中的 Color 类包括名为 .darker() 和 .brighter() 的命令，这些命令使用 0.7 倍，但您可以使用任何您想要的。

public Color darker() {
    return new Color(Math.max((int)(getRed()  *FACTOR), 0),
                     Math.max((int)(getGreen()*FACTOR), 0),
                     Math.max((int)(getBlue() *FACTOR), 0),
                     getAlpha());
}

public Color brighter() {
    int r = getRed();
    int g = getGreen();
    int b = getBlue();
    int alpha = getAlpha();

    /* From 2D group:
     * 1. black.brighter() should return grey
     * 2. applying brighter to blue will always return blue, brighter
     * 3. non pure color (non zero rgb) will eventually return white
     */
    int i = (int)(1.0/(1.0-FACTOR));
    if ( r == 0 && g == 0 && b == 0) {
        return new Color(i, i, i, alpha);
    }
    if ( r > 0 && r < i ) r = i;
    if ( g > 0 && g < i ) g = i;
    if ( b > 0 && b < i ) b = i;

    return new Color(Math.min((int)(r/FACTOR), 255),
                     Math.min((int)(g/FACTOR), 255),
                     Math.min((int)(b/FACTOR), 255),
                     alpha);
}

简而言之，将所有三种颜色乘以相同的静态因子，您将获得相同的颜色比例。这是一个有损操作，您需要确保卷曲颜色以保持在范围内（这比舍入误差更有损）。

坦率地说，任何从 RGB 到 HSV 的转换都只是数学运算，而更改 HSV V 因子只是数学运算，而将其改回则更数学运算。你不需要这些。你可以做数学。这将使最大分量颜色更大，而不会弄乱颜色之间的比例。

--

如果问题更具体，而您只是想要更好的结果。有更好的方法来计算这个。您可以转换为亮度组件，而不是静态缩放亮度（L 不是指亮度）。基本上以特定方式加权。色彩科学和计算与人类观察者打交道，它们比实际数学更重要。为了解释这些人类的一些怪癖，需要“修复”以更类似于普通人类的感知。亮度缩放如下：

Y = 0.2126 R + 0.7152 G + 0.0722 B

这同样反映在权重 30、59、11 中，这些权重被错误地认为是好的颜色距离权重。这些权重是颜色对人类对亮度的感知的贡献。例如，人类认为最亮的蓝色非常暗。而黄色（与蓝色完全相反）被视为如此明亮，以至于您甚至无法在白色背景下辨认出来。 Y'CbCr 包含的许多色彩空间通过缩放来解释这些亮度感知的差异。然后你可以改变那个值，当你缩小它时它会再次被缩放。

导致不同的颜色，这应该更类似于人类所说的相同颜色的“较浅”版本。这个人类系统有越来越好的近似值，因此使用更好、更奇特的数学来解释它通常会给你带来越来越好的结果。

获取有关这些问题的良好概述。 http://www.compuphase.com/cmetric.htm