Multi panaromic images

Hello to everyone,

I’m with you again after a long break. I really miss this family. There are many innovations! This is so cool.

I have a little question. I have more than 20 panoramic images. When the user presses the w key, the camera will move through these images with the animation, without stopping. So, the user will feel as if they are traveling in a 3D model. A transparent png will appear on the screen only when you press the w key, and the camera will continue to advance until the user stops pressing the w key.

I did a research for that, but I couldn’t find any examples. I’m sure there are wise people among us. Can you enlighten me about this?

Not sure to fully understand what you are trying to achieve :frowning: any hints on how it should look ?

I had many ways to do this, but I could not reach the desired result. I could not see a similar example in my researches.

You can think of it as a google street map. I have a 3d room design. I got a panoramic render every 1 step from inside the room. Every render I get looks like this: 360 render

I have 20 of these pictures. The important issue here is that I took a picture at each step inside the room. So, in every picture, the user is one step further. I want to combine 20 pictures as above and work like google street map. With one difference. If the user continues to press the w key, the pictures will continue to change. And during this camera transition, there will be a transparent png on the screen. Like loading. Or like screen fading.

Proceeding in very small steps, I got more than 20 renderings. Like this: 360 render

Thank you for your interest in this topic @sebavan

you could maybe have 2 photo domes and animate their opacity during the transitions ? or I bet the community will come with some neat ideas :slight_smile:

Hi @VoyVoda in addition to @sebavan’s idea of an opacity cross-fade transition, you could try something similar to what Matterport does i.e. it looks like the transition between adjacent 360 panoramas involves a zoom effect either by temporarily animating the camera FoV and/or stretching/skewing the geometry. Matterport creates mapped geometry rather than simply using panorama spheres so it won’t look quite as good, but it still might provide a decent impression.

2 Likes

Yes, such a logic can do my job. So, do we have an example like this?

@VoyVoda sorry no, I don’t know of any Babylon.js examples of these ideas but you could give them a try yourself in the Playground then others would be better able to contribute.

1 Like

I found something similar to what I was trying to explain. How can I control camera transitions in this way, as in the example below? Do you have a simple playground?

Example