React-360: Rotating a pano using the transform property doesn't work

Created on 10 Jun 2017 · 7Comments · Source: facebookarchive/react-360

I am trying to change the default view of the panorama by rotating it across the Y axis. However, this seems not to work when I do it. Any ideas ?

Source

KhaledGabr

Most helpful comment

Aha, yep, you've found a bug. Rotation works for equirect images, but not for cubemaps. I'll look into this.

andrewimm on 10 Jun 2017

👍6

All 7 comments

Can you provide some sample code that doesn't work?

I just created a new project and successfully rotated a pano around the Y-axis.

andrewimm on 10 Jun 2017

This is the code I wrote to rotate the panorama

<Pano
            style={{
                transform: [
                    {rotateY : 100},
                ]
            }}

            source={{
            uri:[
                '../static_assets/c1.jpg',
                '../static_assets/c2.jpg',
                '../static_assets/c3.jpg',
                '../static_assets/c4.jpg',
                '../static_assets/c5.jpg',
                '../static_assets/c6.jpg',
            ]
            }} />

KhaledGabr on 10 Jun 2017

Aha, yep, you've found a bug. Rotation works for equirect images, but not for cubemaps. I'll look into this.

andrewimm on 10 Jun 2017

👍6

Any progress on this one? Is there any obvious workaround to set initial direction for a cubemap pano scene? Change head direction? Some tool to re-convert all the cubemaps, rotating the scene offline? Seems overkill but I need to solve it.

andelar on 15 Jul 2017

I've just tried this with GH master and the following is working for me. I used source as both a single image equirect and multi image cubemap

        <Pano style={{transform:[{rotateY: 45}]}} source={...} />

mikearmstrong001 on 17 Jul 2017

👍1

Great, then you probably fixed something in master after 1.4.0.
(Doesn't work on 1.4.0, just retried it.)

andelar on 17 Jul 2017

I've just tried this with GH master and the following is working for me. I used source as both a single image equirect and multi image cubemap
        <Pano style={{transform:[{rotateY: 45}]}} source={...} />

Still new to this, didn't know it was possible - and it worked for me - very neat!