Accessing image/texture data (texels) on WebGL

Question

I have the following code snippet on WebGL:

var texture = gl.createTexture();
texture.image = new Image();
texture.image.onload = function() { 
     .... //          


        

Answer 1

I use HTML5 to read the texels with the following code snippets:

var myCanvas = document.createElement("canvas");
myCanvas.width = texture.image.width; 
myCanvas.height = texture.image.height;
var myCanvasContext = myCanvas.getContext("2d"); // Get canvas 2d context
myCanvasContext.drawImage(texture.image, 0, 0); // Draw the texture
var texels = myCanvasContext.getImageData(0,0, width, height); // Read the texels/pixels back

It does what I want to do. Please let me know if there is a better way