How to load basis texutre from database but not a static .basis file?

My basis texture is storaged in something like database, but is not served as a static .basis file, the only thing i can get is the arraybuffer or blob of the file.

How could it be loaded and trancoded in BJS?

I tried as below but it doesn’t work.

    let imageData = await fetch( `${ BASIS_DATA }` ).then( res => res.arrayBuffer() );

    let texture = new InternalTexture( engine );

    let loader = new _BasisTextureLoader();

    let loadBasisAsync = () => {

      return new Promise( ( resolve, reject ) => {

        loader.loadData( imageData, texture, () => {

          resolve();

        });

      });

    };

    await loadBasisAsync();

UPDATE:

I try it again, by setting up a local static .basis file, but BJS show a black texture and pop up a tip [.WebGL-00000271CCED6DD0] GL_INVALID_OPERATION: Invalid compressed image size.

but it works fine in three.js.

here is the basis file, it’s compressed by basisu.exe v1.08, size is 6000 x 3000.

i think the problem is the size it’s not power of 2

20191122061236.zip (642.8 KB)

Can you create a repro with your file in the playground?

https://doc.babylonjs.com/resources/external_pg_assets

Pinging @sebavan to see if he has cycles to help when we will have a repro

At a first glance I am not sure that three supports uploading mip levels and here it looks like some of the mip maps data might be in a inconsistent state. I am digging more

Ok looking at three.js code, they do so we obviously have smthg wrong, I ll try to have a fix by end of day :slight_smile:

@hjlld So it work in three because they do not use the mipmap at runtime else it would fail as well.

It is easier to stay with pot with compressed textures due to those checks done by the browsers :slight_smile: https://cs.chromium.org/chromium/src/third_party/angle/src/libANGLE/validationES.cpp?gsn=ValidCompressedImageSize&l=829

Basically for the LODs of the texture the size needs to be a multiple of the compressed block size which is not the case with some of the lods for this particular textures. Let me know if that helps.

2 Likes

Great answer!!! now i know the best choice is keeping texture size power of 2 during the whole work flow.

But…

then…

how to load basis texture as array buffer but not as a static file? I can’t find any regular api to get it.

This would work: https://playground.babylonjs.com/#4RN0VF#15

Basically passing the array buffer in the texture constructor

2 Likes

Thanks a lot!!!:heart_eyes:

1 Like