Генерировать уникальные цвета
Я хочу нарисовать некоторые данные в текстуру: много элементов подряд. Они не созданы по порядку, и все они могут быть разных размеров (подумайте о куче памяти). Каждый элемент данных представляет собой небольшой прямоугольник, и я хочу иметь возможность различать их по отдельности, поэтому я бы хотел, чтобы каждый из них имел уникальный цвет.
Теперь я мог бы просто использовать rand() для генерации значений RGB и надеяться, что они все разные, но я подозреваю, что я не получу хорошего распределения в пространстве RGB. Есть ли лучший способ, чем этот? Например, каков хороший способ циклически проходить через разные цвета, прежде чем они (почти) повторятся?
Цвета не должны совпадать с какими-либо данными в элементах. Я просто хочу иметь возможность смотреть на многие значения и видеть, что они разные, так как они смежные.
Я мог кое-что понять, но я думаю, что это интересный вопрос.:)
6 ответов
Использование цветовой модели RGB не является хорошим способом получить хорошее сочетание цветов. Лучше использовать другую цветовую модель для генерации вашего цвета, а затем конвертировать из этой цветовой модели в RGB.
Вместо этого я предлагаю вам цветовую модель HSV или HSL, в частности, вы хотите изменить оттенок.
Если вы хотите, чтобы X различало значения цвета, измените их от 0 до 360 с размером шага 360, деленным на X.
Какое у вас место для проб... сколько предметов мы говорим?
Вы можете создать массив RGB троек из
for(int r = 0; r < 255; r = r+16)
for(int g = 0; g < 255; g = g+16)
for(int b = 0; b < 255; b = b+16)
// take r, g, b and add it to a list
Затем рандомизируйте свой список и просматривайте его. это даст вам 16^3 (4096) разных цветов перед повторным.
В общем, RGB не является отличным цветовым пространством для таких вещей, потому что он воспринимается нелинейно, для начала. Это означает, что равные расстояния, перемещаемые между RGB-триплетами, не выглядят одинаково разными для наших глаз.
Я бы, вероятно, работал в пространстве L*c*h* ( см. Также), или в пространстве HSL, и просто генерировал бы равномерный интервал в оттенке. Эти пространства были разработаны так, чтобы быть приблизительно перцепционно линейными.
Google "Delta E CIE 2000"; Формула цветового различия полезна для определения видимого (визуального) расстояния между 2 цветами. (На мониторе; есть другая формула для пигментов.) Он работает с цветами в пространстве Lab (props to simon), но применяет перцептуальный расчет разницы.
Мы обнаружили, что число около 1,5 было достаточным для обеспечения визуально отличных цветов (т.е. вы можете определить разницу, если они находятся рядом друг с другом), но если вы хотите идентифицировать цвета (вы можете найти любой цвет в легенде), вам нужно поднять это.
Что касается создания набора цветов... Я, вероятно, начну с некоторого угла пространства Lab и обойду его, используя размер шага, который дает достаточно большие визуальные различия (примечание: он не линейный, поэтому размер шага, вероятно, придется быть адаптивным), а затем рандомизировать список.
Это очень похоже на четырехцветную проблему, связанную с раскрашиванием карт, и это может дать вам несколько интересных решений:
Если вам просто нужен набор воспринимаемых разных цветов (а не алгоритм для их генерации), я создал бесплатный инструмент на своем сайте, который делает именно это:
http://phrogz.net/css/distinct-colors.html
Вместо того, чтобы просто использовать равномерное расстояние в пространстве RGB или HSV (которые не распределены равномерно по отношению к человеческому восприятию), инструмент позволяет вам генерировать сетку значений в пространстве HSV, а затем использует стандарт CMC(I:c) для цвета расстояние, чтобы выбрасывать цвета, которые воспринимаются слишком близко друг к другу. (Ползунок "Порог" на второй вкладке позволяет вам контролировать визуально различимые цвета, показывая результаты в реальном времени.)
В конце концов, вы можете отсортировать список сгенерированных цветов по различным критериям, а затем равномерно "перемешать" этот список, чтобы гарантировать, что в списке будут визуально различимые значения, смежные друг с другом. (Я рекомендую значение Interleave около 5).
На момент написания этой статьи инструмент хорошо работал с Chrome, Safari и (через прокладку) Firefox; IE9 не поддерживает ползунки ввода диапазона HTML5, которые пользовательский интерфейс широко использует для интерактивного исследования.