What is the difference in layout positioning of react-vr and react-360?

Question

I had started creating a project with react-vr and had laid out the object in a spherical manner around the user. Or for example, the 3 objects had positions (1, 1, 1), (2, 2, 2) and (3, 3, 3).

style: { transform: [{ translate: [1,1,1] }] }

On moving to react-360 the same positions of the objects seem quite different. From the initial view, all three object appear to be in a straight vertical column.

1. Is there some major difference in the layout structure of the two that I've missed here?
2. Also the order of rendering of these objects differ the output that we are getting in react-360.

Answer 1

There is a difference that by default it's rendered to 2D Surface, not 3D scene. I must say for me it's quite strange and i also struggled with this. Especially since they changed it significantly and is hard to find any info about it in docs (if it even is there because I found a solution in code). So, in client.js file you have to change this

  r360.renderToSurface(
    r360.createRoot('YourProject', { /* initial props */ }),
    r360.getDefaultSurface()
  );

to this

  r360.renderToLocation(
    r360.createRoot('YourProject', { /* initial props */ }),
    r360.getDefaultLocation()
  );

Then you will be able to position objects like in React VR.