The pushfront property forces a drawing primitive to be sorted based on the point that is closest to the camera. For Triangle A, the closest point to the camera is Point 1. Because Point 1 is closer to the camera than the z depth of Triangle B, setting pushfront to true for Triangle A will bring it to the front of the scene, meaning it will be rendered last.

var triangleA:Object3D = new Triangle(
  {
    x: -30,
    y: 0,
    z: 500,
    rotationY: -5,
    yUp: false,
    bothsides: true,
    pushfront: true
  }
);

The pushback property does the opposite of pushfront, and forces a drawing primitive to be sorted based on the point that is furthest away from the camera. For Triangle B, the furthest point from the camera is Point 2. Because Point 2 is further away than the z depth of Triangle A, setting pushback to true for Triangle B will push it to the back of the scene, meaning it will be rendered first.

var triangleB:Object3D = new Triangle(
  {
    x: 30,
    y: 0,
    z: 499,
    rotationY: 60,
    yUp: false,
    bothsides: true,
    pushback: true
  }
);

The screenZOffset property can also be used to force one triangle to be considered further away from the camera than the other. Away3D will add the screenZOffset value to the z depth, which allows you to adjust the relative depth of a 3D object within the scene.

A positive screenZOffset increases the z depth, forcing a 3D object to be considered to be more towards the back of the scene. A negative value will decrease the z depth, forcing a 3D object to be considered to be closer to the front of the scene. Note that setting the screenZOffset value will not change the position of the 3D object within the scene, only the order in which it is drawn.

To force Triangle A to be drawn on top of Triangle B we can specify a negative value for the screenZOffset parameter. In the following example, Triangle A will have a z depth of 490, placing it in front of Triangle B, which has a z depth of 499.

var triangleA:Object3D = new Triangle(
  {
    x: -30,
    y: 0,
    z: 500,
    rotationY: -5,
    yUp: false,
    bothsides: true,
    screenZOffset: -10
  }
);

To force Triangle B to be drawn on top of Triangle A, we can specify a positive value for the screenZOffset parameter. In the following example, Triangle B will have a z depth of 509, placing it behind Triangle A, which has a z depth of 500.

var triangleB:Object3D = new Triangle(
  {
    x: 30,
    y: 0,
    z: 499,
    rotationY: 60,
    yUp: false,
    bothsides: true,
    ownCanvas: true,
    screenZOffset: 10
  }
);

The final way to force the sorting of 3D objects is to render them in their own canvas, which is done by setting the ownCanvas property to true, and then forcing the depth of that canvas.

A canvas is a layer into which 3D objects are drawn. They work in much the same way as layers in image-editing software packages like Photoshop. 3D objects can be rendered into a canvas, and the canvas is then drawn alongside any other 3D objects that are in the scene.

First, we set the ownCanvas property to true.

var triangleB:Object3D = new Triangle(
{
    x: 30,
    y: 0,
    z: 499,
    rotationY: 60,
    yUp: false,
    bothsides: true,
    ownCanvas: true
  }
);

Then, we set the screen depth of the canvas through the ownSession screenZ property. Because Triangle A is 500 units away from the camera, we can specify the z depth of the canvas that will display Triangle B to be slightly more at 510. This will mean that Triangle A is considered to be closer to the camera.

triangleB.ownSession.screenZ = 510;

The following image shows how the canvas is positioned. By giving the canvas onto which Triangle B is drawn a larger screenZ value that the z depth of Triangle A, we have forced it to be drawn in the background.