Rotation Exercise

Now that we know how to describe the rotation of objects in virtual worlds, let’s put it into practice.

Rotation Exercise

The objective of this exercise is to explore static rotation. You will notice that rotation in virtual worlds is not intuitively obvious. We start with a model airplane positioned on the X-axis. We will also provide a set of desired rotational orientations. Your task is to update/change the rotation coordinates of the dolly to achieve the desired orientation for each task.

We have provided the baseline source code (see the “See Also” section at the bottom of the page). To work on the exercise, copy the file contents to Glitch or CodePen as per your preference. If you simply run the provided file in a browser, you will see output similar to one in Figure 1.

Figure 1: Initial position of airplane model and the axes for reference

To update the rotation of the airplane, update the rotation attribute for the ‘dolly’ entity:

 <a-entity id="dolly" rotation="0 0 0">

The rotation attribute can be read as: “<rotation for x-axis in degrees>, <rotation for y-axis in degrees>, <rotation for z-axis in degrees>”

Each task shows you what the orientation of the airplane should look like. Modify the rotation attribute (using Glitch/CodePen/Notepad) such that the resulting output matches the required orientation.

Hint: The answers for all the tasks involve one of these three values for each of the axes: [-90, 0, 90]

Task 1: Re-orient the airplane to match the arrangement in Figure 2.

Figure 2: Task 1 Orientation

Task 2: Re-orient the airplane to match the arrangement in Figure 3.

Figure 3: Task 2 Orientation

Task 3: Re-orient the airplane to match the arrangement in Figure 4.

Figure 4: Task 3 Orientation