グラフのプロット線の色を選択するためのアルゴリズムは何ですか？

プロットラインのRGBまたはHSVカラーを生成し、視覚的に隣人と区別できるようにするために、プログラムで実装できるアルゴリズムまたはルールに興味があります。

プロの地図作成には、地図上の隣接する2つの国が同じ色にならないようにするアルゴリズムまたはルールがあることを知っています。Microsoft Office Excelは、プロットラインに適した濃淡/陰影（赤、青、紫/オレンジ）を選択していると考えることもできます。

これが私が話していることの例です-黒の背景に12行の色を生成する必要があります。ここの色は、WebセーフRGBカラーコードを使用して手動でハードコーディングしました。これらの線が重なったときに問題が発生します-紫、やや濃い紫、または紫を見ているかどうかを判断するのは困難です。これらのようなプロットラインの色を生成するためのより良いアルゴリズムを探しています。

以下は、jQueryのFlotプロットライブラリを使用した例です。グラフの色が連続して表示されています。

HSVとHSLは、人間とは異なる色を生成するためによりよく構成されているため、RGBカラースペースではなく、HSVまたはHSLカラースペースを使用することをお勧めします。RGBでより多くの作業が必要になります（必要に応じて、前後に変換が存在します）。

HSV / HSLは次のようになります。

HSVまたはHSL色空間を使用する場合、2つの色のH（色相）成分の差は色間の知覚距離の適切な近似であると（非常に大雑把に）推測できます。つまり、色相の変化が大きいほど、異なる色が人間に見えます。S（彩度）とL / V（明度/値）を試して、さらにいくつかの非常に異なる色を発色させることもできますが、同じ値の変化に対して色相を変えても同じようには見えません。

必要な個別の色の数に応じて、色相空間をその数の異なる色に分割できます。たとえば、256の値の色相範囲があり、16の異なる色が必要な場合、最初の色は（0、128、128）、2番目の色は（16、128、128）などになります。私はここで中央のS / L値を多少勝手に選んだ。これは通常、色の違いをはっきりと見るのに十分なほど飽和しているからだ。このシステムは単純であり、グラフ/マップの色の隣接について何も知る必要がないことを前提としています。

必要な個別の色の数が事前にわからないが上限がわかっている場合、上記のように上限を念頭に置いて色相範囲を色に分割すると、知覚的に異なる色が得られます。同じシステムを使用できます上限。

非常に多くの異なる色が必要な場合は、同様の色を持つグラフの他の要素の近くに表示されない限り、非常に類似した色または同じ色を使用しても問題ありません。これには、レンダリングしているグラフの隣接状況を知る必要があり、必ずしも簡単ではない場合がありますが、それでもダケリングがコメントで指摘しているように良いアイデアではない場合があります：同じ色が使用されていることを視聴者に混乱させる2つの異なる概念のグラフで2回。

最後に、最も複雑な状況では、グラフが十分に複雑であるため、上記のシステムを使用して似たような色の異なる要素にならないように十分な色空間がありません。この場合、視覚化グラフの要素の隣接グラフを作成する必要があります。ここでの隣接関係はあいまいな概念です。実際の状況に合わせて正しく定義する必要があります。たとえば、2番目の例では、7月12日のデータにチョークポイントがあり、すべての色が1つおきに隣接しています。隣接グラフを構築できる場合に役立つ方法の1つは、グラフの色付けの問題です。たとえば、C ++のboost :: graphなどのライブラリがあります。

別の興味深いアルゴリズムが必要になる個別の色の数が事前にわからない場合は、黄金比アルゴリズムです。

好きな色から始めて、黄金角（137.5°）のステップでカラーホイールを回ってください。この角度を使用すると、カラーホイールの周りのすべての畳み込みの後、新しい色が既に作成した色の間に収まるようになります。

（ウィキペディアからの画像）

少し実験してみたところ、HSL / HSVを使用しても、邪魔にならず、落ち着いた（すべて非常に主観的ですが）適切なアルゴリズムを取得するのは簡単ではありませんが、対照的な色です。幽霊の一部は視覚的に似ています-特に。緑青セクション。そのため、明るさのバリエーションを追加する必要がありました。

ここに私が終わったものがあります：

$.plot($('#application_pie'), data_application_pie, {
    series: { pie: { show: true,  innerRadius: 0.55, offset: { top: 0, left: -120 } } },
    colors: $.map( data_application_pie, function (item, index) {
        return jQuery.Color({
            hue: (index*0.95*360/data_application_pie.length),
            saturation: 0.95,
            //lightness: (index%2/-4)+0.55, alpha: 1
            lightness: ((index%4 == 3 ? 1:0)/-4)+0.55, alpha: 1
        }).toHexString();
    })
});