Get X i Y pikseli współrzędne podczas iteracji nad HTML5 canvas getImageData

Question

ja Iterowanie nad niektóre dane obrazu wyciągnął z canvas tak:

var imageData = this.context.getImageData(0, 0, this.el.width, this.el.height); 
var data = imageData.data; 

for (var i = data.length; i >= 0; i -= 4) { 
    if (data[i + 3] > 0) { 
     data[i] = this.colour.R; 
     data[i + 1] = this.colour.G; 
     data[i + 2] = this.colour.B; 
    } 
} 

Jak obliczyć aktualną X i Y pikseli współrzędne, że jestem w?

Answer 1

proste arytmetyczno sekwencji:

Podzielić położenia liniowego na szerokość. To jest twoja współrzędna Y. Pomnóż tę współrzędną Y przez szerokość i odejmij tę wartość od położenia liniowego. Wynikiem jest współrzędna X.

Należy również pamiętać, że musisz podzielić liniową pozycję na 4, ponieważ jest to RGBA.

Answer 2

To powinno działać

var x = (Math.floor(i/4) % 4); 
var y = Math.floor(Math.floor(i/this.el.width)/4); 

Answer 3

Poprawione i testowano wersję kodu:

var x = (i/4) % this.el.width; 
var y = Math.floor((i/4)/this.el.width);