十六进制到HSL转换javascript

问题描述：

你好，我试图创建十六进制HSL转换器功能。我知道最初我应该将HEX转换为RGB，然后将RGB转换为HSL。我已经使用了*的一些脚本。 S和L正常工作，但H（色相）不正确。我不知道为什么，这里是我的代码：十六进制到HSL转换javascript

toHSL: function(hex) { 
    var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); 

    var r = parseInt(result[1], 16); 
    var g = parseInt(result[2], 16); 
    var b = parseInt(result[3], 16); 

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

    s = s*100; 
    s = Math.round(s); 
    l = l*100; 
    l = Math.round(l); 

    var colorInHSL = 'hsl(' + h + ', ' + s + '%, ' + l + '%)'; 
    $rootScope.$emit('colorChanged', {colorInHSL});

当输入为#ddffdd

然后输出hsl(0.3333333333333333, 100%, 93%)

但应该是hsl(120, 100%, 93%)。

答

你忘由360

s = s*100; 
s = Math.round(s); 
l = l*100; 
l = Math.round(l); 
h = Math.round(360*h); 

var colorInHSL = 'hsl(' + h + ', ' + s + '%, ' + l + '%)';

乘以色相

十六进制到HSL转换javascript

相关推荐