Access to map src in chrome

Hi,
how to i can get access to map source file in chrome browser?
In firefox image is normal html img, so i can use image.src
obraz
but in chrome this is ImageBitmap class and there is only dimensions properties

Are you loading your assets with GLTFLoader?

Please note that ImageBitmap and the image tag are two different things and have to be processed differently. How do you want to process the image data in your app?

Yes, model is loaded with GLTFLoader.
This is “raw model”, not modyfied in script yet.
I want use Image tag,
app is to load gltf model, read map path and sent it to php script by ajax.
It works in firefox, but this same in chrome dont have map path.

The loader uses ImageBitmap if supported because it improves the performance of the texture upload to the GPU (to be more precise it avoids texture decoding overhead by offloading it to another thread).

If you need the Image object for some reasons, you have to convert ImageBitmap to Image.

ok, but how ? I found how convert Image to ImageBitmap but in the opposite direction it is possible ? ImageBitmap don’t loses information about path ?

I’ve never done this before so I can’t help here. But this would a good question for stackoverflow.

I think this is impossible, ImageBitmap is smaller object and loses some data. Probably i can convert this but then in Image will by only blob data, not path.

I found stupid solution, coment some code in /jsm/loaders/GLTFLoader.js
But thi is soo stupid, if someone know normal solution I will be grateful

Do you mind explaining what you mean by that?

Image is bigger object and contain extra data like src, width, height, alt, style, class, id, … It is “reference” to html img.
ImageBitmap load image and save it as blob. This makes it faster. Image must load file ImageBitmap just have this inside.
So ImageBitmap lost some data comare to Image.

I have encountered this very same problem in the past with the GLTF loader. Not to say anything bad about the ImageBitmap calss, but if you want access to the data, you have to basically draw it to a canvas and then retrieve it from canvas again, that’s the only way.

However, if you do that - you immediately lose all of the benefits of the ImageBitmap class, since you’ll be forcing the decode as soon as you try to draw it to the canvas, which will stall your main thread. On top of that you’ll be pushing the data to and from a canvas, basically it’s a really really slow process compared to using a traditional “Image” html element.

You can make a fork of the GLTF loader and instruct it to use a different texture class internally.

2 Likes