Logo

ThreeJS Interpolant

CubicInterpolant

Code Example

const interpolant = new THREE.CubicInterpolant(

new Float32Array( 2 ),

new Float32Array( 2 ),

1,

new Float32Array( 1 )

);


interpolant.evaluate( 0.5 );

Constructor

CubicInterpolant( parameterPositions, sampleValues, sampleSize, resultBuffer )

parameterPositions -- array of positions

sampleValues -- array of samples

sampleSize -- number of samples

resultBuffer -- buffer to store the interpolation results.

Properties

.parameterPositions : null

.resultBuffer : null

.sampleValues : null

.settings : Object

.valueSize : null

Methods

.evaluate ( t : Number ) : Array

Evaluate the interpolant at position t.

DiscreteInterpolant

Code Example

const interpolant = new THREE.DiscreteInterpolant(

new Float32Array( 2 ),

new Float32Array( 2 ),

1,

new Float32Array( 1 )

);


interpolant.evaluate( 0.5 );

Constructor

DiscreteInterpolant( parameterPositions, sampleValues, sampleSize, resultBuffer )

parameterPositions -- array of positions

sampleValues -- array of samples

sampleSize -- number of samples

resultBuffer -- buffer to store the interpolation results.

Properties

.parameterPositions : null

.resultBuffer : null

.sampleValues : null

.settings : Object

.valueSize : null

Methods

.evaluate ( t : Number ) : Array

Evaluate the interpolant at position t.

LinearInterpolant

Code Example

const interpolant = new THREE.LinearInterpolant(

new Float32Array( 2 ),

new Float32Array( 2 ),

1,

new Float32Array( 1 )

);


interpolant.evaluate( 0.5 );

Constructor

LinearInterpolant( parameterPositions, sampleValues, sampleSize, resultBuffer )

parameterPositions -- array of positions

sampleValues -- array of samples

sampleSize -- number of samples

resultBuffer -- buffer to store the interpolation results.

Properties

.parameterPositions : null

.resultBuffer : null

.sampleValues : null

.settings : Object

.valueSize : null

Methods

.evaluate ( t : Number ) : Array

Evaluate the interpolant at position t.

QuaternionLinearInterpolant

Code Example

const interpolant = new THREE.QuaternionLinearInterpolant(

new Float32Array( 2 ),

new Float32Array( 2 ),

1,

new Float32Array( 1 )

);


interpolant.evaluate( 0.5 );

Constructor

QuaternionLinearInterpolant( parameterPositions, sampleValues, sampleSize, resultBuffer)

parameterPositions -- array of positions

sampleValues -- array of samples

sampleSize -- number of samples

resultBuffer -- buffer to store the interpolation results.

Properties

.parameterPositions : null

.resultBuffer : null

.sampleValues : null

.settings : Object

.valueSize : null

Methods

.evaluate ( t : Number ) : Array

Evaluate the interpolant at position t.

Related Topics

ThreeJS Object3D

This is the base class for most three.js objects, and it provides a set of properties and methods for manipulating objects in 3D space. It should be noted that this can...

9 minutes read.

ThreeJS AnimationAction

AnimationActions are used to schedule the playback of animations saved in AnimationClips. Note that the majority of AnimationAction's methods can be chained together. The "Animation System" page in the "Next Steps" part...

6 minutes read.

ThreeJS Audio

It is used to create a non-positional (global ) audio object. Code Example: // create an AudioListener and add it to the camera const listener = new THREE.AudioListener(); camera.add( listener ); // create a global...

6 minutes read.

ThreeJS Shadows

LightShadow Serves as a base class for the other shadow classes. Constructor LightShadow( camera : Camera ) camera - the light's view of the world. Create a new LightShadow. This is not intended to be...

7 minutes read.

ThreeJS Uniform

Uniforms are global GLSL variables. They are passed to shader programs. Code Example When declaring a uniform of a ShaderMaterial, it is declared by value or by object. uniforms: { time: { value: 1.0...

2 minutes read.

ThreeJS Lines and Texts

Drawing Lines Let's say you want to draw a line or a circle, not a wireframe Mesh. First, we need to set up the renderer, scene, and camera. Here is the...

3 minutes read.

ThreeJS Curve

An abstract base class for creating a Curve object with interpolation methods. CurvePath is an array of Curves. Constructor Curve() This constructor creates a new Curve. Properties .arcLengthDivisions : Integer This value determines the amount of...

13 minutes read.

ThreeJs Tutorial

What is Three.JS? Three.js is a cross-browser JavaScript library and application programming interface that uses WebGL to create and display animated 3D computer graphics in a web browser. The source code...

6 minutes read.

ThreeJS Compatibiliy Check and Running Locally

Even though this is becoming less of an issue, some devices or browsers may still be incompatible with WebGL. The method below enables you to check if it is supported...

3 minutes read.

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...

3 minutes read.

ThreeJS Loader 1

AnimationLoader Class for loading AnimationClips in JSON format. This uses the FileLoader internally for loading files. Code Example // instantiate a loader const loader = new THREE.AnimationLoader(); // load a resource loader.load( // resource URL 'animations/animation.js', // onLoad callback function...

8 minutes read.

ThreeJS Materials 3

RawShaderMaterial This class works just like ShaderMaterial, except that definitions of built-in uniforms and attributes are not automatically prepended to the GLSL shader code. Code Example const material = new THREE.RawShaderMaterial( {    ...

9 minutes read.

ThreeJS Testing with npm

This article explains how to install three.js in a node.js environment so that automated tests may be run. Tests can be done manually or with the help of automated CI...

4 minutes read.

ThreeJS Math

Box2 Represents an axis-aligned bounding box (AABB) in 2D space. Constructor Box2( min : Vector2, max : Vector2 ) min - (optional) Vector2 representing the lower (x, y) boundary of the box. Default is...

48 minutes read.

ThreeJS Renderers

WebGLMultipleRenderTargets A special render target that enables a fragment shader to write to several textures. This approach is useful for advanced rendering techniques like post-processing or deferred rendering. Heads up: WebGLMultipleRenderTargets...

15 minutes read.

ThreeJS BufferAttribute

This class stores data for an attribute associated with a BufferGeometry (such as vertex positions, face indices, normals, colours, UVs, and any custom attributes), allowing for more efficient data passing...

4 minutes read.

ThreeJS Geometries-1

BoxGeometry BoxGeometry is a geometry class for a rectangular cuboid with a given 'width', 'height', and 'depth'. On creation, the cuboid is centered on the origin, with each edge parallel to...

7 minutes read.

ThreeJS Layers

A Layers object assigns an Object3D to one or more of the 32 layers numbered 0 to 31 - the layers are internally stored as a bit mask, and all...

1 minute read.

ThreeJS Disposing an Object

The disposal of unwanted library entities is a crucial component of improving performance and avoiding memory leaks in your programme. When you create a three.js type instance, you set aside...

4 minutes read.

ThreeJS Objects

Bone A bone that is part of a Skeleton. The skeleton in turn is used by the SkinnedMesh. Bones are almost identical to a blank Object3D. Code Example const root = new THREE.Bone(); const...

12 minutes read.