7. 7
    Create a Flat Surface and attach a component to it in React 360
    3m 10s

Create a Flat Surface and attach a component to it in React 360

InstructorTomasz Łakomy

Share this video with your friends

Send Tweet

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.

Jeremy Chen
Jeremy Chen
~ 5 years ago

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);