2013-03-07 20 views
5

Mam kilka produktów na stronie, które mają 200x200 zdjęć. Moją pierwszą operacją było uzyskanie danych dla każdego piksela (zagnieżdżona dla pętli, jedna dla x, jedna dla y), następnie konwersja rgb na heks i zapisanie ich w tablicy, a następnie najczęstsze. Ten skrypt musi działać na 96 elementach na stronie naraz.Wyszukiwanie najpopularniejszego koloru obrazu

Obecnie tworzy płótno i umieszcza obraz produktu w tym obszarze roboczym, a następnie wykonuje powyższe operacje.

Czy istnieje jakiś algorytm uśredniania, który przyspiesza to działanie?

+1

jaki jest twój obecny algorytm? – mpm

Odpowiedz

11

Tak!

Lokesh Dhakar stworzył scenariusz "kolorowego złodzieja", który oblicza dominujący kolor obrazu. Wykorzystuje zmodyfikowany algorytm kwantyzacji cięć średnich (MCCQ), aby szybko grupować kolory i określać dominujący kolor (lub nawet całą paletę kolorów).

Jest demo tutaj: http://lokeshdhakar.com/projects/color-thief/ a skrypt jest dostępny na github tutaj: https://github.com/lokesh/color-thief

+0

Wewnętrznie używa 'canvas.getImageData()', aby uzyskać "ostrzeżenie" o problemach bezpieczeństwa. – tigrou

-1

Wiem, że brzmi to łatwy w użyciu biblioteki i wszystko, ale znalazłem wiele prostsze rozwiązanie, że dość dużo służy. Po zastosowaniu filtra rozmycia, co robi, przyjmuje średnią intensywność pikseli. Więc jeśli zastosować rozmycie obrazu z dość wysoką wartością piksela jak

filter:blur(30px); 

lub

filter:blur(50px); 

lub czegokolwiek, co pasuje, to średnie outs całego obrazu i zapewnia jednolity kolor tła, który jest najczęściej wybitnym kolorem z obrazu.

Jest to znacznie prostsze i powinno działać prawie zawsze. Po prostu spróbuj zmniejszyć wielkość rozmycia.

Pamiętaj również, aby ustawić przepełnienie-y, aby było ukryte, ponieważ duże rozmycie powoduje białe wypełnienie poza obrazem. ukrywanie przepełnienia to naprawi.

Nadzieję, że pomaga :)

Powiązane problemy