为什么这个Javascript RGB到HSL代码不起作用？

Question

我在http://www.mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript处发现了此RGB到HSL脚本。我找不到任何其他体面的小人物。问题是这个代码甚至没有真正的工作。有人会知道为什么吗？ （我不知道一点颜色的数学，但也许它的返回互补？）

function rgbToHsl(r, g, b){ 
    r /= 255, g /= 255, b /= 255; 
    var max = Math.max(r, g, b), min = Math.min(r, g, b); 
    var h, s, l = (max + min)/2; 

    if(max == min){ 
     h = s = 0; // achromatic 
    }else{ 
     var d = max - min; 
     s = l > 0.5 ? d/(2 - max - min) : d/(max + min); 
     switch(max){ 
      case r: h = (g - b)/d + (g < b ? 6 : 0); break; 
      case g: h = (b - r)/d + 2; break; 
      case b: h = (r - g)/d + 4; break; 
     } 
     h /= 6; 
    } 

    return [h, s, l]; 
} 

编辑：当我运行rgbToHsl(126,210,22)它给我[0.24，0.81，0.45]，这是HSL为橙色。

Answer 1

生成的HSV阵列必须被解释为三个部分。对于某些程序，如果要将HSV表示为整数，则将“H”值乘以360，将“S”和“V”值乘以100.将您引用的绿色阴影RGB的HSV值[126,210， 22]是HSV [87,81,45]整数。你可以改变的功能，如果你想回到这样的整数：

function rgbToHsl(r, g, b){ 
    r /= 255, g /= 255, b /= 255; 
    var max = Math.max(r, g, b), min = Math.min(r, g, b); 
    var h, s, l = (max + min)/2; 

    if(max == min){ 
     h = s = 0; // achromatic 
    }else{ 
     var d = max - min; 
     s = l > 0.5 ? d/(2 - max - min) : d/(max + min); 
     switch(max){ 
      case r: h = (g - b)/d + (g < b ? 6 : 0); break; 
      case g: h = (b - r)/d + 2; break; 
      case b: h = (r - g)/d + 4; break; 
     } 
     h /= 6; 
    } 

    return [Math.floor(h * 360), Math.floor(s * 100), Math.floor(l * 100)]; 
} 

[编辑]中说，它仍然给我用这大大太暗亮度（“L”或“V”）的东西; Gimp说HSV值应该是[90,80,82]，或者是分数形式[.20，.80，.82]。

[另一编辑]一个问题可能是HSL和HSV是不同的方案...仍然环顾四周。

的情况下，任何人都OK想RGB到HSV（像你在GIMP例如看）这里有一个版本是：

function rgbToHsv(r, g, b) { 
    var 
     min = Math.min(r, g, b), 
     max = Math.max(r, g, b), 
     delta = max - min, 
     h, s, v = max; 

    v = Math.floor(max/255 * 100); 
    if (max != 0) 
     s = Math.floor(delta/max * 100); 
    else { 
     // black 
     return [0, 0, 0]; 
    } 

    if(r == max) 
     h = (g - b)/delta;   // between yellow & magenta 
    else if(g == max) 
     h = 2 + (b - r)/delta;  // between cyan & yellow 
    else 
     h = 4 + (r - g)/delta;  // between magenta & cyan 

    h = Math.floor(h * 60);   // degrees 
    if(h < 0) h += 360; 

    return [h, s, v]; 
} 

Answer 2

以下功能RGB颜色转换成色相饱和度颜色，如Photoshop拾色器，结果是在所述范围：

• 色相0-360（度）
• 饱和度：0-100（％）
• 亮度：0-100（ ％）

我还是不明白为什么人们用它代替HSB（色调，饱和度亮度术语HSV（色调，饱和度值）），反正这是FO术语的问题，其结果都是一样的

//Converts to color HSB object (code from here http://www.csgnetwork.com/csgcolorsel4.html with some improvements) 
    function rgb2hsb(r, g, b) 
    {  
    r /= 255; g /= 255; b /= 255; // Scale to unity. 
    var minVal = Math.min(r, g, b), 
    maxVal = Math.max(r, g, b), 
    delta = maxVal - minVal, 
    HSB = {hue:0, sat:0, bri:maxVal}, 
    del_R, del_G, del_B; 

    if(delta !== 0) 
    { 
     HSB.sat = delta/maxVal; 
     del_R = (((maxVal - r)/6) + (delta/2))/delta; 
     del_G = (((maxVal - g)/6) + (delta/2))/delta; 
     del_B = (((maxVal - b)/6) + (delta/2))/delta; 

     if (r === maxVal) {HSB.hue = del_B - del_G;} 
     else if (g === maxVal) {HSB.hue = (1/3) + del_R - del_B;} 
     else if (b === maxVal) {HSB.hue = (2/3) + del_G - del_R;} 

     if (HSB.hue < 0) {HSB.hue += 1;} 
     if (HSB.hue > 1) {HSB.hue -= 1;} 
    } 

    HSB.hue *= 360; 
    HSB.sat *= 100; 
    HSB.bri *= 100; 

    return HSB; 
    } 

用例：

var hsb = rgb2hsb(126,210,22); 
alert("hue = " + hsb.hue + "saturation = " + hsb.sat + "brightness = " + hsb.bri);