Подтвердить что ты не робот

Алгоритм цветового квантования/уменьшенная цветовая палитра изображения в JavaScript?

Я пишу веб-приложение, которое принимает изображение, представленное пользователем, получает данные пикселя через элемент canvas, выполняет некоторую обработку, а затем отображает изображение с использованием векторных фигур (используя Protovis). Он работает хорошо, но в итоге у меня несколько тысяч цветов, и я хотел бы позволить пользователю выбрать размер целевой палитры и уменьшить цветовую палитру до такого размера.

В тот момент, когда я хочу уменьшить цветовое пространство, я работаю с массивом данных пикселя RGB, например:

[[190,197,190], [202,204,200], [207,214,210], [211,214,211], [205,207,207], ...]

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

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

Изменить (7/25/11): Я принял предложение @Pointy и внедрил (большинство) Leptonica MMCQ (модифицированное срединное квантование разрезов) в JavaScript. Если вам интересно, вы можете посмотреть здесь код.

Редактировать (8/5/11): libraryfck library выглядит как еще один отличный вариант для этого ( хотя я думаю, что это немного медленнее, чем моя реализация).

4b9b3361

Ответ 1

С оговоркой, что я не претендую на какой-либо опыт вообще в любой области обработки изображений: я прочитал статью Википедии, которую вы связали, и оттуда нашел Дэн Блумберг Leptonica. Оттуда вы можете download источники обсужденных и объясняемых алгоритмов.

Исходный код находится в C, который, мы надеемся, достаточно близок к JavaScript (по крайней мере, в основных частях формулы), чтобы быть понятным. Основные идеи алгоритма "MMCQ" не кажутся сложными. Это действительно просто некоторые эвристические трюки для разделения трехмерного цветового пространства на суб-кубы на основе того, как сочетаются цвета в совокупности изображений.

Ответ 2

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

  • Простая гистограмма
  • Медиана вырезать
  • K-значит

Вы можете найти его копию здесь

Вы можете найти код для него на github

Он написал 100% в Javascript и использует Plotly.js для примерных графиков.

Я также написал сообщение, описывающее три подхода/алгоритмы более подробно: вы можете найти здесь