画像の最も一般的な色を見つける

Question

私は、200x200の画像を持つページにたくさんの製品を持っています。私が最初に実行したのは、各ピクセル（ループの入れ子、xの配列、yの配列）のデータを取得し、rgbを16進数に変換して配列に格納し、次に最も頻繁に取得することでした。このスクリプトは一度に1ページに96個の項目を実行する必要があります。

現在、キャンバスを作成し、そのキャンバスに製品イメージを配置し、上記の操作を実行します。

これを高速化する平均化アルゴリズムがありますか？

Answer 1

はい！

Lokesh Dhakarは、画像の支配的な色を計算する「カラー泥棒」というスクリプトを作成しました。これは、修正されたメジアンカット量子化アルゴリズム（MCCQ）を使用して、素早く色をクラスタ化し、支配的な色（または全体のカラーパレット）を決定します。

あり、ここでのデモです：http://lokeshdhakar.com/projects/color-thief/は、スクリプトがここにgithubの上で提供されています：https://github.com/lokesh/color-thief

Answer 2

私はそれがライブラリとすべてを使用するように簡単に聞こえるけど、私はかなりの目的を果たすはるかに簡単な解決策を見つけました。 ぼかしフィルタを適用すると、ピクセル強度の平均が求められます。だから、あなたはそれの平均アウト、

filter:blur(30px); 

または

filter:blur(50px); 

やスーツは何ものような、かなり高画素値と画像に画像全体をぼかしを適用した固体の背景色をご提供している場合ほとんどの時間はイメージからの顕著な色です。

これははるかに簡単で、ほとんど常に動作するはずです。ちょうどぼかし量を試してみてください。

ぼやけが大きいと画像の外に白いパディングが発生するため、overflow-yを非表示にすることを忘れないでください。オーバーフローを隠すことでそれが解決されます。

希望するもの：