Transform

In the following two images, the 3D book object is placed in two different positions and orientations by changing the transform properties in the style attribute of the React 360 Entity component that is rendering the 3D object. The transform here is based on the transform style of React, which React 360 extends to be fully 3D, considering the X-Y-Z axes:

The transform properties are added to components in the style attribute as an array of keys and values in the following form:

style={{ ...          transform: [             {TRANSFORM_COMMAND: TRANSFORM_VALUE},         ...    ] ... }}

The transform commands and values relevant to the 3D objects to be placed in ...

Get Full-Stack React Projects now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.