[SOLVED] What's the correct data to pass to glTexImage2D in HTML5?

#1

Hello peeps,
I have a really stupid question to make regarding Lime OpenGL (WebGL).

On Neko, I can use gl.texImage2D as following (let’s assume it’s a 32x32 image):
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 32, 32, 0, gl.RGBA, gl.UNSIGNED_BYTE, image.buffer.data );
And it works nicely.

However, when it comes to html5, my dandy little cube (I’m a beginner alright?) remains black!
In older versions of Lime I guess, you could just :
getPixels(image.rect).byteView;

But it seems byteView was removed…

Any thoughts?
TIA.

#2

As I was typing the post I found out that you don’t need byteView just:
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 32, 32, 0, gl.RGBA, gl.UNSIGNED_BYTE, image.getPixels(image.rect).getData() )

Thanks anyways.

#3

Use image.data (instead of image.buffer.data) and I believe Lime should automatically convert HTML5 Image or canvas images to a typed array, for a similar upload:

gl.texImage2D (gl.TEXTURE_2D, 0, gl.RGBA, 32, 32, 0, gl.RGBA, gl.UNSIGNED_BYTE, image.data);

Another option on HTML5 is the use of gl.texImage2DWEBGL to upload the canvas or Image src instead. (You can just use plain gl.texImage2D for this if you cast the context to WebGLContext):

gl.texImage2DWEBGL (gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, image.src);

Happy to hear feedback on how Lime works for you :slight_smile:

1 Like
#4

Sorry for the very late response @signmajesty, thank you very much buddy :slight_smile: