Tento skript RGB na HSL jsem našel na http://www.mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript. Nemohu najít žádné další malé slušné. Problém je v tom, že tento kód ani ve skutečnosti nefunguje. Věděl by někdo proč? (Neumím trochu barevnou matematiku, ale možná to vrací komplementární?)
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]; }
Upravit:když spustím rgbToHsl(126,210,22)
dává mi [ .24, .81, .45 ], což je HSL pro oranžovou barvu.
Odpověď
Výsledné pole HSV je třeba interpretovat jako tři zlomky. U některých programů, pokud chcete vyjádřit HSV jako celá čísla, vynásobíte hodnotu „H“ 360 a hodnoty „S“ a „V“ 100. Hodnota HSV, kterou uvádíte pro zelený odstín RGB[126, 210, 22] je HSV [87, 81, 45] v celých číslech. Můžete změnit funkci tak, aby vracela taková celá čísla, pokud chcete:
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)]; }
[edit] to znamená, že mi to stále dává něco s jasem („L“ nebo „V“), který je značně příliš tmavý; Gimp říká, že hodnota HSV by měla být [90, 80, 82] nebo ve zlomcích [0,20, 0,80, 0,82].
[další úprava] no, jeden problém by mohl být ten, že HSL a HSV jsou různá schémata… stále se rozhlížím.
OK pro případ, že by někdo chtěl RGB do HSV (jako byste to viděli například v Gimpu), zde je jeho verze:
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]; }