Surfaces allow you to add 2D interfaces in 3D space, letting you work in pixels instead of physical dimensions. Currently there are two different shapes of Surfaces supported by React 360: Cylinder and Flat.
A Flat Surface places your 2D interface on a flat plane in space, like a virtual screen. Though a Cylinder Surface is always positioned in front of the user, a Flat Surface can be moved around in space – this is useful for scenarios where you want to have multiple panels arranged around the user, like a multi-monitor setup in virtual space.
In this lesson we are going to learn how to create a Flat Surface with a <Flag/>
component attached to it.
Little typo in the JS. With the 45 / 0
and such. Personally, I'd prefer to just write:
myFlatSurface.setAngle(i * (Math.PI / 180), 0 * (Math.PI / 180));
Fun but lame thing to do:
let i = 0;
setInterval(() => {
i = (i + 1) % 360
myFlatSurface.setAngle(i * (Math.PI / 180), 0 * (Math.PI / 180));
}, 20);