Подскажите чем можно вытащить основные цвета из картинки?
Пользовался npm imagecolors, но проблема заключается в следующем:
Мне нужно организовать поиск по цвету картинки (/?colors=ffffff), из имеющихся 200к изображений, все цвета при заливки изображения сохраняются в базу данных в виде массива (['ffffff', 'cccccc']), так вот, проблема в том что с imagecolors я получаю 5 первых цветов, в итоге из 200к изображений по поиску определенного цвета находится только одно изображение (в основном).
Получается что берутся все пиксели с кучей оттенков и в итоге поиск по цвету находит только одну картинку.
Как быть? Что делать?
Может есть какие то npm с помощью которых можно получить основную цветовую палитру (общую, преобладающую) или например npm позволяющие сконвертировать hex в название цвета, чтобы при запросе fffffff определить цвет как white и найти названия цветов в массиве цветов ['white', 'green', 'orange']
Спасибо за любую информацию!
Собственно само решение, может кому то и пригодится =)
Устанавливаем пакет npm imagecolors, с помощью него при сохранении картинки на сервер нужно будет получить RGB и Percent цветовой палитры картинки. Я сохраняю все данные и всего скорее буду экспериментировать еще с различными выборками.
Вот то нужно что выплевывает imagecolors на данный момент с одного изображения
[
{
rgb: {
r: 255,
g: 255,
b: 255
},
percent: 20.5 // процент преобладания цвета на данном изображении
},
{
rgb: {
r: 44,
g: 55,
b: 66
},
percent: 11
}
]
В коллекции я сохраняю все это данные в поле db.images.pixels, в схеме монгуста банально тип массив
pixels: { type: Array }
Пользователям предоставляю ссылки на поиск картинок по цветам такого вида
search?pixels[r]=255&pixels[g]=255&pixels[b]=255&pixels[min]=10
Ключ
min указывает минимальный процент цвета на изображении, т.е. в данном случае я получу те картинки в которых белый цвет от 10% по отношению к другим цветам.
Вот пример выборки для наглядности
Col.find({
pixels: {
'$elemMatch': {
'rgb.r': { $lte: 255-10, $gte: 255+10 },
'rgb.g': { $lte: 255-10, $gte: 255+10 },
'rgb.b': { $lte: 255-10, $gte: 255+10 },
'percent': { $gte: 10 }
}
})
При такой выборке очень даже неплохой результат получаю.
Потом еще сортировкой займусь чтобы картинки с максимальным percent были выше остальных.
Средний
Простой