Logo

ThreeJS InterleavedBuffer

The term "interleaved" refers to the packing of multiple attributes, possibly of different types (e.g., position, normal, uv, colour) into a single array buffer.

Constructor

InterleavedBuffer( array : TypedArray, stride : Integer )

array -- A typed array with a shared buffer. Stores the geometry data.

stride -- The number of typed-array elements per vertex.

Properties

.array : Array

A typed array with a shared buffer. Stores the geometry data.

.stride : Integer

The number of typed-array elements per vertex.

.count : Integer

Gives the total number of elements in the array.

.updateRange : Object

Object containing offset and count.

.updateRange.offset : Number

Default is 0.

.updateRange.count : Number

Default is -1.

.uuid : String

UUID of this instance. This gets automatically assigned, so this shouldn't be edited.

.version : Integer

A version number, incremented every time the needsUpdate property is set to true.

.needsUpdate : Boolean

Default is false. Setting this to true increments version.

.usage : Usage

Defines the intended usage pattern of the data store for optimization purposes. Corresponds to the usage parameter of WebGLRenderingContext.bufferData().

Methods

.copy ( source : InterleavedBuffer ) : this

Copies another InterleavedBuffer to this InterleavedBuffer.

.copyAt ( index1 : Integer, attribute : InterleavedBuffer, index2 : Integer ) : this

Copies data from attribute[index2] to array[index1].

.set ( value : TypedArray, offset : Integer ) : this

value - The source (typed) array.

offset - The offset into the target array at which to begin writing values from the source array. Default is 0.

Stores multiple values in the buffer, reading input values from a specified array.

.clone ( data : Object ) : InterleavedBuffer

data - This object holds shared array buffers required for properly cloning geometries with interleaved attributes.

Creates a clone of this InterleavedBuffer.

.setUsage ( value : Usage ) : this

Set usage to value.

.toJSON ( data : Object ) : Object

data - This object holds shared array buffers required for properly serializing geometries with interleaved attributes.

InterleavedBufferAttribute

Constructor

InterleavedBufferAttribute( interleavedBuffer : InterleavedBuffer, itemSize : Integer, offset : Integer, normalized : Boolean )

Properties

.data : InterleavedBuffer

The InterleavedBuffer instance passed in the constructor.

.array : TypedArray

The value of data.array.

.count : Integer

The value of data.count. If the buffer is storing a 3-component item (such as a position, normal, or color), then this will count the number of such items stored.

.itemSize : Integer

How many values make up each item.

.name : String

Optional name for this attribute instance. Default is an empty string.

.needsUpdate : Boolean

Default is false. Setting this to true will send the entire interleaved buffer (not just the specific attribute data) to the GPU again.

.normalized : Boolean

Default is false.

.offset : Integer

The offset in the underlying array buffer where an item starts.

Methods

.applyMatrix4 ( m : Matrix4 ) : this

Applies matrix m to every Vector3 element of this InterleavedBufferAttribute.

.applyNormalMatrix ( m : Matrix3 ) : this

Applies normal matrix m to every Vector3 element of this InterleavedBufferAttribute.

.transformDirection ( m : Matrix4 ) : this

Applies matrix m to every Vector3 element of this InterleavedBufferAttribute, interpreting the elements as a direction vectors.

.getX ( index : Integer ) : Number

Returns the x component of the item at the given index.

.getY ( index : Integer ) : Number

Returns the y component of the item at the given index.

.getZ ( index : Integer ) : Number

Returns the z component of the item at the given index.

.getW ( index : Integer ) : Number

Returns the w component of the item at the given index.

.setX ( index : Integer, x : Float ) : this

Sets the x component of the item at the given index.

.setY ( index : Integer, y : Float ) : this

Sets the y component of the item at the given index.

.setZ ( index : Integer, z : Float ) : this

Sets the z component of the item at the given index.

.setW ( index : Integer, w : Float ) : this

Sets the w component of the item at the given index.

.setXY ( index : Integer, x : Float, y : Float ) : this

Sets the x and y components of the item at the given index.

.setXYZ ( index : Integer, x : Float, y : Float, z : Float ) : this

Sets the x, y and z components of the item at the given index.

.setXYZW ( index : Integer, x : Float, y : Float, z : Float, w : Float ) : this

Sets the x, y, z and w components of the item at the given index.

Related Topics

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.

ThreeJS Helpers 2

PolarGridHelper The PolarGridHelper is an object to define polar grids. Grids are two-dimensional arrays of lines. Code Example const radius = 10; const radials = 16; const circles = 8; const divisions = 64; const helper =...

4 minutes read.

ThreeJS Matrix Transformations

Three.js encodes 3D transformations using matrices for translations (position), rotations, and scaling. Every Object3D instance has a matrix that records the location, rotation, and scale of the object. This page...

2 minutes read.

ThreeJS Material - Mesh

MeshBasicMaterial A material for drawing geometries in a simple shaded (flat or wireframe) way. This material is not affected by lights. Constructor MeshBasicMaterial( parameters : Object ) parameters - (optional) an object with one or...

24 minutes read.

ThreeJS AnimationClip

An AnimationClip is a group of keyframe tracks that may be reused to depict an animation. The "Animation System" page in the "Next Steps" part of the handbook provides an overview...

2 minutes read.

ThreeJS Loading 3D Models

There are hundreds of file formats for 3D models, each with its own purpose, set of features, and level of complexity. Although three.js has a lot of loaders, choosing the...

2 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 Property Binding and Mixer

PropertyBinding Internally, this holds a reference to real property in the scene graph. Constructor PropertyBinding( rootNode : Object3D, path, parsedPath ) -- rootNode: -- path -- parsedPath (optional) Properties The properties are as follows: .path : Number.parsedPath...

2 minutes read.

ThreeJS BufferGeometry

A mesh, line, or point geometry representation. Included within buffers are vertex positions, face indices, normals, colours, UVs, and custom attributes, lowering the cost of passing all of this data...

5 minutes read.

ThreeJS AnimationMixer

The AnimationMixer is a player that allows you to play animations on a specific object in the scene. When many items in a scene are animated individually, each object may...

2 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 Managers

DefaultLoadingManager When no custom manager is specified, most loaders use a global instance of the LoadingManager. This will suffice for most purposes, but there may be times when you want separate loading...

4 minutes read.

ThreeJS Loaders 2

ImageBitmapLoader A loader that converts an image to an ImageBitmap. An ImageBitmap provides an asynchronous and resource-efficient path for preparing textures for WebGL rendering. ImageBitmapLoader, unlike FileLoader, does not prevent multiple concurrent...

8 minutes read.

ThreeJS Cameras

ArrayCamera ArrayCamera can be used to render a scene using a preset group of cameras quickly. This is an important feature of VR scene rendering performance. An array of sub cameras is...

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 InterleavedBuffer

The term "interleaved" refers to the packing of multiple attributes, possibly of different types (e.g., position, normal, uv, colour) into a single array buffer. Constructor InterleavedBuffer( array : TypedArray, stride : Integer...

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

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