Adjust PhotoDome image horizontal rotation

Questions
1

Hello!

I’m currently using PhotoDome + FreeCamera to display panoramic images.

In the past I’ve used a library called Pannellum that supports rotating the image on the horizontal to account for e.g. the camera being tilted when taking the photo.

Is there is a way to achieve something similar using BabylonJS?

I have tried to rotate the FreeCamera on the z-axis using rotation.z / altering the upVector, and while it does display the corrected image, subsequently moving the camera around with the mouse doesn’t appear to work as expected.

I am guessing what I need to do is somehow rotate the image / photodome rather than the camera, but I can’t seem to get anything to work.

Hopefully that makes sense, I am still learning the basics of Babylon.

Thanks!

2

The photodome is projected on a sphere mesh that can be rotated as well.

Something like this - Babylon.js Playground (babylonjs.com)

3

Oh wow, thanks! I didn’t think of trying that. It appears rotating the mesh fixes the rotation issues.

I’ll do some more testing and mark it as closed.

Update: by adjusting the Photodome.mesh.rotation.x/y I was able to achieve this. Thanks again RaananW.

1 Like
4

Actually, I was playing around with a few things and I noticed this method of rotation doesn’t work if i disable useDirectMapping - is there a workaround for this in case I need one later?

5

You can play with the texture directly - Babylon.js Playground (babylonjs.com)

6

Cheers, I’ll play around with that if needs be. Thanks for the help!

1 Like