Home Explore Help
Sign In
javascript
/
three.js
mirror of https://github.com/tazdij/three.js.git
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

Merge pull request #5903 from caseygrun/helpers-docs

Helpers docs
Mr.doob 10 years ago
parent
f297b807af bc8b1ecde9
commit
cd6880939e
12 changed files with 171 additions and 74 deletions
Split View Show Diff Stats
  1. 1 1
      docs/api/extras/helpers/ArrowHelper.html
  2. 1 1
      docs/api/extras/helpers/BoundingBoxHelper.html
  3. 45 0
      docs/api/extras/helpers/BoxHelper.html
  4. 8 8
      docs/api/extras/helpers/DirectionalLightHelper.html
  5. 21 15
      docs/api/extras/helpers/EdgesHelper.html
  6. 23 11
      docs/api/extras/helpers/FaceNormalsHelper.html
  7. 1 0
      docs/api/extras/helpers/GridHelper.html
  8. 1 0
      docs/api/extras/helpers/PointLightHelper.html
  9. 23 11
      docs/api/extras/helpers/VertexNormalsHelper.html
  10. 22 12
      docs/api/extras/helpers/VertexTangentsHelper.html
  11. 24 15
      docs/api/extras/helpers/WireframeHelper.html
  12. 1 0
      docs/list.js

+ 1 - 1
docs/api/extras/helpers/ArrowHelper.html
View File 

@@ -80,7 +80,7 @@
 
 		Sets the length of the arrowhelper.
 
 		</div>
 
 
-		<h3>[method:null setDirection]([page:vector3 dir])</h3>
 
+		<h3>[method:null setDirection]([page:Vector3 dir])</h3>
 
 		<div>
 
 		dir -- The desired direction in euler format.
 
 		</div>

+ 1 - 1
docs/api/extras/helpers/BoundingBoxHelper.html
View File 

@@ -26,7 +26,7 @@
 
 		bbox.update();
 
 		scene.add( bbox );
 
 		</code>
 
-
 
+		<div>Note that this helper will create a wireframe [page:Mesh] object with a [page:BoxGeometry]; the resulting bounding box object will therefore have face diagonals. You may want to use [page:BoxHelper], which generates a [page:Line] object without face diagonals.</div>
 
 
 
 		<h2>Constructor</h2>

+ 45 - 0
docs/api/extras/helpers/BoxHelper.html
View File 

@@ -0,0 +1,45 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+	<head>
 
+		<meta charset="utf-8" />
 
+		<script src="../../../list.js"></script>
 
+		<script src="../../../page.js"></script>
 
+		<link type="text/css" rel="stylesheet" href="../../../page.css" />
 
+	</head>
 
+	<body>
 
+		[page:Line] &rarr;
 
+		
+		<h1>[name]</h1>
 
+
 
+		<div class="desc">Helper object to show a wireframe box (with no face diagonals) around an object</div>
 
+
 
+
 
+		<h2>Example</h2>
 
+
 
+		<code>var sphere = new THREE.SphereGeometry();
 
+		var object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial(0xff0000) );
 
+		var box = new THREE.BoxHelper( object );
 
+		scene.add( box );
 
+		</code>
 
+
 
+
 
+		<h2>Constructor</h2>
 
+
 
+		<h3>[name]( [page:Object3D object] )</h3>
 
+		<div>Creates a new wireframe box matching the size of the passed box.</div>
 
+
 
+		<h2>Properties</h2>
 
+
 
+		<div>(none)</div>
 
+
 
+		<h2>Methods</h2>
 
+
 
+		<h3>[method:null update]( [page:Object3D object] )</h3>
 
+		<div>
 
+		Updates the helper's geometry to match the dimensions of the [page:Geometry.boundingBox bounding box] of the passed object's geometry.
 
+
 
+		<h2>Source</h2>
 
+
 
+		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
 
+	</body>
 
+</html>

+ 8 - 8
docs/api/extras/helpers/DirectionalLightHelper.html
View File 

@@ -11,26 +11,26 @@
 
 		
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
 
+		<div class="desc">Visualize a [page:DirectionalLight]'s effect on the scene</div>
 
 
 
 		<h2>Constructor</h2>
 
 
 
-		<h3>[name]([page:todo light], [page:todo sphereSize])</h3>
 
+		<h3>[name]([DirectionalLight:todo light], [page:Number size])</h3>
 
 		<div>
 
-		light -- todo <br />
 
-		sphereSize -- todo
 
+		light -- [page:DirectionalLight] -- Light to visualize <br />
 
+		size -- dimensions of the plane
 
 		</div>
 
 		<div>
 
-		todo
 
+		Creates a line and plane to visualize the light's position and direction
 
 		</div>
 
 
 
 		<h2>Properties</h2>
 
 		
 
-		<h3>[property:Mesh lightSphere]</h3>
 
+		<h3>[property:Line lightPlane]</h3>
 
 		<div>
 
 		todo
 
 		</div> 
@@ -48,9 +48,9 @@
 
 		<h2>Methods</h2>
 
 
 
-		<h3>.update() [page:todo]</h3>
 
+		<h3>.[method:null update]()</h3>
 
 		<div>
 
-		todo
 
+		Updates the helper to match the position and direction of the [page:.light].
 
 		</div>
 
 
 		<h2>Source</h2>

+ 21 - 15
docs/api/extras/helpers/EdgesHelper.html
View File 

@@ -11,36 +11,42 @@
 
 		
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
 
+		<div class="desc">Creates a wireframe object that shows the "hard" edges of another object's geometry. To draw a full wireframe image of an object, see [page:WireframeHelper].</div>
 
 
 		<h2>Example</h2>
 
 
-		<code>todo</code>
 
+		<code>
 
+		geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
 
+		material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
 
+		object = new THREE.Mesh( geometry, material );
 
 
-		<h2>Constructor</h2>
 
+		edges = new THREE.EdgesHelper( object, 0x00ff00 );
 
 
+		scene.add( object );
 
+		scene.add( edges );
 
+		</code>
 
 
-		<h3>todo</h3>
 
-		<div></div>
 
+		<h2>Constructor</h2>
 
+		<h3>[name]( [page:Object3D object], [page:Color color] )</h3>
 
+		<div>
 
+		object -- Object of which to draw edges <br />
 
+		color -- Color of the edges.
 
+		</div>
 
+		<div>
 
+		Creates a [page:Line], showing only the "hard" edges of the passed object; specifically, no edge will be drawn between faces which are adjacent and coplanar (or nearly coplanar).
 
+		</div>
 
 
 
 		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
 
-		<div>
 
-		todo
 
-		</div> 
+		<div>none</div>
 
 
 
 		<h2>Methods</h2>
 
 		
-
 
-		<h3>todo</h3>
 
-		<div>todo</div>
 
-		<div>
 
-		todo
 
-		</div>
 
+		<div>none</div>
 
 		
+
 
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

+ 23 - 11
docs/api/extras/helpers/FaceNormalsHelper.html
View File 

@@ -11,35 +11,47 @@
 
 		
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
 
+		<div class="desc">Renders [page:ArrowHelper arrows] to visualize an object's [page:Face3 face] normals. Requires that the object's geometry be an instance of [page:Geometry] (does not work with [page:BufferGeometry]), and that face normals have been specified on all [page:Face3 faces] or calculated with [page:Geometry.computeFaceNormals computeFaceNormals].</div>
 
 
 		<h2>Example</h2>
 
 
-		<code>todo</code>
 
+		<code>
 
+		geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
 
+		material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
 
+		object = new THREE.Mesh( geometry, material );
 
+
 
+		edges = new THREE.FaceNormalsHelper( object, 2, 0x00ff00, 1 );
 
+
 
+		scene.add( object );
 
+		scene.add( edges );
 
+		</code>
 
+		[example:webgl_helpers Example using various helpers]
 
 
 		<h2>Constructor</h2>
 
 
 
-		<h3>todo</h3>
 
-		<div></div>
 
+		<h3>[name]( [page:Object3D object], [page:Number size], [page:Color color], [page:Number linewidth] )</h3>
 
+		<div>object -- object for which to render face normals
 
+		size -- size (length) of the arrows
 
+		color -- color of the arrows
 
+		linewidth -- width of the arrow lines
 
+		</div>
 
 
 
 		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
 
+		<h3>[property:Object3D object]</h3>
 
 		<div>
 
-		todo
 
+		The attached object
 
 		</div> 
 
 
 		<h2>Methods</h2>
 
 		
 
-		<h3>todo</h3>
 
-		<div>todo</div>
 
-		<div>
 
-		todo
 
-		</div>
 
+		<h3>[method:null update]()</h3>
 
+		<div>Updates the face normal preview based on movement of the object.</div>
 
+
 
 		
 		<h2>Source</h2>

+ 1 - 0
docs/api/extras/helpers/GridHelper.html
View File 

@@ -22,6 +22,7 @@
 
 		var gridHelper = new THREE.GridHelper( size, step );		
 		scene.add( gridHelper );
 
 		</code>
 
+		[example:webgl_helpers Example using various helpers]
 
 
 
 		<h2>Constructor</h2>

+ 1 - 0
docs/api/extras/helpers/PointLightHelper.html
View File 

@@ -24,6 +24,7 @@
 
 		var pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
 
 		scene.add( pointLightHelper );
 
 		</code>
 
+		[example:webgl_helpers Example using various helpers]
 
 
 
 		<h2>Constructor</h2>

+ 23 - 11
docs/api/extras/helpers/VertexNormalsHelper.html
View File 

@@ -11,35 +11,47 @@
 
 		
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
 
+		<div class="desc">Renders [page:ArrowHelper arrows] to visualize an object's vertex normal vectors. Requires that normals have been specified in a [page:BufferAttribute custom attribute] or have been calculated using [page:Geometry.computeVertexNormals computeVertexNormals]. </div>
 
 
 		<h2>Example</h2>
 
 
-		<code>todo</code>
 
+		<code>
 
+		geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
 
+		material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
 
+		object = new THREE.Mesh( geometry, material );
 
+
 
+		edges = new THREE.VertexNormalsHelper( object, 2, 0x00ff00, 1 );
 
+
 
+		scene.add( object );
 
+		scene.add( edges );
 
+		</code>
 
+		[example:webgl_helpers Example using various helpers]
 
 
 		<h2>Constructor</h2>
 
 
 
-		<h3>todo</h3>
 
-		<div></div>
 
+		<h3>[name]( [page:Object3D object], [page:Number size], [page:Color color], [page:Number linewidth] )</h3>
 
+		<div>object -- object for which to render vertex normals
 
+		size -- size (length) of the arrows
 
+		color -- color of the arrows
 
+		linewidth -- width of the arrow lines
 
+		</div>
 
 
 
 		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
 
+		<h3>[property:Object3D object]</h3>
 
 		<div>
 
-		todo
 
+		The attached object
 
 		</div> 
 
 
 		<h2>Methods</h2>
 
 		
 
-		<h3>todo</h3>
 
-		<div>todo</div>
 
-		<div>
 
-		todo
 
-		</div>
 
+		<h3>[method:null update]()</h3>
 
+		<div>Updates the vertex normal preview based on movement of the object.</div>
 
+
 
 		
 		<h2>Source</h2>

+ 22 - 12
docs/api/extras/helpers/VertexTangentsHelper.html
View File 

@@ -11,36 +11,46 @@
 
 		
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
 
+		<div class="desc">Renders [page:ArrowHelper arrows] to visualize an object's vertex tangent vectors. Requires that tangents have been specified in a [page:BufferAttribute custom attribute] or have been computed using [page:Geometry.computeTangents computeTangents]. </div>
 
 
 		<h2>Example</h2>
 
 
-		<code>todo</code>
 
+		<code>
 
+		geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
 
+		material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
 
+		object = new THREE.Mesh( geometry, material );
 
+
 
+		edges = new THREE.VertexTangentsHelper( object, 2, 0x00ff00, 1 );
 
+
 
+		scene.add( object );
 
+		scene.add( edges );
 
+		</code>
 
 
 		<h2>Constructor</h2>
 
 
 
-		<h3>todo</h3>
 
-		<div></div>
 
+		<h3>[name]( [page:Object3D object], [page:Number size], [page:Color color], [page:Number linewidth] )</h3>
 
+		<div>object -- object for which to render vertex tangents
 
+		size -- size (length) of the arrows
 
+		color -- color of the arrows
 
+		linewidth -- width of the arrow lines
 
+		</div>
 
 
 
 		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
 
+		<h3>[property:Object3D object]</h3>
 
 		<div>
 
-		todo
 
+		The attached object
 
 		</div> 
 
 
 		<h2>Methods</h2>
 
 		
 
-		<h3>todo</h3>
 
-		<div>todo</div>
 
-		<div>
 
-		todo
 
-		</div>
 
-		
+		<h3>[method:null update]()</h3>
 
+		<div>Updates the vertex tangent preview arrows based on the new position and tangents of the object.</div>
 
+
 
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

+ 24 - 15
docs/api/extras/helpers/WireframeHelper.html
View File 

@@ -11,36 +11,45 @@
 
 		
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
 
+		<div class="desc">Creates a wireframe object that shows the edges of another object's geometry. To draw a  wireframe image showing only "hard" edges (edges between non-coplanar faces), see [page:EdgesHelper].</div>
 
 
 		<h2>Example</h2>
 
 
-		<code>todo</code>
 
+		<code>
 
+		geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
 
+		material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
 
+		object = new THREE.Mesh( geometry, material );
 
 
-		<h2>Constructor</h2>
 
+		wireframe = new THREE.WireframeHelper( object, 0x00ff00 );
 
+
 
+		scene.add( object );
 
+		scene.add( wireframe );
 
 
+		</code>
 
+		[example:webgl_helpers Example using various helpers], [example:webgl_materials_wireframe Alternative approach using a shader.]
 
 
-		<h3>todo</h3>
 
-		<div></div>
 
+		<h2>Constructor</h2>
 
+		<h3>[name]( [page:Object3D object], [page:Color color] )</h3>
 
+		<div>
 
+		object -- Object of which to draw edges <br />
 
+		color -- Color of the edges.
 
+		</div>
 
+		<div>
 
+		Creates a [page:Line], showing only the edges between vertices of an object.
 
+		</div>
 
 
 
 		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
 
-		<div>
 
-		todo
 
-		</div> 
+		<div>none</div>
 
 
 
 		<h2>Methods</h2>
 
 		
-
 
-		<h3>todo</h3>
 
-		<div>todo</div>
 
-		<div>
 
-		todo
 
-		</div>
 
+		<div>none</div>
 
 		
+
 
+		<h2>Source</h2>
 
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

+ 1 - 0
docs/list.js
View File 

@@ -219,6 +219,7 @@ var list = {
 
 			[ "ArrowHelper", "api/extras/helpers/ArrowHelper" ],
 
 			[ "AxisHelper", "api/extras/helpers/AxisHelper" ],
 
 			[ "BoundingBoxHelper", "api/extras/helpers/BoundingBoxHelper" ],
 
+			[ "BoxHelper", "api/extras/helpers/BoxHelper" ],
 
 			[ "CameraHelper", "api/extras/helpers/CameraHelper" ],
 
 			[ "DirectionalLightHelper", "api/extras/helpers/DirectionalLightHelper" ],
 
 			[ "EdgesHelper", "api/extras/helpers/EdgesHelper" ],