提交 08c71adc 编写于 作者: M Mr.doob 提交者: GitHub

Merge pull request #10344 from looeee/docs/objects/improve

Updated Objects documentation
......@@ -16,38 +16,41 @@
A bone which is part of a [page:Skeleton]. The skeleton in turn is used by the [page:SkinnedMesh].
Bones are almost identical to a blank [page:Object3D].
</div>
<h3>Example</h3>
<code>
var root = new THREE.Bone();
var child = new THREE.Bone();
root.add( child );
child.position.y = 5;
</code>
<h2>Constructor</h2>
<h3>[name]( [page:SkinnedMesh skin] )</h3>
<h3>[name]( )</h3>
<div>
skin — (optional) The [page:SkinnedMesh] to which the bone belongs.
Creates a new [name].
</div>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:SkinnedMesh skin]</h3>
<h3>[property:Boolean isBone]</h3>
<div>
An optional reference to the [page:SkinnedMesh].
Used to check whether this or derived classes are bones. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
</div>
<h2>Methods</h2>
<h3>[method:Bone clone]()</h3>
<div>
Returns a clone of this Bone object and its descendants.
</div>
<h3>[property:String type]</h3>
<div>Set to 'Bone', this can be used to find all Bones in a scene.</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h2>Source</h2>
......
......@@ -12,7 +12,10 @@
<h1>[name]</h1>
<div class="desc">This is almost identical to an [page:Object3D Object3D]. It's purpose is to make working with groups of objects syntactically clearer.</div>
<div class="desc">
This is almost identical to an [page:Object3D Object3D]. It's purpose is to make working
with groups of objects syntactically clearer.
</div>
<h2>Example</h2>
......@@ -42,15 +45,13 @@
<h3>[name]( )</h3>
<h2>Properties</h2>
Properties are identical to an [page:Object3D]'s properties, with the exception of:
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:String type]</h3>
<div>A string 'Group'. This should not be changed.</div>
<h2>Methods</h2>
Methods are identical to an [page:Object3D]'s methods.
<div>See the base [page:Object3D] class for common methods.</div>
<h2>Source</h2>
......
......@@ -12,83 +12,101 @@
<h1>[name]</h1>
<div class="desc">Level of Detail - Show meshes with more or less geometry based on distance.</div>
<div class="desc">
Level of Detail - show meshes with more or less geometry based on distance from the camera.<br /><br />
Every level is associated with an object, and rendering can be switched between them at the distances
specified. Typically you would create, say, three meshes, one for far away (low detail), one for mid range (medium detail)
and one for close up (high detail).
</div>
<h2>Example</h2>
<div>
[example:webgl_lod LOD]
</div>
<code>
var lod = new THREE.LOD();
//Create 5 levels of spheres
for( var i = 0; i < 5; i++ ) {
var geometry = new THREE.IcosahedronGeometry( 10, 5 - i )
new THREE.Mesh( geometry, material );
lod.addLevel( mesh, i * 50 );
}
</code>
<h2>Constructor</h2>
var lod = new THREE.LOD();
//Create spheres with 3 levels of detail and create new LOD levels for them
for( var i = 0; i < 3; i++ ) {
<h3>[name]()</h3>
var geometry = new THREE.IcosahedronBufferGeometry( 10, 3 - i )
new THREE.Mesh( geometry, material );
<h2>Properties</h2>
lod.addLevel( mesh, i * 75 );
}
scene.add( lod );
</code>
Note that for the LOD to switch between the different detail levels, you will
have to call [page:.update update]( camera ) in your render loop. See the source code
for this example for details:
[example:webgl_lod WebGL / LOD]
<h3>[property:array levels]</h3>
<div>
An array of [page:object level] objects
</div>
<div>
level is an object with two properties.
</div>
<h2>Constructor</h2>
<h3>[name]( )</h3>
<div>
distance -- The distance at which to display this level of detail<br />
object -- The Object3D which will be displayed
Creates a new [name].
</div>
<h2>Methods</h2>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[method:null addLevel]( [page:Object3D mesh], [page:Float distance] )</h3>
<h3>[property:array levels]</h3>
<div>
mesh -- The Object3D to display <br />
distance -- The distance at which to display this level of detail
An array of [page:object level] objects<br /><br />
Each level is an object with two properties:<br />
[page:Object3D object] - The [page:Object3D] to display at this level.<br />
[page:Float distance] - The distance at which to display this level of detail.
</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h3>[method:null addLevel]( [page:Object3D object], [page:Float distance] )</h3>
<div>
[page:Object3D object] - The [page:Object3D] to display at this level.<br />
[page:Float distance] - The distance at which to display this level of detail.<br /><br />
Adds a mesh that will display at a certain distance and greater. Typically the further away the distance,
the lower the detail on the mesh.
</div>
<h3>[method:Object3D getObjectForDistance]( [page:Float distance] )</h3>
<h3>[method:LOD clone]()</h3>
<div>
Get a reference to the first [page:Object3D] (mesh) that is greater than supplied distance.
Returns a clone of this LOD object and its associated distance specific objects.
</div>
<h3>[method:null update]( [page:Camera camera] )</h3>
<h3>[method:Object3D getObjectForDistance]( [page:Float distance] )</h3>
<div>
camera -- The current camera
Get a reference to the first [page:Object3D] (mesh) that is greater than [page:Float distance].
</div>
<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Update the visiblility of the level of detail based on the distance from the camera.
Get intersections between a casted [page:Ray] and this LOD.
[page:Raycaster.intersectObject] will call this method.
</div>
<h3>[method:LOD clone]()</h3>
<h3>[method:null toJSON]( meta )</h3>
<div>
Returns a clone of this LOD object and its associated distance specific objects.
Create a JSON structure with details of this LOD object.
</div>
<h3>[method:null update]( [page:Camera camera] )</h3>
<div>
Set the visibility of each [page:levels level]'s [page:Object3D object] based on
distance from the [page:Camera camera]. This needs to be called in the render loop
for levels of detail to be updated dynamically.
</div>
<h2>Source</h2>
......
......@@ -12,64 +12,113 @@
<h1>[name]</h1>
<div class="desc">Creates a simulated lens flare that tracks a light.<br /><br />
Note: [page:WebGLRenderer] must have *alpha* set to *true* for LensFlare to work.</div>
<div class="desc">
Creates a simulated lens flare that tracks a light.<br /><br />
Note: [page:WebGLRenderer.alpha] must be set to *true* for LensFlare to work.
</div>
<h2>Example</h2>
<div>[example:webgl_lensflares lensflares]</div>
<div>
[example:webgl_lensflares lensflares]
<code>
var light = new THREE.PointLight( 0xffffff, 1.5, 2000 );
var textureLoader = new THREE.TextureLoader();
var textureFlare = textureLoader.load( "textures/lensflare/lensflare.png" );
var flareColor = new THREE.Color( 0xffffff );
flareColor.setHSL( h, s, l + 0.5 );
var lensFlare = new THREE.LensFlare( textureFlare, 700, 0.0, THREE.AdditiveBlending, flareColor );
lensFlare.position.copy( light.position );
scene.add( lensFlare );
</code>
</div>
<h2>Constructor</h2>
<h3>[name]( [page:Texture texture], [page:Float size], [page:Float distance], [page:Materials blending], [page:Color color] )</h3>
<div>
texture -- THREE.Texture (optional) <br />
size -- size in pixels (-1 = use texture.width) <br />
distance -- (0-1) from light source (0 = at light source) <br />
blending -- [page:Materials Blending Mode] - Defaults to THREE.NormalBlending <br />
color -- The color of the lens flare
</div>
<div>
Automatically adds a lens flare to the lensFlares array if a texture is set.
[page:Texture texture] - (optional) THREE.Texture to use for the flare. <br />
[page:Float size] - (optional) size in pixels (-1 = use texture.width) <br />
[page:Float distance] - (optional) (0-1) from light source (0 = at light source) <br />
[page:Materials blending] - (optional) [page:Materials Blending Mode] - Defaults to THREE.NormalBlending <br />
[page:Color color] - (optional) the [page:Color] of the lens flare<br /><br />
Automatically adds a lens flare to the lensFlares array if a [page:Texture texture] is set.
If [page:Texture texture] not passed here, [page:.add add] must be called later.
</div>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:Boolean isLensFlare]</h3>
<div>
Used to check whether this or derived classes are lens flares. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
</div>
<h3>[property:array lensFlares]</h3>
<div>
The array of flares as set by [page:LensFlare.add]
The array of flares as set by [page:LensFlare.add] or passed in the constructor.
Each flare is an object with the following defaults:
<code>
{
texture: texture, // texture passed in the constructor or [page:.add add] method
size: size, // if not passed in, default is -1
distance: distance, // if not passed in, default is 0
x: 0, y: 0, z: 0, // screen position (-1 => 1) z = 0 is in front z = 1 is back
scale: 1,
rotation: 0,
opacity: opacity, // if not passed in, default is 1
color: color, // if not passed in, default is new Color( 0xffffff ) (white)
blending: blending // if not passed in, default is NormalBlending
}
</code>
</div>
<h3>[property:Vector3 positionScreen]</h3>
<div>
The position of the lens flare on the screen.
</div>
<div>The position of the lens flare on the screen.</div>
<h3>[property:Function customUpdateCallback]</h3>
<div>
A custom update callback
A custom update callback. Default is undefined, set this to override [page:.updateLensFlares updateLensFlares]().
</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h3>[method:null add]( [page:Texture texture], [page:Float size], [page:Float distance], [page:Materials blending], [page:Color color] )</h3>
<div>
Adds a lens flare. See the constructor for details on the parameters.
Adds a lens flare. Takes the same parameters as the constructor.
</div>
<h3>[method:LensFlare clone]()</h3>
<div>
Return a new LensFlare with the same parameters as this one.
</div>
<h3>[method:null updateLensFlares]()</h3>
<h3>[method:LensFlare copy]( [page:LensFlare source] )</h3>
<div>
Updates the lens flare based on the [page:LensFlare.positionScreen positionScreen] property.
Copy the parameters from the [page:LensFlare source] LensFlare into this one.
</div>
<h3>[method:Lens Flare clone]()</h3>
<h3>[method:null updateLensFlares]()</h3>
<div>
Returns a clone of this LensFlare object and its descendants.
Updates [page:.lensFlares lensFlares] based on the [page:LensFlare.positionScreen positionScreen]
property.<br /><br />
Can be overridden by setting the [page:.customUpdateCallback customUpdateCallback] function.
</div>
......
......@@ -12,7 +12,15 @@
<h1>[name]</h1>
<div class="desc">A continuous line.</div>
<div class="desc">
A continuous line.<br /><br />
This is nearly the same
as [page:LineSegments]; the only difference is that it is rendered using
[link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements gl.LINES]
instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements gl.LINE_STRIP]
</div>
<h2>Example</h2>
......@@ -38,33 +46,40 @@
<h3>[name]( [page:Geometry geometry], [page:Material material] )</h3>
<div>
geometry — Vertices representing the line segment(s).<br />
material — Material for the line. Default is [page:LineBasicMaterial LineBasicMaterial].<br />
[page:Geometry geometry] — vertices representing the line segment(s). Default is a new [page:new BufferGeometry].<br />
[page:Material material] — material for the line. Default is a new [page:LineBasicMaterial] with random color.<br />
</div>
<div>If no material is supplied, a randomized line material will be created and assigned to the object.</div>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:Geometry geometry]</h3>
<h3>[property:Boolean isLine]</h3>
<div>
Vertices representing the line segment(s).
Used to check whether this or derived classes are lines. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
</div>
<h3>[property:Geometry geometry]</h3>
<div>Vertices representing the line segment(s).</div>
<h3>[property:Material material]</h3>
<div>
Material for the line.
</div>
<div>Material for the line.</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Get intersections between a casted ray and this Line. [page:Raycaster.intersectObject] will call this method.
Get intersections between a casted [page:Ray] and this Line.
[page:Raycaster.intersectObject] will call this method.
</div>
<h3>[method:Line clone]()</h3>
<div>
Returns a clone of this Line object and its descendants.
......
......@@ -8,11 +8,17 @@
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:Line] &rarr;
[page:Object3D] &rarr; [page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">A series of lines drawn between pairs of vertices.</div>
<div class="desc">
A series of lines drawn between pairs of vertices.<br /><br />
This is nearly the same as [page:Line]; the only difference is that it is rendered using
[link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements gl.LINE_STRIP]
instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements gl.LINES]
</div>
<h2>Constructor</h2>
......@@ -20,39 +26,26 @@
<h3>[name]( [page:Geometry geometry], [page:Material material] )</h3>
<div>
geometry — Pair(s) of vertices representing each line segment(s).<br />
material — Material for the line. Default is [page:LineBasicMaterial LineBasicMaterial].
[page:Geometry geometry] — Pair(s) of vertices representing each line segment(s).<br />
[page:Material material] — Material for the line. Default is [page:LineBasicMaterial LineBasicMaterial].
</div>
<div>If no material is supplied, a randomized line material will be created and assigned to the object.</div>
<h2>Properties</h2>
<div>See the base [page:Line] class for common properties.</div>
<h3>[property:Geometry geometry]</h3>
<h3>[property:Boolean isLineSegments]</h3>
<div>
Pair(s) of vertices representing the line segment(s).
</div>
Used to check whether this or derived classes are line segments. Default is *true*.<br /><br />
<h3>[property:Material material]</h3>
<div>
Material for the line.
You should not change this, as it used internally for optimisation.
</div>
<h2>Methods</h2>
<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Get intersections between a casted ray and this Line. [page:Raycaster.intersectObject] will call this method.
</div>
<h3>[method:LineSegments clone]()</h3>
<div>
Returns a clone of this LineSegments object and its descendants.
</div>
<div>See the base [page:Line] class for common methods.</div>
<h2>Source</h2>
......
......@@ -12,12 +12,16 @@
<h1>[name]</h1>
<div class="desc">Base class for Mesh objects, such as [page:MorphAnimMesh] and [page:SkinnedMesh].</div>
<div class="desc">
Class representing triangular [link:https://en.wikipedia.org/wiki/Polygon_mesh polygon mesh] based objects.
Also serves as a base for other classes such as [page:MorphAnimMesh] and [page:SkinnedMesh].
</div>
<h2>Example</h2>
<code>var geometry = new THREE.BoxGeometry( 1, 1, 1 );
<code>
var geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
var mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
......@@ -27,65 +31,82 @@
<h2>Constructor</h2>
<h3>[name]( [page:Geometry geometry], [page:Material material] )</h3>
<div>
geometry — An instance of [page:Geometry].<br />
material — An instance of [page:Material] (optional).
[page:Geometry geometry] — (optional) an instance of [page:Geometry] or [page:BufferGeometry].
Default is a new [page:BufferGeometry].<br />
[page:Material material] — (optional) a [page:Material]. Default is a new [page:MeshBasicMaterial]
with a random color.
</div>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:Integer drawMode]</h3>
<div>
Determines how the mesh triangles are constructed from the vertices.
See the draw mode [page:DrawModes constants] for all possible values.
Default is [page:DrawModes TrianglesDrawMode].
</div>
<h3>[property:Boolean isMesh]</h3>
<div>
Used to check whether this or derived classes are meshes. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
</div>
<h3>[property:Geometry geometry]</h3>
<div>
An instance of [page:Geometry] or [page:BufferGeometry] (or derived classes),
defining the object's structure.<br /><br />
<div>An instance of [page:Geometry], defining the object's structure.</div>
Its recommended to always use a [page:BufferGeometry] if possible for best performance.
</div>
<h3>[property:Material material]</h3>
<div>An instance of [page:Material], defining the object's appearance. Default is a [page:MeshBasicMaterial] with wireframe mode enabled and randomised colour.</div>
<div>
An instance of material derived from the [page:Material] base class, defining the
object's appearance. Default is a [page:MeshBasicMaterial] with a random colour.
</div>
<h3>[property:Array morphTargetInfluences]</h3>
<div>
An array of weights typically from 0-1 that specify how much of the morph is applied.
Undefined by default, but reset to a blank array by [page:Mesh.updateMorphTargets updateMorphTargets].
</div>
<h3>[property:Array morphTargetDictionary]</h3>
<div>
A dictionary of morphTargets based on the morphTarget.name property.
Undefined by default, but rebuilt [page:Mesh.updateMorphTargets updateMorphTargets].
</div>
<h3>[property:Integer drawMode]</h3>
<div>
Determines how the mesh triangles are constructed from the vertices. See the draw mode [page:DrawModes constants] for all possible values. Default is [page:DrawModes TrianglesDrawMode].
</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h3>[method:null updateMorphTargets]()</h3>
<div>
Updates the morphtargets to have no influence on the object. Resets the
[page:Mesh.morphTargetInfluences morphTargetInfluences],
[page:Mesh.morphTargetDictionary morphTargetDictionary], and
[page:Mesh.morphTargetBase morphTargetBase] properties.
</div>
<h3>[method:null setDrawMode]()</h3>
<div>Set the value of [page:.drawMode drawMode].</div>
<h3>[method:Mesh clone]()</h3>
<div>Returns a clone of this [name] object and its descendants.</div>
<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Get intersections between a casted ray and this mesh. [page:Raycaster.intersectObject] will call this method.
Get intersections between a casted ray and this mesh.
[page:Raycaster.intersectObject] will call this method.
</div>
<h3>[method:Mesh clone]()</h3>
<h3>[method:null updateMorphTargets]()</h3>
<div>
Returns a clone of this Mesh object and its descendants.
Updates the morphtargets to have no influence on the object. Resets the
[page:Mesh.morphTargetInfluences morphTargetInfluences] and
[page:Mesh.morphTargetDictionary morphTargetDictionary] properties.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -12,35 +12,56 @@
<h1>[name]</h1>
<div class="desc">A class for displaying points. For example, if using the [page:WebGLRenderer], the points are displayed using GL_POINTS.</div>
<div class="desc">
A class for displaying points.
The points are rendered by the [page:WebGLRenderer] using
[link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/drawElements gl.POINTS].
</div>
<h2>Constructor</h2>
<h3>[name]( [page:Geometry geometry], [page:Material material] )</h3>
<div>
geometry — An instance of [page:Geometry].<br />
material — An instance of [page:Material] (optional).
[page:Geometry geometry] — (optional) an instance of [page:Geometry] or [page:BufferGeometry].
Default is a new [page:BufferGeometry].<br />
[page:Material material] — (optional) a [page:Material]. Default is a new [page:PointsMaterial]
with a random color.
</div>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:Geometry geometry]</h3>
<div>
An instance of [page:Geometry] or [page:BufferGeometry] (or derived classes),
defining the object's structure.<br /><br />
<div>An instance of [page:Geometry], where each vertex designates the position the points.</div>
Its recommended to always use a [page:BufferGeometry] if possible for best performance.
</div>
<h3>[property:Material material]</h3>
<h3>[property:Boolean isPoints]</h3>
<div>
Used to check whether this or derived classes are points. Default is *true*.<br /><br />
<div>An instance of [page:Material], defining the object's appearance. Default is a [page:PointsMaterial] with randomised colour.</div>
You should not change this, as it used internally for optimisation.
</div>
<h3>[property:Material material]</h3>
<div>
An instance of [page:Material], defining the object's appearance.
Default is a [page:PointsMaterial] with a random colour.
</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Get intersections between a casted ray and this Points. [page:Raycaster.intersectObject] will call this method.
Get intersections between a casted ray and this Points.
[page:Raycaster.intersectObject] will call this method.
</div>
<h3>[method:Points clone]()</h3>
......
......@@ -8,125 +8,123 @@
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">
Use an array of [page:Bone bones] to create a skeleton that can be used by a [page:SkinnedMesh].
WebGL only.
Use an array of [page:Bone bones] to create a skeleton that can be used by a
[page:SkinnedMesh].
</div>
<h2>Example</h2>
<div>
<code>
// Create a simple "arm"
var bones = [];
var shoulder = new THREE.Bone();
var elbow = new THREE.Bone();
var hand = new THREE.Bone();
shoulder.add( elbow );
elbow.add( hand );
bones.push( shoulder );
bones.push( elbow );
bones.push( hand );
<code>
// Create a simple "arm"
var bones = [];
var shoulder = new THREE.Bone();
var elbow = new THREE.Bone();
var 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;
var armSkeleton = new THREE.Skeleton( bones );
// See THREE.SkinnedMesh for an example of usage with a mesh
</code>
shoulder.position.y = -5;
elbow.position.y = 0;
hand.position.y = 5;
var armSkeleton = new THREE.Skeleton( bones );
</code>
See the [page:SkinnedMesh] page for an example of usage with standard [page:BufferGeometry].
</div>
<h2>Constructor</h2>
<h3>[name]( [page:Array bones], [page:Array boneInverses], [page:Boolean useVertexTexture] )</h3>
<div>
bones — The array of [page:bone bones]<br/>
boneInverses — (optional) An array of [page:Matrix4 Matrix4s]<br/>
useVertexTexture — (optional) Whether or not to use a vertex texture in the shader.
</div>
<div>
The constructor automatically sets up all of the properties below.
[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/>
[page:Boolean useVertexTexture] - (optional) Whether or not to use a vertex texture in the shader.
Default is true.<br /><br />
Creates a new [name].
</div>
<h2>Properties</h2>
<h3>[property:Array bones]</h3>
<div>
The array of [page:bone bones]
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.
</div>
<h3>[property:Boolean useVertexTexture]</h3>
<h3>[property:Array boneInverses]</h3>
<div>
Whether or not to use a vertex texture in the shader, set in the constructor. Not all devices
support floating point pixel textures. If this option is set then the bone matrices will be packed into
a texture and sent to the shader. This method allows a much larger set of bones to be used. Otherwise
the vertex shader will use uniforms, which do not allow for as many bones to be used. The exact
numbers vary between devices.
An array of [page:Matrix4 Matrix4s] that represent the inverse of the [page:Matrix4 matrixWorld]
of the individual bones.
</div>
<h3>[property:Array boneInverses]</h3>
<h3>[property:Float32Array boneMatrices]</h3>
<div>
An array of [page:Matrix4 Matrix4s] that represent the inverse of the matrixWorld of the individual bones.
The array buffer holding the bone data when using a vertex texture.
</div>
<h3>[property:Integer boneTextureWidth]</h3>
<h3>[property:DataTexture boneTexture]</h3>
<div>
The width of the vertex data texture.
The [page:DataTexture] holding the bone data when using a vertex texture.
</div>
<h3>[property:Integer boneTextureHeight]</h3>
<div>
The height of the vertex data texture.
</div>
<h3>[property:Float32Array boneMatrices]</h3>
<h3>[property:Integer boneTextureWidth]</h3>
<div>
The array buffer holding the bone data when using a vertex texture.
The width of the vertex data texture.
</div>
<h3>[property:DataTexture boneTexture]</h3>
<h3>[property:Boolean useVertexTexture]</h3>
<div>
The [page:DataTexture] holding the bone data when using a vertex texture.
Whether or not to use a vertex texture in the shader, set in the constructor.
Not all devices support floating point pixel textures. If this option is set then
the bone matrices will be packed into a texture and sent to the shader. This method
allows a much larger set of bones to be used. Otherwise the vertex shader will use
uniforms, which do not allow for as many bones to be used. The exact numbers vary
between devices.
</div>
<h2>Methods</h2>
<h3>[method:Skeleton clone]()</h3>
<div>
Returns a clone of this Skeleton object.
</div>
<h3>[method:null calculateInverses]()</h3>
<div>Generates the boneInverses.</div>
<div>Generates the [page:.boneInverses boneInverses] array if not provided in the constructor.</div>
<h3>[method:null pose]()</h3>
<div>Returns the skeleton to the base pose.</div>
<h3>[method:null update]()</h3>
<div>
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].
</div>
<h3>[method:Skeleton clone]()</h3>
<div>
Returns a clone of this Skeleton object.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -8,7 +8,7 @@
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:Object3D] &rarr;
[page:Object3D] &rarr; [page:Mesh] &rarr;
<h1>[name]</h1>
......@@ -33,97 +33,111 @@
</script>
<h2>Example</h2>
<code>
var geometry = new THREE.CylinderGeometry( 5, 5, 5, 5, 15, 5, 30 );
var geometry = new THREE.CylinderBufferGeometry( 5, 5, 5, 5, 15, 5, 30 );
//Create the skin indices and skin weights
for ( var i = 0; i < geometry.vertices.length; i ++ ) {
// Imaginary functions to calculate the indices and weights
// This part will need to be changed depending your skeleton and model
var skinIndex = calculateSkinIndex( geometry.vertices, i );
var skinWeight = calculateSkinWeight( geometry.vertices, i );
// Ease between each bone
geometry.skinIndices.push( new THREE.Vector4( skinIndex, skinIndex + 1, 0, 0 ) );
geometry.skinWeights.push( new THREE.Vector4( 1 - skinWeight, skinWeight, 0, 0 ) );
geometry.skinWeights.push( new THREE.Vector4( 1 - skinWeight, skinWeight, 0, 0 ) );
}
var mesh = THREE.SkinnedMesh( geometry, material );
// See example from THREE.Skeleton for the armSkeleton
var rootBone = armSkeleton.bones[ 0 ];
mesh.add( rootBone );
// Bind the skeleton to the mesh
mesh.bind( armSkeleton );
// Move the bones and manipulate the model
armSkeleton.bones[ 0 ].rotation.x = -0.1;
armSkeleton.bones[ 1 ].rotation.x = 0.2;
</code>
<h2>Constructor</h2>
<h2>Constructor</h2>
<h3>[name]( [page:Geometry geometry], [page:Material material], [page:boolean useVertexTexture] )</h3>
<div>
geometry — An instance of [page:Geometry]. [page:Geometry.skinIndices] and [page:Geometry.skinWeights] should be set.<br />
material — An instance of [page:Material] (optional).<br />
useVertexTexture -- Defines whether a vertex texture can be used (optional).
[page:Geometry geometry] - an instance of [page:Geometry] or [page:BufferGeometry] (recommended).
[page:Geometry.skinIndices skinIndices] and [page:Geometry.skinWeights skinWeights] should be set to true on the geometry.<br />
[page:Material material] - (optional) an instance of [page:Material]. Default is a new [page:MeshBasicMaterial] .<br />
[page:boolean useVertexTexture] - (optional) defines whether a vertex texture can be used. Default is true.
</div>
<h2>Properties</h2>
<div>See the base [page:Mesh] class for common properties.</div>
<h3>[property:array bones]</h3>
<h3>[property:string bindMode]</h3>
<div>
This contains the array of bones for this mesh. These should be set in the constructor.
Either "attached" or "detached". "attached" uses the [page:SkinnedMesh.matrixWorld]
property for the base transform matrix of the bones. "detached" uses the
[page:SkinnedMesh.bindMatrix]. Default is "attached".
</div>
<h3>[property:Matrix4 identityMatrix]</h3>
<h3>[property:Matrix4 bindMatrix]</h3>
<div>
This is an identityMatrix to calculate the bones matrices from.
The base matrix that is used for the bound bone transforms.
</div>
<h3>[property:boolean useVertexTexture]</h3>
<h3>[property:Matrix4 bindMatrixInverse]</h3>
<div>
The boolean defines whether a vertex texture is used to calculate the bones. This boolean shouldn't be changed after constructor.
The base matrix that is used for resetting the bound bone transforms.
</div>
<h3>[property:array boneMatrices]</h3>
<h3>[property:array bones]</h3>
<div>
This array of matrices contains the matrices of the bones. These get calculated in the constructor.
This contains the array of [page:Bone bones] for this mesh. These should be set in
the constructor.
</div>
<h3>[property:string bindMode]</h3>
<h3>[property:Boolean isSkinnedMesh]</h3>
<div>
Either "attached" or "detached". "attached" uses the [page:SkinnedMesh.matrixWorld] property for the base transform
matrix of the bones. "detached" uses the [page:SkinnedMesh.bindMatrix].
</div>
<h3>[property:Matrix4 bindMatrix]</h3>
<div>
The base matrix that is used for the bound bone transforms.
Used to check whether this or derived classes are skinned meshes. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
</div>
<h3>[property:Matrix4 inverseBindMatrix]</h3>
<h3>[property:Skeleton skeleton]</h3>
<div>
The inverse of the bindMatrix.
[page:Skeleton] created from the [page:Geometry.bones bones] of the [page:Geometry] passed in the
constructor.
</div>
<h2>Methods</h2>
<div>See the base [page:Mesh] class for common methods.</div>
<h3>[method:null bind]( [page:Skeleton skeleton], [page:Matrix4 bindMatrix] )</h3>
<div>
skeleton — [page:Skeleton]<br/>
bindMatrix — [page:Matrix4] that represents the base transform of the skeleton
[page:Skeleton skeleton] - [page:Skeleton] created from a [page:Bone Bones] tree.<br/>
[page:Matrix4 bindMatrix] - [page:Matrix4] that represents the base transform of the skeleton.<br /><br />
Bind a skeleton to the skinned mesh. The bindMatrix gets saved to .bindMatrix property
and the .bindMatrixInverse gets calculated. This is called automatically in the constructor, and the skeleton
is created from the [page:Geometry.bones bones] of the [page:Geometry] passed in the
constructor.
</div>
<h3>[method:SkinnedMesh clone]()</h3>
<div>
Bind a skeleton to the skinned mesh. The bindMatrix gets saved to .bindMatrix property and the .bindMatrixInverse
gets calculated.
Returns a clone of this SkinnedMesh object and any descendants.
</div>
<h3>[method:null normalizeSkinWeights]()</h3>
<div>
Normalizes the [page:Geometry.skinWeights] vectors. Does not affect [page:BufferGeometry].
......@@ -131,21 +145,15 @@
<h3>[method:null pose]()</h3>
<div>
This method sets the skinned mesh in the rest pose.
This method sets the skinned mesh in the rest pose (resets the pose).
</div>
<h3>[method:Bone addBone]( [page:Bone bone] )</h3>
<div>
bone — This is the bone that needs to be added. (optional)
</div>
<h3>[method:null updateMatrixWorld]( [page:Boolean force] )</h3>
<div>
This method adds the bone to the skinned mesh when it is provided. It creates a new bone and adds that when no bone is given.
Updates the [page:Matrix4 MatrixWorld].
</div>
<h3>[method:SkinnedMesh clone]()</h3>
<div>
Returns a clone of this SkinnedMesh object and its descendants.
</div>
<h2>Source</h2>
......
......@@ -12,42 +12,63 @@
<h1>[name]</h1>
<div class="desc">A sprite is a plane in an 3d scene which faces always towards the camera.<br /><br />Sprites do not cast shadows, setting <code>castShadow = true</code> will have no effect.</div>
<h2>Example</h2>
<div class="desc">
A sprite is a plane that always faces towards the camera, generally with a
partially transparent texture applied.<br /><br />
<code>
var map = new THREE.TextureLoader().load( "sprite.png" );
var material = new THREE.SpriteMaterial( { map: map, color: 0xffffff, fog: true } );
var sprite = new THREE.Sprite( material );
scene.add( sprite );
</code>
Sprites do not cast shadows, setting <code>castShadow = true</code> will have no effect.
</div>
<h2>Example</h2>
<code>
var spriteMap = new THREE.TextureLoader().load( "sprite.png" );
var spriteMaterial = new THREE.SpriteMaterial( { map: spriteMap, color: 0xffffff } );
var sprite = new THREE.Sprite( spriteMaterial );
scene.add( sprite );
</code>
<h2>Constructor</h2>
<h3>[name]( [page:Material material] )</h3>
<div>
material — An instance of [page:Material] (optional).
</div>
<div>
This creates a new sprite with an specific material.
[page:Material material] - (optional) an instance of [page:SpriteMaterial]. Default is a white [page:SpriteMaterial].<br /><br />
Creates a new [name].
</div>
<h2>Properties</h2>
<div>See the base [page:Object3D] class for common properties.</div>
<h3>[property:Boolean isSprite]</h3>
<div>
Used to check whether this or derived classes are sprites. Default is *true*.<br /><br />
You should not change this, as it used internally for optimisation.
</div>
<h3>[property:SpriteMaterial material]</h3>
<div>
An instance of [page:Material], defining the object's appearance. Default is a [page:SpriteMaterial] which is a white plane.
An instance of [page:SpriteMaterial], defining the object's appearance.
Default is a white [page:SpriteMaterial].
</div>
<h2>Methods</h2>
<div>See the base [page:Object3D] class for common methods.</div>
<h3>[method:Sprite clone]()</h3>
<div>
Returns a clone of this Sprite object and its descendants.
Returns a clone of this Sprite object and any descendants.
</div>
<h3>[method:Array raycast]( [page:Raycaster raycaster], [page:Array intersects] )</h3>
<div>
Get intersections between a casted ray and this sprite.
[page:Raycaster.intersectObject] will call this method.
</div>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册