javascript中區別顏色的生成

我想知道是否有一個簡單的算法（或jQuery插件）來選擇可區分的顏色，最多約20種不同的顏色。如果沒有，我可以在哪裏找到一系列可直接使用的可區分顏色？javascript中區別顏色的生成

我的用例是爲餅圖生成不同的顏色。

2012-01-24 Benjamin Crouzier

我的想法是從HSV顏色模型開始，在周邊（色調）與最大飽和度和值走：

function hsvToRgb(h, s, v) { 
    //... see e.g.: http://snipplr.com/view/14590 
} 

function distinctColors(count) { 
    var colors = []; 
    for(hue = 0; hue < 360; hue += 360/count) { 
     colors.push(hsvToRgb(hue, 100, 100)); 
    } 
    return colors; 
}

的distinctColors(10)生產：

[[255, 0, 0], [255, 153, 0], [204, 255, 0], [51, 255, 0], [0, 255, 102], [0, 255, 255], [0, 102, 255], [51, 0, 255], [204, 0, 255], [255, 0, 153]]

很難說只看RGB值，但它們應該儘可能不同。我從here開始執行hsvToRgb()。

來源

2012-01-24 13:21:30

+1這是我在這裏使用的方法：http://graphicdivine.co.uk/timeline/。值得一提的是，可以通過調整兩個100的向下來調整飽和度和亮度。 – graphicdivine

另外，爲了清晰起見，變量'saturation'應該可能被命名爲'hue'。 – graphicdivine

@graphicdivine：當然更正了，謝謝！順便說一句，如果錯誤是明顯的:-)，隨意編輯別人的答案。 –

您可以使用例如。 Color Scheme Designer。

我不知道任何會自動執行此操作的JavaScript片段，但是如果您正確定義了「可區分顏色」的術語，則可以創建一個。

還有一個默認list of 16 basic colors in CSS3 (from W3C)：

enter image description here

您可以使用它們，添加許多其他的顏色你喜歡你自己的使用。

來源

2012-01-24 13:13:33 Tadeck

作爲臨時的解決方案，我從維基百科的文章拿起顏色上web colors：

var colors = [ 
    '#0000FF', //blue 
    '#FFFF00', //yellow 
    '#008000', //green 
    '#FFA500', // orange 
    '#FF0000', //red 
    '#800080', //purple 
    '#808000', //olive 
    '#00FF00', //lime 
    '#800000', //maroon 
    '#00FFFF', //aqua 
    '#008080', //team 
    '#000080', //navy 
    '#FF00FF', //fushua 
    '#808080' //gray 
];

來源

2012-01-24 13:18:32

也許這個鏈接可以幫助你：

http://kuler.adobe.com/

這是一個非常有用的工具！

好運

來源

2012-01-24 13:23:53 MCSI