PDA

View Full Version : texImage2D use with canvas ImageData Pixel Object



11&2
03-10-2011, 05:02 PM
Hi,

according to the webgl reference:
http://www.khronos.org/files/webgl/webg ... rd-1_0.pdf (http://www.khronos.org/files/webgl/webgl-reference-card-1_0.pdf)
It says under texImage2D object:
"pixels of type ImageData".

So I tried load a Image like so:


var canvas = document.createElement("canvas");
canvas.width = 256;
canvas.height = 256;

var ctx = canvas.getContext("2d");
var myImageData = ctx.createImageData(256,256);
myImageData.width = 256;
myImageData.height = 256;

function setPixel(imageData, x, y, r, g, b, a) {
index = (x + y * imageData.width) * 4;
imageData.data[index+0] = r;
imageData.data[index+1] = g;
imageData.data[index+2] = b;
imageData.data[index+3] = a;
}

for (var x = 0; x < 256; x++) {
for (var y = 0; y < 256; y++) {
setPixel(myImageData, x, y, 255,0,0,255);
}
}

_gl.pixelStorei(_gl.UNPACK_FLIP_Y_WEBGL, true);

_gl.bindTexture(_gl.TEXTURE_2D, ert);
_gl.texImage2D(_gl.TEXTURE_2D, 0, _gl.RGBA, 256, 256, 0, _gl.RGBA, _gl.UNSIGNED_BYTE, myImageData.data);


I left out not necessary code for readability reasons. If I use a "normal" image object it works as expected.

What am I doing wrong here?

Best regards, S.