2010-04-22 41 views
3

我想在屏幕上繪製一些項目,每個項目都在N組中。組的數量總是在變化,所以我需要計算N種不同的顏色,這些顏色儘可能不同(以便識別哪些顏色在哪一組中)。構造最大對比度的顏色

因此,例如對於N = 2,我的結果將是黑色和白色。有三個我想我會得到全紅,全綠,全藍。對於所有四個人來說,正確的答案並不那麼明顯,而這正是我遇到麻煩的地方。

編輯::顯而易見的方法是映射0到紅色,1到綠色,並在所有的顏色之間的適當的彩虹顏色,然後你可以通過做GetRainbowColour(N/TotalSets) ,所以需要GetRainbowColour方法來解決這個問題

回答

4

這個問題的答案是主觀的 - 與全視力的人相比,最好的對比不一定與色盲或視力有限的人或在黑暗環境中操作設備的視力正常的人形成最佳對比。

生理上,人類對色調或飽和度的強度分辨率要好得多。這就是爲什麼模擬電視,數字視頻和照片壓縮會丟棄顏色信息以減少帶寬(4:2:2) - 如果您將兩個不同強度的像素放在一起,則它們的顏色無關緊要 - 我們只能感知顏色差異在類似強度的大面積上。所以如果你試圖展示的東西有許多隻有幾個像素的小區域,或者你希望它在黑暗中使用(在黑暗中,大腦提升藍色細胞,我們看不到顏色)或10%的色盲男性人羣,考慮使用強度作爲主要區分因素而不是色調。 GetRainbowColour會忽略人類視覺最重要的維度,但對連續數據可以很好地工作。

+1

我不知道,謝謝。但是,UI是一個調試UI,因此我知道使用它的人都不是色盲。然而,我會爲未來銘記這一點。 – Martin 2010-04-22 10:45:41

1

謝謝brainjam,建議使用HSL。我掀起了這個似乎很適合堆疊圖形的小函數:

var contrastingColors = function(len) { 
    var result = []; 
    if (len > 0) { 
     var h = [0, 180];      // red, cyan 
     var shft = 360/len; 
     var flip = 0; 
     var l = 50; 
     for (var ix = 0; ix < len; ix++) { 
      result.push("hsl(" + h[flip] + ",100%," + l + "%)"); 
      h[flip] = (h[flip] + shft) % 360; 
      flip = flip ? 0 : 1; 
      if (flip == 0) { 
       l = (l == 50) ? 30 : (l == 30? 70 : 50); 
      } 
     } 
    } 
    return result; 
};