Get image src from ImageBitmap using child.material.map.image

Questions
, ,
1

I am trying to get image from ImageBitmap of a loaded model but since ImageBitmap does not have src, I am using canvas.toDataURL().

small size images are getting painted fine without any problem but a 4mb texture is not loading completely.

Since child.material.map does not have src, I am not able to use image.onload.

const c = document.createElement('canvas');
                c.width = child.material.map.image.width;
                c.height = child.material.map.image.height;
                const ctx = c.getContext('2d');

                ctx.drawImage(child.material.map.image, 0, 0, child.material.map.image.width, child.material.map.image.height, 0, 0, c.width, c.height);
                console.log(c.toDataURL());

I skipped some code for simplicity.

1 Like
2

this is helpful

3

EDIT: oh my…this post is old, anyway will keep the info here just in case. :sweat_smile:

It’s just a guess: webGL (on browsers specifically) is limited on texture size at 4096px.
Beyond this point it may generate issues
Another option is to use webGPU wich allow 8192px (propositions was made to go up to 16k but mobile device would not allow it).