Quais algoritmos existem para escolher cores para linhas de plotagem em gráficos?

Estou interessado em quais algoritmos ou regras posso implementar programaticamente para gerar cores RGB ou HSV para linhas de plotagem para mantê-las visualmente distintas das vizinhas.

Sei que na criação profissional de mapas existem algoritmos ou regras que garantem que não haja dois países adjacentes em um mapa da mesma cor. Também posso pensar no Microsoft office Excel como escolher boas tonalidades / tons para linhas de plotagem (vermelho, azul e roxo / laranja).

Aqui está um exemplo do que estou falando - preciso gerar cores para 12 linhas em um fundo preto. As cores aqui foram codificadas manualmente usando códigos de cores RGB seguros para a Web. O problema surge quando essas linhas se sobrepõem - é difícil dizer se alguém está olhando para roxo, roxo ou violeta ligeiramente mais escuro. Estou procurando um algoritmo melhor para produzir cores para tramas como essas.

Aqui está um exemplo usando a biblioteca de plotagem Flot para jQuery, que possui uma boa sucessão de cores para gráficos:

Eu recomendo usar os espaços de cores HSV ou HSL, não o espaço de cores RGB, porque o HSV e o HSL são melhor estruturados para gerar cores que parecem diferentes para os seres humanos. Você terá mais trabalho em RGB (embora existam conversões para frente e para trás, caso precise delas).

É assim que o HSV / HSL se parece:

Ao usar o espaço de cores HSV ou HSL, você pode assumir (mais ou menos) que a diferença entre os componentes H (matiz) de duas cores é uma boa aproximação da distância perceptiva entre as cores - ou seja, quanto maior a mudança de matiz, mais diferentes as cores vão olhar para os seres humanos. Você pode tentar tocar com S (saturação) e L / V (luminosidade / valor) e também obter mais algumas cores muito diferentes, mas elas não parecerão tão diferentes para a mesma alteração de valor quanto para variar a tonalidade.

Dependendo do número de cores distintas necessárias, é possível dividir o espaço da tonalidade nesse número de cores diferentes. Se, por exemplo, você tiver um intervalo de matiz de 256 valores e precisar de 16 cores distintas, sua primeira cor poderá ser (0, 128, 128), sua segunda (16, 128, 128) e assim por diante. De certa forma, escolhi arbitrariamente os valores S / L bem no meio aqui, pois geralmente serão leves e saturados o suficiente para ver claramente as diferenças de cores. Este sistema é simples e assume que você não precisa saber nada sobre adjacência de cores em seu gráfico / mapa.

Se você não conhece antecipadamente quantas cores distintas precisa, mas conhece o limite superior, e dividir o intervalo de matizes em cores com esse limite superior em mente, como acima, ainda fornece boas cores perceptivamente diferentes, então você pode usar o mesmo sistema com o limite superior.

Se você precisar de muitas cores distintas, ainda poderá usar cores muito semelhantes ou até as mesmas, desde que elas não apareçam perto dos outros elementos do gráfico que possuem a mesma cor. Isso exige que você conheça sua situação de adjacência no gráfico que você está processando e nem sempre seja direto, e mesmo assim pode não ser uma boa ideia, como Dukeling aponta nos comentários: pode ser confuso para os espectadores que a mesma cor seja usada duas vezes no gráfico para dois conceitos diferentes.

Portanto, finalmente, na situação mais complexa, seu gráfico é complexo o suficiente para que você não tenha espaço de cores suficiente para garantir que você não termine com elementos distintos com cores muito semelhantes no sistema acima. Nesse caso, você precisa criar um gráfico de adjacência de elementos do seu gráfico de visualização. A adjacência aqui é um conceito confuso - você terá que defini-lo corretamente para sua situação real. Por exemplo, no seu segundo exemplo, os dados de 12 de julho têm um ponto de estrangulamento em que todas as cores são adjacentes a todas as outras. Uma abordagem que pode ajudá-lo se você pode criar o gráfico de adjacência é o problema de coloração do gráfico - existem bibliotecas que podem ajudá-lo - por exemplo, boost :: graph em C ++ .

Para o caso em que você não conhece antecipadamente quantas cores distintas precisará de outro algoritmo interessante, é o algoritmo da proporção áurea .

Simplesmente comece com a sua cor favorita e, em seguida, rode a roda de cores em passos do ângulo dourado (137,5 °). Com esse ângulo, você garantirá que, após cada convolução na roda de cores, suas novas cores caiam entre as cores que você já criou.

(Imagem da wikipedia )

Eu experimentei um pouco e descobri que, mesmo com HSL / HSV, não é fácil obter um algoritmo decente para cores agradáveis, imperturbáveis ​​e calmantes (todas bastante subjetivas, mas ...) e ainda contrastantes. Algumas partes do espectro são visualmente semelhantes - esp. a seção verde-azul. Então eu tive que adicionar alguma variação de leveza.

Aqui está o que eu acabei com:

$.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();
    })
});