Это сложно, но выполнимо.
Первым шагом является получение данных пикселей из изображения - для этого вам нужно нарисовать изображение на элементе canvas
и получить данные пикселей . Обратите внимание, что Одинаковая политика происхождения применяется к изображению, поэтому изображение должно быть на том же сервере, что и сценарий, иначе вам потребуется использовать прокси.
Теперь вы можете применить алгоритм к пиксельным данным, чтобы найти «основной» цвет. Самый простой вариант - средний, но, похоже, вы этого не хотите. Есть много алгоритмов кластеризации там; вероятно, вам нужно выполнить квантование цвета , чтобы уменьшить количество цветов в палитре до некоторого небольшого числа, а затем выбрать цвет, представляющий наибольшее количество пикселей в изображении.
Алгоритм медианного среза является хорошим, относительно простым вариантом, хотя он все еще требует большого количества кода. Я работал над небольшим хобби-проектом по реализации этого алгоритма в Javascript - вы можете посмотреть мой код здесь . Это не будет работать для вас из коробки, но я, вероятно, сделал большую часть тяжелой работы для вас.