Как сделать навигацию по цвету как в Dribbble?

Question

[Kislov]

Доброго времени суток!

Есть сайт с большим количеством объектов (каталог, более 2000 позиций), каждый объект содержит несколько изображений. Есть необходимость организовать навигацию как в Dribbble: dribbble.com/colors/80BD3E

Самый простой путь — марктировать позиции вручную на стадии заполнения, но если каталог уже онлайн?

Может быть у кого-то уже есть пример решения или дельные соображения?

Заранее спасибо!

Answer 1

[MaxUp]

вручную в принципе не правильная тактика даже для новых картинок:
Colors-Of-Image — не плохая библиотека для эти целей, если сайт на php. Определяет цвета, можно так же задать сколько основных цветов возвращать.
Сделать прогон для старых картинок (вопрос одно SELECT + определение цвета + UPDATE), а потом определять цвета во время загрузки новых картинок.

Answer 2

[pxx]

Вручную — так себе перспективка.
Нужно пройтись по каталогу и индексировать изображения по преобладающим цветам. А дальше поиск по близости искомого цвета.
Я сам не занимался этим, поэтому конкретный рецепт не дам, но нагуглился вот такой пример.
Там в качестве референсных точек для преобладающих цветов выбрана web-safe палитра на 216 цветов, что, в принципе, весьма неплохо для старта. При необходимости, палитру можно расширить.
В случае ограниченной палитры индексация и поиск будут значительно проще, чем с полноцветной.

Answer 3

[stalkerg]

Как определить средний цвет? Берём и делаем thumbnail в один пиксель а потом считываем цвет этого пикселя. Храним в СУБД в виде 3 столбцов.
Поиск можно тупо работает быстро:
Для where что то такое: «color_r>:cr-:ck and color_r<:cr+:ck and color_g>:cg-:ck and color_g<:cg+:ck and color_b>:cb-:ck and color_b<:cb+:ck»
Для order by: «sqrt(2*abs(color_r-:cr)*abs(color_r-:cr) + 4*abs(color_g-:cg)*abs(color_g-:cg) + 3*abs(color_b-:cb)*abs(color_b-:cb))»
У меня на сайте anime-pictures.net/pictures/view_posts/0?lang=ru так сделано.

Answer 4

[Kislov]

Спасибо за советы!