Browse Source

Merge pull request #5491 from TatumCreative/docs-curves2

Completed curve docs
Mr.doob 10 years ago
parent
commit
7d6e500d0d

+ 4 - 1
docs/api/extras/core/Curve.html

@@ -10,7 +10,10 @@
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
 		<div class="desc">An extensible curve object which contains methods for interpolation.</div>
 		<div class="desc">An extensible curve object which contains methods for interpolation.</div>
-
+		
+		<h2>Examples</h2>
+		
+		<h3>[example:webgl_geometry_extrude_splines geometry / extrude / splines ]
 
 
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 

+ 13 - 10
docs/api/extras/curves/ClosedSplineCurve3.html

@@ -17,24 +17,27 @@
 
 
 <code>
 <code>
 //Create a closed wavey loop
 //Create a closed wavey loop
-var curve = new THREE.ClosedSplineCurve3([
-	new THREE.Vector3(-10, 0, 10),
-	new THREE.Vector3(-5,  5, 5),
-	new THREE.Vector3( 0,  0, 0),
-	new THREE.Vector3( 5, -5, 5),
-	new THREE.Vector3(10,  0, 10)
-]);
+var curve = new THREE.ClosedSplineCurve3( [
+	new THREE.Vector3( -10, 0, 10 ),
+	new THREE.Vector3( -5, 5, 5 ),
+	new THREE.Vector3( 0, 0, 0 ),
+	new THREE.Vector3( 5, -5, 5 ),
+	new THREE.Vector3( 10, 0, 10 )
+] );
 
 
 var geometry = new THREE.Geometry();
 var geometry = new THREE.Geometry();
-geometry.vertices = curve.getPoints(50);
+geometry.vertices = curve.getPoints( 50 );
 
 
-var material = new THREE.LineBasicMaterial( { color: 0xff0000 } );
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 </code>
 </code>
 
 
+		<h3>[example:webgl_geometry_extrude_splines geometry / extrude / splines] (choose SampleClosedSpline)</h3>
+			
+
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>[name]([page:Array points])</h3>
+		<h3>[name]( [page:Array points] )</h3>
 		<div>points – An array of [page:Vector3] points</div>
 		<div>points – An array of [page:Vector3] points</div>
 
 
 
 

+ 34 - 15
docs/api/extras/curves/CubicBezierCurve.html

@@ -11,35 +11,54 @@
 		
 		
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
+		<div class="desc">
+			Create a smooth 2d <a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:Bezier_curve.svg" target="_blank">cubic bezier curve</a>.
+		</div>
 
 
 		<h2>Example</h2>
 		<h2>Example</h2>
 
 
-		<code>todo</code>
+<code>
+var curve = new THREE.CubicBezierCurve(
+	new THREE.Vector3( -10, 0, 0 ),
+	new THREE.Vector3( -5, 15, 0 ),
+	new THREE.Vector3( 20, 15, 0 ),
+	new THREE.Vector3( 10, 0, 0 )
+);
 
 
-		<h2>Constructor</h2>
+var path = new THREE.Path( curve.getPoints( 50 ) );
 
 
+var geometry = path.createPointsGeometry( 50 );
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 
-		<h3>todo</h3>
-		<div></div>
+// Create the final Object3d to add to the scene
+var curveObject = new THREE.Line( geometry, material );
+</code>
 
 
+		<h2>Constructor</h2>
 
 
-		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
+		<h3>[name] ( [page:Vector2 v0], [page:Vector2 v1], [page:Vector2 v2], [page:Vector2 v3] )</h3>
 		<div>
 		<div>
-		todo
-		</div> 
+			[page:Vector2 v0] – The starting point<br/>
+			[page:Vector2 v1] – The first control point<br/>
+			[page:Vector2 v2] – The second control point<br/>
+			[page:Vector2 v3] – The ending point<br/>
+		</div>
+
+		<h2>Properties</h2>
+		
+		<h3>[property:Vector2 v0]</h3>
+		
+		<h3>[property:Vector2 v1]</h3>
+		
+		<h3>[property:Vector2 v2]</h3>
+		
+		<h3>[property:Vector2 v3]</h3>
 
 
 
 
 		<h2>Methods</h2>
 		<h2>Methods</h2>
 		
 		
-
-		<h3>todo</h3>
-		<div>todo</div>
-		<div>
-		todo
-		</div>
+		<h3>See [page:Curve] for inherited methods</h3>
 		
 		
 		<h2>Source</h2>
 		<h2>Source</h2>
 
 

+ 35 - 16
docs/api/extras/curves/CubicBezierCurve3.html

@@ -11,36 +11,55 @@
 		
 		
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
+		<div class="desc">
+			Create a smooth 3d <a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:Bezier_curve.svg" target="_blank">cubic bezier curve</a>.
+		</div>
 
 
 		<h2>Example</h2>
 		<h2>Example</h2>
 
 
-		<code>todo</code>
+<code>
+var curve = new THREE.CubicBezierCurve3(
+	new THREE.Vector3( -10, 0, 0 ),
+	new THREE.Vector3( -5, 15, 0 ),
+	new THREE.Vector3( 20, 15, 0 ),
+	new THREE.Vector3( 10, 0, 0 )
+);
 
 
-		<h2>Constructor</h2>
+var geometry = new THREE.Geometry();
+geometry.vertices = curve.getPoints( 50 );
 
 
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 
-		<h3>todo</h3>
-		<div></div>
+// Create the final Object3d to add to the scene
+var curveObject = new THREE.Line( geometry, material );
 
 
+</code>
 
 
-		<h2>Properties</h2>
+		<h2>Constructor</h2>
 
 
-		<h3>todo</h3>
-		<div>
-		todo
-		</div> 
 
 
+		<h3>[name]( [page:Vector3 v0], [page:Vector3 v1], [page:Vector3 v2], [page:Vector3 v3] )</h3>
+		<div>
+			[page:Vector3 v0] – The starting point<br/>
+			[page:Vector3 v1] – The first control point<br/>
+			[page:Vector3 v2] – The second control point<br/>
+			[page:Vector3 v3] – The ending point<br/>
+		</div>
 
 
-		<h2>Methods</h2>
+		<h2>Properties</h2>
+		
+		<h3>[property:Vector3 v0]</h3>
+		
+		<h3>[property:Vector3 v1]</h3>
+		
+		<h3>[property:Vector3 v2]</h3>
+		
+		<h3>[property:Vector3 v3]</h3>
 		
 		
 
 
-		<h3>todo</h3>
-		<div>todo</div>
-		<div>
-		todo
-		</div>
+		<h2>Methods</h2>
 		
 		
+		<h3>See [page:Curve] for inherited methods</h3>		
 		<h2>Source</h2>
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

+ 4 - 4
docs/api/extras/curves/EllipseCurve.html

@@ -23,18 +23,18 @@ var curve = new THREE.EllipseCurve(
 	false             // aClockwise
 	false             // aClockwise
 );
 );
 
 
-var path = new THREE.Path( curve.getPoints(50) );
+var path = new THREE.Path( curve.getPoints( 50 ) );
 var geometry = path.createPointsGeometry( 50 );
 var geometry = path.createPointsGeometry( 50 );
-var material = new THREE.LineBasicMaterial( { color: 0xff0000 } );
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 
-//Create the final Object3d to add to the scene
+// Create the final Object3d to add to the scene
 var ellipse = new THREE.Line( geometry, material );
 var ellipse = new THREE.Line( geometry, material );
 </code>
 </code>
 
 
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>[name]([page:Float aX], [page:Float aY], [page:Float xRadius], [page:Float yRadius], [page:Radians aStartAngle], [page:Radians aEndAngle], [page:Boolean aClockwise])</h3>
+		<h3>[name]( [page:Float aX], [page:Float aY], [page:Float xRadius], [page:Float yRadius], [page:Radians aStartAngle], [page:Radians aEndAngle], [page:Boolean aClockwise] )</h3>
 		<div>
 		<div>
 			aX – The X center of the ellipse<br/>
 			aX – The X center of the ellipse<br/>
 			aY – The Y center of the ellipse<br/>
 			aY – The Y center of the ellipse<br/>

+ 1 - 1
docs/api/extras/curves/LineCurve.html

@@ -16,7 +16,7 @@
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>[name]([page:Vector2 v1], [page:Vector2 v2])</h3>
+		<h3>[name]( [page:Vector2 v1], [page:Vector2 v2] )</h3>
 		<div>
 		<div>
 			v1 – The start point<br/>
 			v1 – The start point<br/>
 			v2 - The end point
 			v2 - The end point

+ 1 - 1
docs/api/extras/curves/LineCurve3.html

@@ -16,7 +16,7 @@
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>[name]([page:Vector3 v1], [page:Vector3 v2])</h3>
+		<h3>[name]( [page:Vector3 v1], [page:Vector3 v2] )</h3>
 		<div>
 		<div>
 			v1 – The start point<br/>
 			v1 – The start point<br/>
 			v2 - The end point
 			v2 - The end point

+ 32 - 14
docs/api/extras/curves/QuadraticBezierCurve.html

@@ -11,36 +11,54 @@
 		
 		
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
+		<div class="desc">
+			Create a smooth 2d <a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:B%C3%A9zier_2_big.gif" target="_blank">quadratic bezier curve</a>.
+		</div>
 
 
 		<h2>Example</h2>
 		<h2>Example</h2>
 
 
-		<code>todo</code>
+<code>
+var curve = new THREE.QuadraticBezierCurve(
+	new THREE.Vector3( -10, 0, 0 ),
+	new THREE.Vector3( 20, 15, 0 ),
+	new THREE.Vector3( 10, 0, 0 )
+);
+
+var path = new THREE.Path( curve.getPoints( 50 ) );
+
+var geometry = path.createPointsGeometry( 50 );
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+
+//Create the final Object3d to add to the scene
+var curveObject = new THREE.Line( geometry, material );
+</code>
 
 
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>todo</h3>
-		<div></div>
+		<h3>[name]( [page:Vector2 v0], [page:Vector2 v1], [page:Vector2 v2] )</h3>
+		<div>
+			[page:Vector2 v0] – The starting point<br/>
+			[page:Vector2 v1] – The middle control point<br/>
+			[page:Vector2 v2] – The ending point<br/>
+		</div>
 
 
 
 
 		<h2>Properties</h2>
 		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
-		<div>
-		todo
-		</div> 
+		
+		<h3>[property:Vector2 v0]</h3>
+		
+		<h3>[property:Vector2 v1]</h3>
+		
+		<h3>[property:Vector2 v2]</h3>
 
 
 
 
 		<h2>Methods</h2>
 		<h2>Methods</h2>
 		
 		
 
 
-		<h3>todo</h3>
-		<div>todo</div>
-		<div>
-		todo
-		</div>
-		
+		<h3>See [page:Curve] for inherited methods</h3>		
+
 		<h2>Source</h2>
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

+ 32 - 14
docs/api/extras/curves/QuadraticBezierCurve3.html

@@ -11,35 +11,53 @@
 		
 		
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
-		<div class="desc">todo</div>
+		<div class="desc">
+			Create a smooth 3d <a href="http://en.wikipedia.org/wiki/B%C3%A9zier_curve#mediaviewer/File:B%C3%A9zier_2_big.gif" target="_blank">quadratic bezier curve</a>.
+		</div>
 
 
 		<h2>Example</h2>
 		<h2>Example</h2>
 
 
-		<code>todo</code>
+<code>
+var curve = new THREE.QuadraticBezierCurve3(
+	new THREE.Vector3( -10, 0, 0 ),
+	new THREE.Vector3( 20, 15, 0 ),
+	new THREE.Vector3( 10, 0, 0 )
+);
 
 
-		<h2>Constructor</h2>
+var geometry = new THREE.Geometry();
+geometry.vertices = curve.getPoints( 50 );
 
 
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 
-		<h3>todo</h3>
-		<div></div>
+// Create the final Object3d to add to the scene
+var curveObject = new THREE.Line( geometry, material );
+</code>
 
 
+		<h2>Constructor</h2>
 
 
-		<h2>Properties</h2>
 
 
-		<h3>todo</h3>
+		<h3>[name]( [page:Vector3 v0], [page:Vector3 v1], [page:Vector3 v2] )</h3>
 		<div>
 		<div>
-		todo
-		</div> 
+			[page:Vector3 v0] – The starting point<br/>
+			[page:Vector3 v1] – The middle control point<br/>
+			[page:Vector3 v2] – The ending point<br/>
+		</div>
+
+
+
+		<h2>Properties</h2>
+		
+		<h3>[property:Vector3 v0]</h3>
+		
+		<h3>[property:Vector3 v1]</h3>
+		
+		<h3>[property:Vector3 v2]</h3>
 
 
 
 
 		<h2>Methods</h2>
 		<h2>Methods</h2>
 		
 		
 
 
-		<h3>todo</h3>
-		<div>todo</div>
-		<div>
-		todo
-		</div>
+		<h3>See [page:Curve] for inherited methods</h3>		
 		
 		
 		<h2>Source</h2>
 		<h2>Source</h2>
 
 

+ 13 - 12
docs/api/extras/curves/SplineCurve.html

@@ -16,27 +16,28 @@
 		<h2>Example</h2>
 		<h2>Example</h2>
 
 
 <code>
 <code>
-//Create a sine-like wave
-var curve = new THREE.SplineCurve([
-	new THREE.Vector2(-10, 0),
-	new THREE.Vector2(-5, 5),
-	new THREE.Vector2( 0, 0),
-	new THREE.Vector2( 5, -5),
-	new THREE.Vector2(10, 0)
-]);
+// Create a sine-like wave
+var curve = new THREE.SplineCurve( [
+	new THREE.Vector2( -10, 0 ),
+	new THREE.Vector2( -5, 5 ),
+	new THREE.Vector2( 0, 0 ),
+	new THREE.Vector2( 5, -5 ),
+	new THREE.Vector2( 10, 0 )
+] );
 
 
-var path = new THREE.Path( curve.getPoints(50) );
+var path = new THREE.Path( curve.getPoints( 50 ) );
 
 
 var geometry = path.createPointsGeometry( 50 );
 var geometry = path.createPointsGeometry( 50 );
-var material = new THREE.LineBasicMaterial( { color: 0xff0000 } );
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 
-var object3d = new THREE.Line( geometry, material );
+// Create the final Object3d to add to the scene
+var splineObject = new THREE.Line( geometry, material );
 </code>
 </code>
 
 
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>[name]([page:Array points])</h3>
+		<h3>[name]( [page:Array points] )</h3>
 		<div>points – An array of [page:Vector2] points</div>
 		<div>points – An array of [page:Vector2] points</div>
 
 
 
 

+ 16 - 10
docs/api/extras/curves/SplineCurve3.html

@@ -17,24 +17,30 @@
 
 
 <code>
 <code>
 //Create a closed bent a sine-like wave
 //Create a closed bent a sine-like wave
-var curve = new THREE.SplineCurve3([
-	new THREE.Vector3(-10, 0, 10),
-	new THREE.Vector3(-5,  5, 5),
-	new THREE.Vector3( 0,  0, 0),
-	new THREE.Vector3( 5, -5, 5),
-	new THREE.Vector3(10,  0, 10)
-]);
+var curve = new THREE.SplineCurve3( [
+	new THREE.Vector3( -10, 0, 10 ),
+	new THREE.Vector3( -5, 5, 5 ),
+	new THREE.Vector3( 0, 0, 0 ),
+	new THREE.Vector3( 5, -5, 5 ),
+	new THREE.Vector3( 10, 0, 10 )
+] );
 
 
 var geometry = new THREE.Geometry();
 var geometry = new THREE.Geometry();
-geometry.vertices = curve.getPoints(50);
+geometry.vertices = curve.getPoints( 50 );
 
 
-var material = new THREE.LineBasicMaterial( { color: 0xff0000 } );
+var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+
+//Create the final Object3d to add to the scene
+var splineObject = new THREE.Line( geometry, material );
 </code>
 </code>
 
 
+		<h3>[example:webgl_geometry_extrude_splines geometry / extrude / splines ] (choose PipeSpline)</h3>
+
+
 		<h2>Constructor</h2>
 		<h2>Constructor</h2>
 
 
 
 
-		<h3>[name]([page:Array points])</h3>
+		<h3>[name]( [page:Array points] )</h3>
 		<div>points – An array of [page:Vector3] points</div>
 		<div>points – An array of [page:Vector3] points</div>