HTML5 Canvas 3D WebGL (TM) js Library

depth Library Method

Short Description: Set or Animate Depth of Object

Signature: t.depth (d[,d1])
Group: Shape
Class: transition Class

Defines the depth of the animated object. For amimating 2D objects the depth vector is (almost) irrelevant, because 2D objects do not have a depth. More precisely for taccgl™ a 2D object is just the front face of a 3D box, which does however not make a big difference because all the other faces of the 3D box are invisible. Just rotateMiddle takes the depth into account when calculating the middle to rotate around. For displaying e.g. a 3D box the gives the distance from the top, left, front point of the object to the top, left, back point of the object.

If d and d1 are specified this creates an animation starting with depth d and growing/shrinking to d1. If d is not given (e.g. null) the animation start with the default/current depth.

The depth method sets the size of the depth vector and keeps its direction. It may be useful to use dV or dVTo beforehand to set the direction. Initially the default depth vector is (0,0,0). Then the depth method sets the vector(s) to (0,0,d) or (0,0,d1).


var"testimg"); a.depth(500).start();
var"testimg"); a.rotateMiddle(1,0,0).start();
var"testimg"); a.depth(500).rotateMiddle(1,0,0).start();

dV or dVTo should not be used after depth.

WebGL™ is a trademark of the Khronos Group Inc.

Next Page:transition.clip - Select / Clip-To Rectangular Part
Previous Page: transition.resize - Change or Animate Size of Object