Задать вопрос
ms-dred
@ms-dred
Вечно что то не то и что то не так...

Как получить основные цвета картинки?

Подскажите чем можно вытащить основные цвета из картинки?
Пользовался 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 были выше остальных.
  • Вопрос задан
  • 2386 просмотров
Подписаться 3 Комментировать
Подписчики вопроса 3 К ответам на вопрос (0)