小編這次要給大家分享的是JavaScript實(shí)現(xiàn)HSL拾色器的方法，文章內(nèi)容豐富，感興趣的小伙伴可以來了解一下，希望大家閱讀完這篇文章之后能夠有所收獲。

成都創(chuàng)新互聯(lián)是一家企業(yè)級(jí)云計(jì)算解決方案提供商,超15年IDC數(shù)據(jù)中心運(yùn)營經(jīng)驗(yàn)。主營GPU顯卡服務(wù)器，站群服務(wù)器，四川綿陽服務(wù)器托管，海外高防服務(wù)器，成都機(jī)柜租用，動(dòng)態(tài)撥號(hào)VPS，海外云手機(jī)，海外云服務(wù)器，海外服務(wù)器租用托管等。

HSL 和 HSV 在數(shù)學(xué)上定義為在 RGB 空間中的顏色的 R, G 和 B 的坐標(biāo)的變換。

從 RGB 到 HSL 或 HSV 的轉(zhuǎn)換

設(shè) (r, g, b) 分別是一個(gè)顏色的紅、綠和藍(lán)坐標(biāo)，它們的值是在 0 到 1 之間的實(shí)數(shù)。設(shè) max 等價(jià)于 r, g 和 b 中的大者。設(shè) min 等于這些值中的最小者。要找到在 HSL 空間中的 (h, s, l) 值，這里的 h ∈ [0, 360）是角度的色相角，而 s, l ∈ [0,1] 是飽和度和亮度，計(jì)算為：

h 的值通常規(guī)范化到位于 0 到 360°之間。而 h = 0 用于 max = min 的（就是灰色）時(shí)候而不是留下 h 未定義。
HSL 和 HSV 有同樣的色相定義，但是其他分量不同。HSV 顏色的 s 和 v 的值定義如下：

從 HSL 到 RGB 的轉(zhuǎn)換

給定 HSL 空間中的 (h, s, l) 值定義的一個(gè)顏色，帶有 h 在指示色相角度的值域 [0, 360）中，分別表示飽和度和亮度的s 和 l 在值域 [0, 1] 中，相應(yīng)在 RGB 空間中的 (r, g, b) 三原色，帶有分別對(duì)應(yīng)于紅色、綠色和藍(lán)色的 r, g 和 b 也在值域 [0, 1] 中，它們可計(jì)算為：
首先，如果 s = 0，則結(jié)果的顏色是非彩色的、或灰色的。在這個(gè)特殊情況，r, g 和 b 都等于 l。注意 h 的值在這種情況下是未定義的。
當(dāng) s ≠ 0 的時(shí)候，可以使用下列過程：

對(duì)于每個(gè)顏色向量 Color = (ColorR, ColorG, ColorB) = (r, g, b),

從 HSV 到 RGB 的轉(zhuǎn)換

類似的，給定在 HSV 中 (h, s, v) 值定義的一個(gè)顏色，帶有如上的 h，和分別表示飽和度和明度的 s 和 v 變化于 0 到 1 之間，在 RGB 空間中對(duì)應(yīng)的 (r, g, b) 三原色可以計(jì)算為：

對(duì)于每個(gè)顏色向量 (r, g, b),

  
  
    

      

        

          
Hue：0
          Your browser does not support canvas
        
        

          
Saturation：0%
          
          
Luminance：0%
          
        
        

      
      

        

          
Hexadecimal：
          
        
        

          
RGB：
          
        
        

          
HSL：
          
        
      
    
    
  

當(dāng)前題目：JavaScript實(shí)現(xiàn)HSL拾色器的方法-創(chuàng)新互聯(lián)
轉(zhuǎn)載來于：http://weahome.cn/article/gihjd.html