¿Por qué no funciona este código Javascript RGB a HSL?

Encontré este script RGB a HSL en http://www.mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript . No puedo encontrar otros pequeños decentes. El problema es que este código ni siquiera funciona realmente. ¿Alguien sabría por qué? (No sé un poco de color matemático, pero tal vez es devolver el complemento?)

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]; } 

Editar: cuando ejecuto rgbToHsl(126,210,22) me da [.24, .81, .45], que es el HSL para un color naranja.

2 Solutions collect form web for “¿Por qué no funciona este código Javascript RGB a HSL?”

La matriz de HSV resultante debe interpretarse como tres fracciones. Para algunos progtwigs, si desea express HSV como integers, multiplica el valor "H" por 360 y los valores "S" y "V" por 100. El valor HSV que cita para su sombra verde RGB [126, 210, 22] es HSV [87, 81, 45] en numbers integers. Puede cambiar la function para devolver dichos integers si lo desea:

 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] que dijo, todavía me está dando algo con un brillo ("L" o "V") que es considerablemente demasiado oscuro; Gimp dice que el valor de HSV debe ser [90, 80, 82] o en términos fraccionarios [.20, .80, .82].

[Otra edición] bueno, un problema podría ser que HSL y HSV son diferentes esquemas … todavía mirando a su alnetworkingedor.

OK en caso de que alguien quiera RGB a HSV (como lo vería en Gimp por ejemplo) aquí hay una versión de eso:

 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]; } 

La function a continuación convierte el color RGB en el color de Brillo de Saturación Hue como el selector de color de Photoshop, los resultados están en los ranges:

  • Hue 0-360 (grados)
  • Saturación: 0-100 (%)
  • Brillo: 0-100 (%)

Todavía no entiendo por qué las personas usan el término HSV (Valor de saturación de tono) en lugar de HSB (Brillo de saturación de tono), de todos modos es una cuestión de terminología, los resultados son los mismos

  //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; } 

Ejemplo de uso:

 var hsb = rgb2hsb(126,210,22); alert("hue = " + hsb.hue + "saturation = " + hsb.sat + "brightness = " + hsb.bri); 
  • Gradiente de color Javascript
  • Convierta una image a una matriz RGB en Javascript
  • cómo ver si un color rgb es demasiado claro
  • Colores aleatorios con preference
  • Profundidad del pixel vs. Profundidad del color
  • ¿Cómo optimizar el time de ejecución para la function de conversión de RGB a HSL?
  • Expresión regular de Javascript para valores de rgb
  • Color de background hex a variable de JavaScript
  • Cambiar el tono de un color RGB en javascript
  • Convierta RGBA en RGB teniendo en count el background
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.