0

私は現在、JavaScriptでランダムな16進数の色を生成するために以下を使用しています:

function getColor(){
     return '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6);
}

これらの色のいずれかが生成されるたびに、配列にプッシュされます。

var colors = new Array();

getColor 関数が常に最初に「全体」の色から選択するようにします。「赤」(#FF0000) や「黄」(#FFFF00) などで、これらすべての「全体」の色が色の配列と照合して既に取得されていることを確認した後でのみ、次のようなよりあいまいな/混合色を提供する必要があります。 'GreenYellow' (#ADFF2F) など

したがって、本質的に、関数は最終的に色の配列に存在するすべての 16 進数ベースの色を設定する必要があります。最も強い色 (「全体」の色と呼んでいるもの) から始めて、より弱い「混合された」色に移動し、最後に黒で終了します。それはすべての中で最も望ましくないと見なされるためです。

残念ながら、私が望む正確な順序で色の完全な配列を提供し、それらを反復する以外にどこから始めるべきか本当にわかりません。

これは、ハンマーを使ってナッツを割るようなものです。他のよりエレガントなソリューションは大歓迎です。

前もって感謝します。

注意:ここで使用した用語が正確ではないことは理解していますが、「全体の」色の意味を理解していただければ幸いです。私はそれを明確にするためのより良い方法を本当に考えることはできません。

編集:これが必要な理由について少し理解するのに役立つかもしれません。色は、ユーザーが自分でグループ化するときに、同じグループで始まるアイテムを視覚的に識別するために使用されます。ほとんどの場合、数グループしかなく、平均して 20 ～ 30 人程度です。したがって、より似ている色に移る前に、はっきりと見えて互いに区別できる強い色を使用するのが理にかなっています。

4

2 に答える 2

3

異なって見える色を生成することは、数学よりも人間の知覚に関係しています。RGB 値で同じ距離離れている一部の色のペアは、他の色のペアよりも似ています。

それでも、RGBでこれを理解したいとは思わない。代わりに、HSL または HSV で色を生成してみてください: http://en.wikipedia.org/wiki/HSL_and_HSV

これにより、人間が色について知覚する属性に近い色相、彩度、明るさを制御できます。次に、他の属性を一定にして色相を変化させることで色を生成できます。

// assume hue is in degrees here
// think of hue like a circle with each angle a different color.
red     = hsv(0,   1, 1);
green   = hsv(120, 1, 1);
blue    = hsv(240, 1, 1);

次に、色相空間をより細かく分割し始めることができます。

yellow  = hsv(60,  1, 1);
cyan    = hsv(180, 1, 1);
magenta = hsv(300, 1, 1);

色相が互いに近くなったら、彩度または明るさを落として、もう一度やり直してください。

// run through all hues again but with half the value
darkRed = hsv(0, 1, 0.5);

// run through all hues again but with half the saturation
lightRed = hsv(0, 0.5, 1);

// run through all hues again but with half the value and half the saturation
desatRad = hsv(0, 0.5, 0.5);

次に、彩度/値の空間を 0.25 と 0.75 に分割することもできます。私が説明したのは、可能な限りユニークな色を生成し、最も太字/最も明るい色を最初に返す再帰アルゴリズムの戦略です。また、ランダムである必要がないため、ランダムでもありません。

必要なのは、javascript の hsv/hsl から 16 進数へのライブラリーだけです。これはどこかにあると確信しています。

于 2013-04-02T20:55:59.320 に答える
0

人間の目には #0000FF と #0000FE を区別するのが非常に難しいため、カラーパターンを 256 色以下に減らすと、その色の量で十分な場合に簡単になります。

その配列で繰り返されない色が必要であることを理解したかどうかはわかりません。その場合は、一意の色を取得するために以前の値と照合する必要があります。

于 2013-04-02T21:00:03.430 に答える