Load .blob as RawTexture: WebGL: INVALID_OPERATION: texImage2D: no bound PIXEL_UNPACK_BUFFER

Greetings :smiley:

My goal is to apply a HDR texture to an object.

The texture is available as a local .blob file with 4 Channels RGBA, encoding is HALF FLOAT.

First i tried to load the .blob in an ArrayBuffer, which seems to work:

const assetArrayBuffer = BABYLON.Tools.LoadFile(“https://raw.githubusercontent.com/Moruos/testdata/main/this_is_an_image.blob”,function(data){}, undefined, undefined, true);

Next i tried to assign the ArrayBuffer to a RawTexture using:

var texture = new BABYLON.RawTexture.CreateRGBATexture(assetArrayBuffer,256,256,scene,false,false,BABYLON.Texture.NEAREST_SAMPLINGMODE,engine.TEXTURETYPE_HALF_FLOAT);

But i get an error message:

WebGL: INVALID_OPERATION: texImage2D: no bound PIXEL_UNPACK_BUFFER

Any ideas?

Hi!

Can you reproduce this on the playground so we can see the code? Hopefully you can share the blob as well.

Hello!

Sure:

The .blob used in my mentions is the actual blob i´m using.

A few things -

first, this blob is empty. it only fires 0’s
second - you need to provide the data (from the on success callback) and not the file request if you want to use the request’s data correctly. Are you sure this blob contains data?

You could load like this, but your data look like all 0 https://playground.babylonjs.com/#QAZYI6#4

Hello @RaananW, Hallo @sebavan.

Thank you very much for your answers.

First of all: Yes, the blob was corrupted, I changed it in my repro to a working one,.

@sebavan Your solution works, but i seek to keep the dynamic range of the floating point 16 numberspace and use a tonemapper to compress it to 8bit. At this time the rendering stays black.

Please have a look:

You have the same issue as before → you process the data outside the callback without relying on the right array format.

Please note that your data should also be in a suitable 16 encoding format which does not look like being the case here.

Thank you very much! I didnt get it the first time :smiley:

1 Like