The current API of photodome(360 Photo Domes | Babylon.js Documentation) only accepts a single image. The limitation of this approach is that a high resolution image (which could be as big as 15-20MB) need to be downloaded in full before anything can be rendered.
How may one go about accepting an array of say - 8 images (each representing a quadrant - this could be done by breaking down the original equirectangular image in a 4 X 2 grid) and project those textures individually on just those subsection of the sphere? Does babylon have a way to project textures like that?
-
@xiehangyun I’m not sure I understand. I don’t see how the playground is relevant. Perhaps I’m missing something?
-
The CubeTexture constructor takes a base URL and (by default) appends “_px.jpg”, “_nx.jpg”, “_py.jpg”, “_ny.jpg”, “_pz.jpg” and “_nz.jpg” to load the +x, -x, +y, -y, +z, and -z facing sides of the cube.
These are a constant number 6, I’d like to make it 8, 12, perhaps even higher.
You can use a DynamicTexture and draw your tiles into it but there is still a limit to the max allowed res of webgl… so I am not sure it is that useful.
Anothre way is to split your mesh 
If you are concerned about load times, rather than streaming the image, I would suggest creating a low res version and load that first and then stream your high res in the background and replace it when loaded.
Another option would be to progressively load larger sections of the full res texture and expand the viewing area of the PG as you did so. So you’d make say 3 copies of your pano. One with everything but 0-120 blacked out, one with everything but 0-240 blacked out, and one with the full thing.
You could also do that but have part of the pano be transparent instead of blacked out and then just load all three on top of each other. But you might see seams and I think large transparent textures are a perf hit.
Yes @ericwood73 that’s why I think something like @sebavan solution will work better.
I found this library that does it. But It uses three.js under the hood and I’d like to avoid the additional dependency. I haven’t looked at their code yet to see how they implemented it. Not sure if I have time to look at it now, hopefully, in the future, I may look at it.
1 Like