Chapter 3. Moving Objects

3D objects within a scene can be animated in a number of ways. We touched on this topic in Chapter 2, Creating and Displaying Primitives, where the primitive 3D objects created by the PrimitivesDemo application were rotated by modifying their rotationX, rotationY, and rotationZ properties. Moving, scaling, and/or rotating a 3D object can also be referred to as transforming a 3D object. This chapter will explore in greater detail how 3D objects can be transformed within a scene.

This chapter covers the following topics:

  • The different coordinate systems
  • Transforming 3D objects by modifying their position, rotation, and scale
  • Transforming 3D objects using the TweenLite library
  • Nesting 3D objects

Global, parent, and local coordinate systems

In Chapter 1, Building Your First Away3D Application, we saw how 3D objects are positioned in the scene using coordinates along the X, Y, and Z axes. In Away3D, these coordinates can be described from three points of reference: global, parent, and local coordinates. Understanding the difference between them is important because all movement, rotation, and scaling operations in Away3D work relative to one of these three coordinate systems.

World space

The global coordinate system represents points or vectors relative to the origin of the scene. This coordinate system can also be referred to as world space. The following image shows the sphere from the example application presented in Chapter 1, Building Your First Away3D Application.

World space

The following is the code that was used to create the sphere:

var sphere:Sphere = new Sphere (
{
    	x: 0,
    	y: 0,
    	z: 500
    }
);

The init object supplied to the Sphere class constructor has set the initial position of the sphere to be at (0, 0, 500). This position is relative to the position of the 3D object's parent container. In this case, the sphere has been added as a child of the scene.

scene.addChild(sphere);

Because the sphere was added as a child of the scene, the position of the sphere will be relative to the scene. This means that the position of the sphere in world space is (0, 0, 500).

Parent space

The parent coordinate system is used to represent points or vectors that are relative to the position and orientation of a 3D objects parent container. This coordinate system is also known as parent space.

It was noted in the previous section that the position assigned to a 3D object via the x, y, and z properties is relative to the position of its parent container. When the parent of a 3D object is the scene (as has been the case with the examples presented to this point), parent space and world space are the same. However, the scene is not the only container that can hold 3D objects as children. The Scene3D class extends the ObjectContainer3D class, and it is the ObjectContainer3D class that defines the addChild() function that we have been using to add 3D objects to the scene. So, just as we have used the Scene3D object as a container for our 3D objects, so too can we use the ObjectContainer3D object.

Let's create a new application called GroupingExample, which extends the Away3DTemplate class from Chapter 1, Building Your First Away3D Application.

package
{

The ObjectContainer3D class is imported, making it available in the class.

  import away3d.containers.ObjectContainer3D;
  import away3d.primitives.Sphere;
  
  public class GroupingExample extends Away3DTemplate
  {
    public function GroupingExample()
    {
      super();
    }

We override the initScene() function to create an ObjectContainer3D object with a position of (0, 0, 500), and add it as a child of the scene. The container itself has no visual representation, so even though we have added it to the scene, the container will not be visible.

    protected override function initScene():void
    {
      super.initScene();
      
      var container:ObjectContainer3D = new ObjectContainer3D(
        {
          x: 0,
          y: 0,
          z: 500
        }
      );
      scene.addChild(container);

Next, we create a new Sphere object, but this time we set the position to be (0, 0, 0). This will position the sphere at the origin of its parent.

      var sphere:Sphere = new Sphere(
        {
          x: 0,
          y: 0,
          z: 0
        }
      );

Now, instead of adding the sphere as a child of the scene, we add it as a child of the container.

      container.addChild(sphere);
    }
  }
}

The following image shows how the sphere is now positioned within the scene. The position of the container in parent space is (0, 0, 500). Since the parent of the container is the scene, the position of the container in world space is also (0, 0, 500).

The position of the sphere in parent space is (0, 0, 0). Given that the global position of the sphere's parent container is (0, 0, 500), and the sphere sits at the origin of its parent container, the global position of the sphere is (0, 0, 500).

Parent space

Local space

The local coordinate system is used to represent points and vectors relative to the orientation of an individual 3D object. This coordinate system is also known as local space. A number of functions to move, rotate, and scale a 3D object operate in local space.

To demonstrate this let's create a new example called LocalAxisMovement.

package
{
  import away3d.primitives.Sphere;
  
  public class LocalAxisMovement extends Away3DTemplate
  {
    public function LocalAxisMovement()
    {
      super();
    }
    
    protected override function initScene():void
    {
      super.initScene();

A new sphere primitive is created, positioned, and added to the scene.

      
      var sphere:Sphere = new Sphere(
        {
          x: 0,
          y: 0,
          z: 500
        }
      );
      scene.addChild(sphere);

At this point, the sphere is sitting 500 units along the global Z axis, as shown in the following image:

Local space

We will rotate the sphere around the Y axis by negative 90 degrees. This has the effect of modifying the orientation of the sphere's local axes.

      sphere.rotationY = -90;

The following image shows how the sphere's local axes are now oriented compared to the global axes:

Local space

The moveForward() function will move the sphere along its local Z axis.

      sphere.moveForward(50);
    }
    
  }

The final position of the sphere is shown in the following image. Note the movement of the sphere along its local Z axis (indicated by the red arrow)—the positive end of the Z axis is generally considered to be the forward direction in Away3D.

Local space
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.134.99.32