Konvertieren eines Bildes in ein RGB-Array in Javascript

Ist es möglich, ein Array von Pixeln aus einem PNG-oder BMP-Bild in Javascript zu bekommen? Ich möchte ein RGB-Array von einem Bild erhalten, so dass ich das Pixel-Array manipulieren und dann das modifizierte Bild auf einer Leinwand zeichnen kann.Konvertieren eines Bildes in ein RGB-Array in Javascript

UPDATE: fand ich ein exaktes Duplikat hier: how to get the RGB value of an image in a page using javascript?

jedoch die Antworten sehr ins Detail gehen nicht darüber, wie dieses Problem tatsächlich zu lösen.

Quelle

2012-05-06 Anderson Green

Wenn Sie auf den Link der Antwort zu dieser Frage klicken, gelangen Sie zu einer detaillierten Antwort, wie Sie die Farbe jedes Pixels in einem Bild invertieren können. Es sollte trivial sein, diesen Code in ein Array von Pixeln zu konvertieren. – JaredMcAteer

Siehe https://developer.mozilla.org/en/Canvas_tutorial –

mögliche Duplikate von [Wie bekomme ich den RGB-Wert eines Bildes in einer Seite mit Javascript?] (Http://stackoverflow.com/questions/2754865/how -to-get-the-rgb-Wert-eines-Bild-in-einer-Seite-Using-javascript) –

Es gibt hundert Tutorials im Internet über die Verwendung von HTML Canvas imageData, die die RGBA-Werte eines Canvas erhält. Suchen Sie nach canvas imageData und Sie werden viele Informationen finden.

Alles, was Sie tun müssen, ist:

ctx.drawImage(img, 0, 0); 
var imgData = ctx.getImageData(x, y, width, height).data;

imgData ist jetzt ein Array, in dem alle 4 Plätze jedes Pixel sind. So [0][1][2][3] sind die [r][g][b][a] des ersten Pixels.

Quelle

2012-05-07 01:06:55

Was sollte der Parametertyp von "img" sein? Sollte es ein Bildobjekt sein, oder sollte es die Bild-URL als String sein? –

@AndersonGrün eine Instanz des Image-Objekts, Sie können es entweder über DOM erhalten, erstellen Sie ein neues mit: 'var img = new Image(); img.src = "http: // ..." oder img.src = "daten: image/jpeg; base64, ...." ' – Mustafa

Ich habe keine

Konvertieren eines Bildes in ein RGB-Array in Javascript

Antwort

Verwandte Themen