Нужно нарисовать график (допустим столбиковую диаграмму) из N-элементов. Для наглядности для каждого "столбика" нужно сгенерить свой цвет. Я подумал, что самый лучший способ такой:
// число цветов-столбиков (получаем с сервера)
var NumCоlor = 24
// число шагов внутри каждого тона цветовой RGB-составляющей
step = Math.round( Math.pow(NumCоlor , 1./3)-1);
// размер шагов внутри каждого тона цветовой RGB-составляющей
step_tone = Math.round(0xFF/step);
// массив из которого будем дергать цвета
DimColor = [];
for (i1=0; i1<=step; i1++ )
for (i2=step; i2>=0; i2-- )
for (i3=0; i3<=step; i3++ ) {
// для контроля и просмотра цветов
document.write("<span style='color:rgb("+i1*step_tone+","+i2*step_tone+","+i3*step_tone+");'>█</span>: ");
document.write("rgb("+i1*step_tone+","+i2*step_tone+","+i3*step_tone+")<br>");
// помещаем цвет в массив
DimColor.push("rgb("+i1*step_tone+","+i2*step_tone+","+i3*step_tone+")");
}
В результате получаем красивую радугу, но... но именно радугу. На диаграмме сложно отличить один столбик от другого... Смена цветовой схемы rgb на hsl принципиально ничего не меняет. Что делать?
Можно перемешать цвета внутри
DimColor, но не факт что они расположатся в контрастном порядке. Кроме того случайное перемешивание будет смущать посетителей, т.к. они каждый раз будут видеть "разные" графики. Есть какие-нибудь готовые алгоритмы чтобы распределить N-цветов максимально взаимно-контрастно?
Простой