Меню
Что нового?

Поиск похожих цветов

igor_ua

igor_ua

Новичок
Поиск похожих цветов

Здравствуйте, задача такая есть:
есть товары, каждому товару назначают руками цвет, затем нужно, чтобы пользователь ткнув в палитре на желаемый цвет смог найти все товары примерно такого цвета +/-.

Подскажите пожалуйста что можно почитать на эту тему и в какую сторону стоит смотреть?

Нашел вот статью
Поиск ближайшего цвета в палитре http://algolist.manual.ru/graphics/find_col.php
fi = 30*(Ri-R0)^2+59*(Gi-G0)^2+11*(Bi-B0)^2

я так понимаю можно как-то от нее отталкиваться? В общем, спасибо за любые идеи.

Спасибо.

-~{}~ 21.05.09 14:59:

цвет можем хранить как угодно: в rbg например.
т.е. нужно хранить (в бд) цвет товара:
R0
G0
B0

и, например, человек выбирает для поиска цвет R1, G1, B1
и нам нужно сделать диапазон:
Найти все товары у которых
(R1 - X) <= R0 <= (R1 + X)
&&
(G1 - Y) <= G0 <= (G1 + Y)
&&
(B1 - Z) <= B0 <= (B1 + Z)

где X, Y, Z - влияет на точность совпадения цвета.
Такой метод будет работать?

Спасибо!
 

SiMM

Новичок
> Такой метод будет работать?
Он будет выполнять именно то, что определяется логикой. Насколько это будет близко к ощущениям человека можно узнать экспериментальным путём - возьмите да попробуйте - за Вас этого никто делать не будет.
 
igor_ua

igor_ua

Новичок
думаю что такую задачу вряд ли решают методом проб.
Какой смысл писать что-то используя ложный алгоритм? Мне кажется проще спросить у знающих людей правильно ли это или нет.

Еще нашел такое, что похожие цвета лучше искать в цветовом пространстве HSV или HSL.
Но опять же, может кто-то знает, достаточно искать только по тону (Hue)? Или все же SV тоже сильно влияет?
 

dimagolov

Новичок
Тут несколько преобразований.

Есть некая формула, которая преобразует цвет RGB в двумерные координаты XY, то есть f1(R, G, B) = (X, Y)
Есть некая фигура на плоскости (x, y), которая описывает "близость". На плоскости это обычно круг, то есть точки (X, Y) близки к (x, y) если (X-x)^2 + (Y-y)^2 <= R^2

для того, чтобы получить условие близости по цветам, то надо перевести (x, y) в (r,g,b), а (X, Y) в (R,G,B) и подставить в условие "близости"

-~{}~ 21.05.09 09:23:

можно упростить "близость" и ввести просто квадрат, то есть |X-x| <= R && |Y-y| <= R, считать будет много проще...
 
igor_ua

igor_ua

Новичок
dimagolov
Cпасибо.

Попробую с этим разобраться.

-~{}~ 21.05.09 15:33:

Т.е. на сколько я понял, нам нужно будет задать R - радиус (который указывает на сколько нам нужно точное совпадение),
далее, когда вводим X0,Y0 (цвет который вводит пользователь для поиска), вычисляем 2 граничных значения для X0 (X1, X2) и 2 граничных значения для Y0 (Y1, Y2)
И потом уже ищем среди наших товаров, те цвета (цвет товара Xn,Yn), которые удовлетворяют условию:
(X1 <= Xn <= X2) && (Y1 <= Yn <= Y2)

Верно ли я понял?

-~{}~ 21.05.09 15:47:

Ну в общем похоже что RGB нельзя перевести в плоскость XY, нужна третья координата. И тогда это получается что переводим RGB в HSV.
Где
H (Hue) - будет меняться от 0 до 360
S (Saturation - насыщенность) - от 0 до 100
V (Value - значение цвета)- от 0 до 100
и при поиске нам нужно учитывать все 3 значения....
 

prqyo

Новичок
>похоже что RGB нельзя перевести в плоскость XY
вот тут компоненты u, v как раз то что отвечает за цветность. ru.wikipedia.org/wiki/YUV
 
igor_ua

igor_ua

Новичок
Автор оригинала: prqyo
>похоже что RGB нельзя перевести в плоскость XY
вот тут компоненты u, v как раз то что отвечает за цветность. ru.wikipedia.org/wiki/YUV
Нажмите для раскрытия...
Вот нашел в mac os x в выборе цвета есть

вот по этому варианту по 2м координатам можно определить близкие цвета... но не совсем понятно как ...
 

dimagolov

Новичок
Ну в общем похоже что RGB нельзя перевести в плоскость XY
Нажмите для раскрытия...
ну а как тогда палитры цветовые строят? можно хоть в линию выстроить весь спектор, как, к примеру, в радуге. какое придумаете преобразование, такое и будет. другое дело, что хочется, чтобы при этом не было резких переходов, чтобы "близость" не давала неожиданных результатов. с точки зрения функционального анализа выходит, что ф-я f1 должна быть непрерывной

-~{}~ 21.05.09 10:15:

кстати, интересное вычитал: http://ru.wikipedia.org/wiki/XYZ
Основное свойство, присущее этой системе — положительная определённость — любой физически ощутимый цвет представляется в системе XYZ только положительными величинами.
....
Говоря об «эталонных» оттенках, часто говорят только о паре x, y, считая z = 1-x-y.
Нажмите для раскрытия...
 
igor_ua

igor_ua

Новичок
dimagolov
Может быть конечно я чего-то не понимаю, но как тогда в радуге найти черный цвет? А белый?
Я так понял, что на плоскости у нас должны быть все цвета, вот например в том же фотошопе мы выбираем цвет на плоскости (но для все равно есть еще 3й ползунок, который делает доступным все цвета, без него мы бы их не смогли выбрать)....
В общем все как-то не так просто получается :)
 
Beavis

Beavis

Banned
а причем тут вообще плоскость? цвет обычно тремя значениями задаётся, значит надо его представлять себе как что-то трехмерное) только надо определиться в каком формате его лучше представить
 

dimagolov

Новичок
Beavis, igor_ua, плоскость при том, что у тебя экран монитора и веб-страничка трехмерные же? а раз так, то надо, чтобы пользователь мог ткнуть в двумерный (плоский) монитор и выбрать цвет. причем так, что в определенной окрестности данной точки были только "близкие" цвета, причем "близость" в идеале должна соответстовать особенности цветовосприятия человеком, а не возможностям монитора.

можно тупо, трерью координату сделать бегунком и тогда будет виден в каждый момент времени определеный срез. скажем по B, а пары RG для данного значения B будут раскрыты в квадрат. это по логике самое технически простое решение, но не уверен, что так будет легко выбирать цвета, да и понадобиться 256 палитр.

но судя по последней ссылке (http://ru.wikipedia.org/wiki/XYZ) все различимые человеком основные цвета легко представить двумя координатами, так что я бы погуглил бы как.
http://tinyurl.com/qbg46p

-~{}~ 21.05.09 11:31:

prqyo, ага, там рядом офигительно близкие цвета оказываются :)
 
igor_ua

igor_ua

Новичок
dimagolov
Ну тут задача стояла не столько в определении всех близких цветов, сколько поиск близких цветов в базе данных, а как пользователь будет их выбирать - это уже вопрос третий.
Тут главное сформировать запрос/условие к базе, по которому получим результат из товаров с близким к выбранному цвету.
 
Beavis

Beavis

Banned
dimagolov
причем тут как это выглядит на экране? по-моему тут обсуждается проблема на уровне модели а не представления... и стоит задача найти все цвета, похожие на заданный, с заданной точностью...

а на экране они могут хоть как строка "#FF0000" выглядеть...
 

dimagolov

Новичок
нееее... проблема не "найти все цвета, похожие на заданный, с заданной точностью", а создать математический критерий похожести цветов.

чисто по приколу создал скриптик для отображения двух цветов на определенном расстоянии по RGB и убедился, что скажем (255, 255, 0) - желтый я бы вряд ли назвал похожим на салатовый (235, 255, 0), а вот на оранжевый (255,235,0) желтый очень даже похож. Тем более для меня не похожи салатовый и оранжевый между собой, хотя математический критерий похожести во всех случаях одинаковый - разность по каждой из координат не превышает 20, а в первых двух парах и вовсе, разность одной координаты не превышает 20.
 
Beavis

Beavis

Banned
Автор оригинала: dimagolov
нееее... проблема не "найти все цвета, похожие на заданный, с заданной точностью", а создать математический критерий похожести цветов.
Нажмите для раскрытия...
те же яйца....
 
igor_ua

igor_ua

Новичок
Есть идея сделать так. Посмотрел как сделали поиск картинок по цвету по flickr
http://labs.ideeinc.com/multicolr#colors=c32a00;

Там выбрали 120 основных цветов по которым и будет происходить поиск.
Берем за основу эти цвета

1) При добавлении товара админ выбирает любой цвет из RGB палитры (например берем плагин jquery colorpicker)
2) Сравниваем этот цвет с нашими эталонными 120-ю цветами и выбираем самый близкий цвет
3) Записываем значение этого цвета (хоть в HEX формате, хоть в другом, не важно)
4) Пользователь в публичной части точно так выбирает любой цвет через colorpicker
5) Мы сравниваем выбранный пользователем цвет с нашими 120ю цветами и находим ближайший цвет.
6) Все, осталось только выбрать все товары у которых эталонные цвета совпадают.

Вот сайт, вроде бы где есть формулы вычисления дельты цветов www.easyrgb.com
И тут еще есть формула:
http://algolist.manual.ru/
 
grigori

grigori

( ͡° ͜ʖ ͡°)
Команда форума
Beavis
есть некоторая разница между "поиском похожих цветов" и "нахождением алгоритма и критериев для поиска похожих цветов"

примерно как "распознать капчу" (делается через индийские службы цепных обезьян) и "нахождение алгоритмов для распознавания" (пишутся докторские)
 

dimagolov

Новичок
igor_ua, в данном алгоритме есть одна проблема, которая была и изначально, а именно "выбираем самый близкий цвет". только добавлены "эталонные 120-ю цвета", которые создают проблему транзитивности, так как лично мне уже совсем не очевидно, что два цвета, похожие на эталонный похожи, особенно тогода, когда каждый из искомых одновременно похож на два эталонных, но при этом это три разных эталонных. и это самый простой расклад, кстати:
Э1 <- похож -> Ц1 <- похож -> Э2 <- похож -> Ц2 <- похож -> Э3
 
Войдите или зарегистрируйтесь для ответа.
Сверху