Mein Projekt besteht darin, ein Bild in ein Canvas-Tag in einer HTML-Seite einzugeben und dann die Pixel und RGBA-Werte der Pixel zu durchlaufen. Während ich die roten Werte durchlaufe, also jeden vierten Wert im Pixel, möchte ich die Position der Pixel, die ein weißes Pixel darstellen, aufzeichnen. Jetzt lade ich das Bild mit Code herunter, den ich von diesem Blog Ссылка bekommen habe.
Er hat einen anderen Beitrag, in dem er Code darüber gibt, wie man die Pixel durchläuft und die Informationen protokolliert, die ich protokollieren möchte, aber ich verstehe es nicht, und ich möchte seinen Code nicht kopieren, ohne zu wissen, was Ich mache es. Könnte jemand bitte die Methode, die er benutzt, erklären oder mir vielleicht einen anderen Weg zeigen, was er tut? Dies ist der Link zu dem anderen Beitrag Ссылка .
Es ist einfach.
Alle Pixeldaten für eine Zeichenfläche werden sequenziell in einem Array gespeichert.
Die Daten des ersten Pixels belegen die Array-Elemente # 0-3 (rot = 0 / grün = 1 / blau = 2 / alpha = 3).
Die Daten des zweiten Pixels belegen die Array-Elemente # 4-7 (rot = 4 / grün = 5 / blau = 6 / alpha = 7).
Und so weiter ...
Sie können diese Pixeldaten laden, indem Sie context.getImageData () verwenden und durch das Array aufzählen.
%Vor%Sie können diese Array-Werte auch ändern und dann das Array mit context.putImageData () in das Image zurückspeichern.
%Vor%Das Bild ändert sich dann entsprechend den Änderungen, die Sie an seinem Pixel-Array vorgenommen haben.
Ich empfehle Ihnen, ein Bildverarbeitungsframework zu verwenden, um sich auf die Algorithmen zu konzentrieren, anstatt Wertefelder zu manipulieren. Einige Frameworks:
Im Fall von MarvinJ können Sie einfach Pixel durchlaufen, indem Sie die Spalten- und Zeilenkoordinaten iterieren. Ich verwende die Methoden getIntComponentX () , um auf Farbkomponenten zuzugreifen.
%Vor%Sie müssen sich also nicht darum kümmern, wie die Pixeldaten dargestellt werden. Um zu prüfen, ob ein Pixel weiß ist:
%Vor%Runnable Beispiel:
Tags und Links javascript html canvas image-processing for-loop