Three.js Tutorial

Three.js Tutorial Three.js Installation Compatibility and Running Locally Three.js Lines and Texts Three.js Loading 3D Models Three.js Updating Things Three.js Disposing of an Object Three.js Creating VR Content Three.js Using post-processing Three.js Matrix Transformations Three.js Animation Systems Three.js Testing with NPM Three.js AnimationAction Three.js AnimationClip Three.js AnimationMixer Animation Object Group and Utils Three.js Keyframe Track Property Binding and Mixer Three.js Animation/ Tracks Three.js Audio Three.js Camera Three.js Buffer Attribute Three.js Buffer Geometry Three.js Interleaved Buffer Three.js Layers Three.js Object3D Three.js Raycaster Three.js Uniform Three.js Curves Three.js Geometries- 1 Three.js Helpers- 1 Three.js Helpers- 2 Three.js Lights Three.js Shadows Three.js Loaders- 1 Three.js Loaders- 2 Three.js Managers Three.js Materials Three.js Materials- Mesh Three.js Materials- 3 Three.js Math Three.js Interpolant Three.js Objects Three.js Renderers Three.js Scenes

ThreeJS Keyframe Tracks and Animation
2022-04-30 09:00:54

ThreeJS Keyframe Tracks and Animation

A KeyframeTrack is a timed series of keyframes that are made up of lists of times and related values and are used to animate an object's unique property.

BooleanKeyframeTrack

A Track of boolean keyframe values.

Constructor

BooleanKeyframeTrack( name : String, times : Array, values : Array )

name - (required) identifier for the KeyframeTrack.

times - (required) array of keyframe times.

values - values for the keyframes at the times specified.

Properties

It inherits its properties from Keyframe Track, refer to previous lessons. The unique properties are as follows:

.DefaultInterpolation : Constant

The default interpolation type to use, InterpolateDiscrete.

.ValueBufferType : Array

A normal Array (no Float32Array in this case, unlike ValueBufferType of KeyframeTrack).

.ValueTypeName : String

String 'bool'.

Methods

The BooleanKeyframeTrack inherits methods from KeyframeTrack that you can refer in the previous lessons.

.InterpolantFactoryMethodLinear () : undefined

The value of this method here is 'undefined', as it does not make sense for discrete properties.

.InterpolantFactoryMethodSmooth () : undefined

The value of this method here is 'undefined', as it does not make sense for discrete properties.

ColorKeyframeTrack

Color changes are represented via a track of keyframe values.

This subclass's very basic implementation has nothing noteworthy yet. This is, however, the location for colour space parameterization.

Constructor

ColorKeyframeTrack( name : String, times : Array, values : Array )

name - (required) identifier for the KeyframeTrack.

times - (required) array of keyframe times.

values - values for the keyframes at the times specified, a flat array of color components between 0 and 1.

interpolation - the type of interpolation to use.

NumberKeyframeTrack

A Track of numeric keyframe values.

Constructor

NumberKeyframeTrack( name : String, times : Array, values : Array )

name - (required) identifier for the KeyframeTrack.

times - (required) array of keyframe times.

values - values for the keyframes at the times specified.

interpolation - the type of interpolation to use.

QuarterionKeyframeTrack

A Track of quaternion keyframe values.

Constructor

QuaternionKeyframeTrack( name : String, times : Array, values : Array )

name (required) identifier for the KeyframeTrack.

times (required) array of keyframe times.

values for the keyframes at the times specified, a flat array of quaternion components.

interpolation is the type of interpolation to use.

Properties and Methods

It inherits the properties and methods of KeyframTrack. The unique ones are as follows:

.DefaultInterpolation : Constant

The default interpolation type to use, InterpolateLinear.

.ValueTypeName : String

String 'quaternion'.

.InterpolantFactoryMethodLinear () : QuaternionLinearInterpolant

Returns a new QuaternionLinearInterpolant based on the values, times and valueSize of the keyframes.

StringKeyframeTrack

A Track of string keyframe values.

Constructor

StringKeyframeTrack( name : String, times : Array, values : Array )

name - (required) identifier for the KeyframeTrack.

times - (required) array of keyframe times.

values - values for the keyframes at the times specified.

interpolation - the type of interpolation to use.

Properties and Methods

It inherits the properties and methods of KeyframTrack. The unique ones are as follows:

.DefaultInterpolation : Constant

The default interpolation type to use, InterpolateDiscrete.

.ValueBufferType : Array

A normal Array (no Float32Array in this case, unlike ValueBufferType of KeyframeTrack).

.ValueTypeName : String

String 'string'.

.InterpolantFactoryMethodLinear () : undefined

The value of this method here is 'undefined', as it does not make sense for discrete properties.

.InterpolantFactoryMethodSmooth () : undefined

The value of this method here is 'undefined', as it does not make sense for discrete properties.

VectorKeyframeTrack

A Track of vector keyframe values.

Constructor

VectorKeyframeTrack( name : String, times : Array, values : Array )

name - (required) identifier for the KeyframeTrack.

times - (required) array of keyframe times.

Values - values for the keyframes at the times specified a flat array of vector components.

Interpolation - the type of interpolation to use.