You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
128 lines
3.3 KiB
128 lines
3.3 KiB
2 years ago
|
<!DOCTYPE html>
|
||
|
<html lang="en">
|
||
|
<head>
|
||
|
<meta charset="utf-8" />
|
||
|
<base href="../../../" />
|
||
|
<script src="page.js"></script>
|
||
|
<link type="text/css" rel="stylesheet" href="page.css" />
|
||
|
</head>
|
||
|
<body>
|
||
|
|
||
|
<h1>[name]</h1>
|
||
|
|
||
|
<p class="desc">
|
||
|
Use an array of [page:Bone bones] to create a skeleton that can be used by a
|
||
|
[page:SkinnedMesh].
|
||
|
</p>
|
||
|
|
||
|
<h2>Code Example</h2>
|
||
|
<code>
|
||
|
// Create a simple "arm"
|
||
|
|
||
|
const bones = [];
|
||
|
|
||
|
const shoulder = new THREE.Bone();
|
||
|
const elbow = new THREE.Bone();
|
||
|
const hand = new THREE.Bone();
|
||
|
|
||
|
shoulder.add( elbow );
|
||
|
elbow.add( hand );
|
||
|
|
||
|
bones.push( shoulder );
|
||
|
bones.push( elbow );
|
||
|
bones.push( hand );
|
||
|
|
||
|
shoulder.position.y = -5;
|
||
|
elbow.position.y = 0;
|
||
|
hand.position.y = 5;
|
||
|
|
||
|
const armSkeleton = new THREE.Skeleton( bones );
|
||
|
</code>
|
||
|
|
||
|
<p>
|
||
|
See the [page:SkinnedMesh] page for an example of usage with standard [page:BufferGeometry].
|
||
|
</p>
|
||
|
|
||
|
<h2>Constructor</h2>
|
||
|
|
||
|
|
||
|
<h3>[name]( [param:Array bones], [param:Array boneInverses] )</h3>
|
||
|
<p>
|
||
|
[page:Array bones] - The array of [page:Bone bones]. Default is an empty array.<br/>
|
||
|
[page:Array boneInverses] - (optional) An array of [page:Matrix4 Matrix4s].<br /><br />
|
||
|
|
||
|
Creates a new [name].
|
||
|
</p>
|
||
|
|
||
|
|
||
|
<h2>Properties</h2>
|
||
|
|
||
|
<h3>[property:Array bones]</h3>
|
||
|
<p>
|
||
|
The array of [page:bone bones]. Note this is a copy of the original array, not a reference,
|
||
|
so you can modify the original array without effecting this one.
|
||
|
</p>
|
||
|
|
||
|
<h3>[property:Array boneInverses]</h3>
|
||
|
<p>
|
||
|
An array of [page:Matrix4 Matrix4s] that represent the inverse of the [page:Matrix4 matrixWorld]
|
||
|
of the individual bones.
|
||
|
</p>
|
||
|
|
||
|
<h3>[property:Float32Array boneMatrices]</h3>
|
||
|
<p>
|
||
|
The array buffer holding the bone data when using a vertex texture.
|
||
|
</p>
|
||
|
|
||
|
<h3>[property:DataTexture boneTexture]</h3>
|
||
|
<p>
|
||
|
The [page:DataTexture] holding the bone data when using a vertex texture.
|
||
|
</p>
|
||
|
|
||
|
<h3>[property:Integer boneTextureSize]</h3>
|
||
|
<p>
|
||
|
The size of the [page:.boneTexture].
|
||
|
</p>
|
||
|
|
||
|
<h2>Methods</h2>
|
||
|
|
||
|
<h3>[method:Skeleton clone]()</h3>
|
||
|
<p>
|
||
|
Returns a clone of this Skeleton object.
|
||
|
</p>
|
||
|
|
||
|
<h3>[method:undefined calculateInverses]()</h3>
|
||
|
<p>Generates the [page:.boneInverses boneInverses] array if not provided in the constructor.</p>
|
||
|
|
||
|
<h3>[method:this computeBoneTexture]()</h3>
|
||
|
<p>Computes an instance of [page:DataTexture] in order to pass the bone data more efficiently to the shader. The texture is assigned to [page:.boneTexture boneTexture].</p>
|
||
|
|
||
|
<h3>[method:undefined pose]()</h3>
|
||
|
<p>Returns the skeleton to the base pose.</p>
|
||
|
|
||
|
<h3>[method:undefined update]()</h3>
|
||
|
<p>
|
||
|
Updates the [page:Float32Array boneMatrices] and [page:DataTexture boneTexture] after changing the bones.
|
||
|
This is called automatically by the [page:WebGLRenderer] if the skeleton is used with a [page:SkinnedMesh].
|
||
|
</p>
|
||
|
|
||
|
<h3>[method:Bone getBoneByName]( [param:String name] )</h3>
|
||
|
<p>
|
||
|
name -- String to match to the Bone's .name property. <br /><br />
|
||
|
|
||
|
Searches through the skeleton's bone array and returns the first with a matching name.<br />
|
||
|
</p>
|
||
|
|
||
|
<h3>[method:undefined dispose]()</h3>
|
||
|
<p>
|
||
|
Frees the GPU-related resources allocated by this instance. Call this method whenever this instance is no longer used in your app.
|
||
|
</p>
|
||
|
|
||
|
<h2>Source</h2>
|
||
|
|
||
|
<p>
|
||
|
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
|
||
|
</p>
|
||
|
</body>
|
||
|
</html>
|