Michael Herzog 1 год назад
Родитель
Сommit
ef73c54282

+ 1 - 1
docs/examples/en/geometries/ParametricGeometry.html

@@ -29,7 +29,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		const geometry = new THREE.ParametricGeometry( THREE.ParametricGeometries.klein, 25, 25 );
+		const geometry = new THREE.ParametricGeometry( klein, 25, 25 );
 		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
 		const klein = new THREE.Mesh( geometry, material );
 		scene.add( klein );

+ 1 - 1
docs/examples/zh/geometries/ParametricGeometry.html

@@ -27,7 +27,7 @@
 		<h2>代码示例</h2>
 
 		<code>
-		const geometry = new THREE.ParametricGeometry( THREE.ParametricGeometries.klein, 25, 25 );
+		const geometry = new THREE.ParametricGeometry( klein, 25, 25 );
 		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
 		const klein = new THREE.Mesh( geometry, material );
 		scene.add( klein );

+ 1 - 1
examples/jsm/Addons.js

@@ -46,7 +46,7 @@ export * from './exporters/USDZExporter.js';
 export * from './geometries/BoxLineGeometry.js';
 export * from './geometries/ConvexGeometry.js';
 export * from './geometries/DecalGeometry.js';
-export * from './geometries/ParametricGeometries.js';
+export * from './geometries/ParametricFunctions.js';
 export * from './geometries/ParametricGeometry.js';
 export * from './geometries/RoundedBoxGeometry.js';
 export * from './geometries/TeapotGeometry.js';

+ 22 - 0
examples/jsm/geometries/BoxLineGeometry.js

@@ -3,8 +3,30 @@ import {
 	Float32BufferAttribute
 } from 'three';
 
+/**
+ * A special type of box geometry intended for {@link LineSegments}.
+ *
+ * ```js
+ * const geometry = new THREE.BoxLineGeometry();
+ * const material = new THREE.LineBasicMaterial( { color: 0x00ff00 } );
+ * const lines = new THREE.LineSegments( geometry, material );
+ * scene.add( lines );
+ * ```
+ *
+ * @augments BufferGeometry
+ */
 class BoxLineGeometry extends BufferGeometry {
 
+	/**
+	 * Constructs a new box line geometry.
+	 *
+	 * @param {number} [width=1] - The width. That is, the length of the edges parallel to the X axis.
+	 * @param {number} [height=1] - The height. That is, the length of the edges parallel to the Y axis.
+	 * @param {number} [depth=1] - The depth. That is, the length of the edges parallel to the Z axis.
+	 * @param {number} [widthSegments=1] - Number of segmented rectangular sections along the width of the sides.
+	 * @param {number} [heightSegments=1] - Number of segmented rectangular sections along the height of the sides.
+	 * @param {number} [depthSegments=1] - Number of segmented rectangular sections along the depth of the sides.
+	 */
 	constructor( width = 1, height = 1, depth = 1, widthSegments = 1, heightSegments = 1, depthSegments = 1 ) {
 
 		super();

+ 18 - 0
examples/jsm/geometries/ConvexGeometry.js

@@ -4,8 +4,26 @@ import {
 } from 'three';
 import { ConvexHull } from '../math/ConvexHull.js';
 
+/**
+ * This class can be used to generate a convex hull for a given array of 3D points.
+ * The average time complexity for this task is considered to be O(nlog(n)).
+ *
+ * ```js
+ * const geometry = new ConvexGeometry( points );
+ * const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+ * const mesh = new THREE.Mesh( geometry, material );
+ * scene.add( mesh );
+ * ```
+ *
+ * @augments BufferGeometry
+ */
 class ConvexGeometry extends BufferGeometry {
 
+	/**
+	 * Constructs a new convex geometry.
+	 *
+	 * @param {Array<Vector3>} points - An array of points in 3D space which should be enclosed by the convex hull.
+	 */
 	constructor( points = [] ) {
 
 		super();

+ 20 - 9
examples/jsm/geometries/DecalGeometry.js

@@ -9,22 +9,33 @@ import {
 } from 'three';
 
 /**
- * You can use this geometry to create a decal mesh, that serves different kinds of purposes.
- * e.g. adding unique details to models, performing dynamic visual environmental changes or covering seams.
+ * This class can be used to create a decal mesh that serves different kinds of purposes e.g.
+ * adding unique details to models, performing dynamic visual environmental changes or covering seams.
  *
- * Constructor parameter:
+ * Please not that decal projections can be distored when used around corners. More information at
+ * this GitHub issue: [Decal projections without distortions]{@link https://github.com/mrdoob/three.js/issues/21187}.
  *
- * mesh — Any mesh object
- * position — Position of the decal projector
- * orientation — Orientation of the decal projector
- * size — Size of the decal projector
+ * Reference: [How to project decals]{@link http://blog.wolfire.com/2009/06/how-to-project-decals/}
  *
- * reference: http://blog.wolfire.com/2009/06/how-to-project-decals/
+ * ```js
+ * const geometry = new DecalGeometry( mesh, position, orientation, size );
+ * const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+ * const mesh = new THREE.Mesh( geometry, material );
+ * scene.add( mesh );
+ * ```
  *
+ * @augments BufferGeometry
  */
-
 class DecalGeometry extends BufferGeometry {
 
+	/**
+	 * Constructs a new decal geometry.
+	 *
+	 * @param {Mesh} [mesh] - The base mesh the decal should be projected on.
+	 * @param {Vector3} [position] - The position of the decal projector.
+	 * @param {Euler} [orientation] - The orientation of the decal projector.
+	 * @param {Vector3} [size] - Tje scale of the decal projector.
+	 */
 	constructor( mesh = new Mesh(), position = new Vector3(), orientation = new Euler(), size = new Vector3( 1, 1, 1 ) ) {
 
 		super();

+ 97 - 0
examples/jsm/geometries/ParametricFunctions.js

@@ -0,0 +1,97 @@
+
+/** @module ParametricFunctions */
+
+/**
+ * A parametric function representing the Klein bottle.
+ *
+ * @param {number} v - The `v` coordinate on the surface in the range `[0,1]`.
+ * @param {number} u - The `u` coordinate on the surface in the range `[0,1]`.
+ * @param {Vector3} target - The target vector that is used to store the method's result.
+ */
+function klein( v, u, target ) {
+
+	u *= Math.PI;
+	v *= 2 * Math.PI;
+
+	u = u * 2;
+	let x, z;
+	if ( u < Math.PI ) {
+
+		x = 3 * Math.cos( u ) * ( 1 + Math.sin( u ) ) + ( 2 * ( 1 - Math.cos( u ) / 2 ) ) * Math.cos( u ) * Math.cos( v );
+		z = - 8 * Math.sin( u ) - 2 * ( 1 - Math.cos( u ) / 2 ) * Math.sin( u ) * Math.cos( v );
+
+	} else {
+
+		x = 3 * Math.cos( u ) * ( 1 + Math.sin( u ) ) + ( 2 * ( 1 - Math.cos( u ) / 2 ) ) * Math.cos( v + Math.PI );
+		z = - 8 * Math.sin( u );
+
+	}
+
+	const y = - 2 * ( 1 - Math.cos( u ) / 2 ) * Math.sin( v );
+
+	target.set( x, y, z );
+
+}
+
+/**
+ * A parametric function representing a flat plane.
+ *
+ * @param {number} u - The `u` coordinate on the surface in the range `[0,1]`.
+ * @param {number} v - The `v` coordinate on the surface in the range `[0,1]`.
+ * @param {Vector3} target - The target vector that is used to store the method's result.
+ */
+function plane( u, v, target ) {
+
+	target.set( u, 0, v );
+
+}
+
+/**
+ * A parametric function representing a flat mobius strip.
+ *
+ * @param {number} u - The `u` coordinate on the surface in the range `[0,1]`.
+ * @param {number} t - The `v` coordinate on the surface in the range `[0,1]`.
+ * @param {Vector3} target - The target vector that is used to store the method's result.
+ */
+function mobius( u, t, target ) {
+
+	// http://www.wolframalpha.com/input/?i=M%C3%B6bius+strip+parametric+equations&lk=1&a=ClashPrefs_*Surface.MoebiusStrip.SurfaceProperty.ParametricEquations-
+	u = u - 0.5;
+	const v = 2 * Math.PI * t;
+
+	const a = 2;
+
+	const x = Math.cos( v ) * ( a + u * Math.cos( v / 2 ) );
+	const y = Math.sin( v ) * ( a + u * Math.cos( v / 2 ) );
+	const z = u * Math.sin( v / 2 );
+
+	target.set( x, y, z );
+
+}
+
+/**
+ * A parametric function representing a volumetric mobius strip.
+ *
+ * @param {number} u - The `u` coordinate on the surface in the range `[0,1]`.
+ * @param {number} t - The `v` coordinate on the surface in the range `[0,1]`.
+ * @param {Vector3} target - The target vector that is used to store the method's result.
+ */
+function mobius3d( u, t, target ) {
+
+	u *= Math.PI;
+	t *= 2 * Math.PI;
+
+	u = u * 2;
+	const phi = u / 2;
+	const major = 2.25, a = 0.125, b = 0.65;
+
+	let x = a * Math.cos( t ) * Math.cos( phi ) - b * Math.sin( t ) * Math.sin( phi );
+	const z = a * Math.cos( t ) * Math.sin( phi ) + b * Math.sin( t ) * Math.cos( phi );
+	const y = ( major + x ) * Math.sin( u );
+	x = ( major + x ) * Math.cos( u );
+
+	target.set( x, y, z );
+
+}
+
+export { klein, plane, mobius, mobius3d };

+ 0 - 255
examples/jsm/geometries/ParametricGeometries.js

@@ -1,255 +0,0 @@
-import {
-	Curve,
-	Vector3
-} from 'three';
-
-import { ParametricGeometry } from './ParametricGeometry.js';
-
-
-/*********************************************
- *
- * Parametric Replacement for TubeGeometry
- *
- *********************************************/
-class ParametricTubeGeometry extends ParametricGeometry {
-
-	constructor( path, segments = 64, radius = 1, segmentsRadius = 8, closed = false ) {
-
-		const numpoints = segments + 1;
-
-		const frames = path.computeFrenetFrames( segments, closed ),
-			tangents = frames.tangents,
-			normals = frames.normals,
-			binormals = frames.binormals;
-
-		const position = new Vector3();
-
-		function ParametricTube( u, v, target ) {
-
-			v *= 2 * Math.PI;
-
-			const i = Math.floor( u * ( numpoints - 1 ) );
-
-			path.getPointAt( u, position );
-
-			const normal = normals[ i ];
-			const binormal = binormals[ i ];
-
-			const cx = - radius * Math.cos( v ); // TODO: Hack: Negating it so it faces outside.
-			const cy = radius * Math.sin( v );
-
-			position.x += cx * normal.x + cy * binormal.x;
-			position.y += cx * normal.y + cy * binormal.y;
-			position.z += cx * normal.z + cy * binormal.z;
-
-			target.copy( position );
-
-		}
-
-		super( ParametricTube, segments, segmentsRadius );
-
-		// proxy internals
-
-		this.tangents = tangents;
-		this.normals = normals;
-		this.binormals = binormals;
-
-		this.path = path;
-		this.segments = segments;
-		this.radius = radius;
-		this.segmentsRadius = segmentsRadius;
-		this.closed = closed;
-
-	}
-
-}
-
-
-/*********************************************
-  *
-  * Parametric Replacement for TorusKnotGeometry
-  *
-  *********************************************/
-class ParametricTorusKnotGeometry extends ParametricTubeGeometry {
-
-	constructor( radius = 200, tube = 40, segmentsT = 64, segmentsR = 8, p = 2, q = 3 ) {
-
-		class TorusKnotCurve extends Curve {
-
-			getPoint( t, optionalTarget = new Vector3() ) {
-
-				const point = optionalTarget;
-
-				t *= Math.PI * 2;
-
-				const r = 0.5;
-
-				const x = ( 1 + r * Math.cos( q * t ) ) * Math.cos( p * t );
-				const y = ( 1 + r * Math.cos( q * t ) ) * Math.sin( p * t );
-				const z = r * Math.sin( q * t );
-
-				return point.set( x, y, z ).multiplyScalar( radius );
-
-			}
-
-		}
-
-		const segments = segmentsT;
-		const radiusSegments = segmentsR;
-		const extrudePath = new TorusKnotCurve();
-
-		super( extrudePath, segments, tube, radiusSegments, true );
-
-		this.radius = radius;
-		this.tube = tube;
-		this.segmentsT = segmentsT;
-		this.segmentsR = segmentsR;
-		this.p = p;
-		this.q = q;
-
-	}
-
-}
-
-/*********************************************
-  *
-  * Parametric Replacement for SphereGeometry
-  *
-  *********************************************/
-class ParametricSphereGeometry extends ParametricGeometry {
-
-	constructor( size, u, v ) {
-
-		function sphere( u, v, target ) {
-
-			u *= Math.PI;
-			v *= 2 * Math.PI;
-
-			const x = size * Math.sin( u ) * Math.cos( v );
-			const y = size * Math.sin( u ) * Math.sin( v );
-			const z = size * Math.cos( u );
-
-			target.set( x, y, z );
-
-		}
-
-		super( sphere, u, v );
-
-	}
-
-}
-
-
-/*********************************************
-  *
-  * Parametric Replacement for PlaneGeometry
-  *
-  *********************************************/
-class ParametricPlaneGeometry extends ParametricGeometry {
-
-	constructor( width, depth, segmentsWidth, segmentsDepth ) {
-
-		function plane( u, v, target ) {
-
-			const x = u * width;
-			const y = 0;
-			const z = v * depth;
-
-			target.set( x, y, z );
-
-		}
-
-		super( plane, segmentsWidth, segmentsDepth );
-
-	}
-
-}
-
-/**
- * Experimenting of primitive geometry creation using Surface Parametric equations
- */
-
-const ParametricGeometries = {
-
-	klein: function ( v, u, target ) {
-
-		u *= Math.PI;
-		v *= 2 * Math.PI;
-
-		u = u * 2;
-		let x, z;
-		if ( u < Math.PI ) {
-
-			x = 3 * Math.cos( u ) * ( 1 + Math.sin( u ) ) + ( 2 * ( 1 - Math.cos( u ) / 2 ) ) * Math.cos( u ) * Math.cos( v );
-			z = - 8 * Math.sin( u ) - 2 * ( 1 - Math.cos( u ) / 2 ) * Math.sin( u ) * Math.cos( v );
-
-		} else {
-
-			x = 3 * Math.cos( u ) * ( 1 + Math.sin( u ) ) + ( 2 * ( 1 - Math.cos( u ) / 2 ) ) * Math.cos( v + Math.PI );
-			z = - 8 * Math.sin( u );
-
-		}
-
-		const y = - 2 * ( 1 - Math.cos( u ) / 2 ) * Math.sin( v );
-
-		target.set( x, y, z );
-
-	},
-
-	plane: function ( width, height ) {
-
-		return function ( u, v, target ) {
-
-			const x = u * width;
-			const y = 0;
-			const z = v * height;
-
-			target.set( x, y, z );
-
-		};
-
-	},
-
-	mobius: function ( u, t, target ) {
-
-		// flat mobius strip
-		// http://www.wolframalpha.com/input/?i=M%C3%B6bius+strip+parametric+equations&lk=1&a=ClashPrefs_*Surface.MoebiusStrip.SurfaceProperty.ParametricEquations-
-		u = u - 0.5;
-		const v = 2 * Math.PI * t;
-
-		const a = 2;
-
-		const x = Math.cos( v ) * ( a + u * Math.cos( v / 2 ) );
-		const y = Math.sin( v ) * ( a + u * Math.cos( v / 2 ) );
-		const z = u * Math.sin( v / 2 );
-
-		target.set( x, y, z );
-
-	},
-
-	mobius3d: function ( u, t, target ) {
-
-		// volumetric mobius strip
-
-		u *= Math.PI;
-		t *= 2 * Math.PI;
-
-		u = u * 2;
-		const phi = u / 2;
-		const major = 2.25, a = 0.125, b = 0.65;
-
-		let x = a * Math.cos( t ) * Math.cos( phi ) - b * Math.sin( t ) * Math.sin( phi );
-		const z = a * Math.cos( t ) * Math.sin( phi ) + b * Math.sin( t ) * Math.cos( phi );
-		const y = ( major + x ) * Math.sin( u );
-		x = ( major + x ) * Math.cos( u );
-
-		target.set( x, y, z );
-
-	},
-	PlaneGeometry: ParametricPlaneGeometry,
-	TorusKnotGeometry: ParametricTorusKnotGeometry,
-	TubeGeometry: ParametricTubeGeometry,
-	SphereGeometry: ParametricSphereGeometry
-};
-
-export { ParametricGeometries };

+ 37 - 5
examples/jsm/geometries/ParametricGeometry.js

@@ -1,22 +1,45 @@
-/**
- * Parametric Surfaces Geometry
- * based on the brilliant article by @prideout https://prideout.net/blog/old/blog/index.html@p=44.html
- */
-
 import {
 	BufferGeometry,
 	Float32BufferAttribute,
 	Vector3
 } from 'three';
 
+/**
+ * This class can be used to generate a geometry based on a paremtric surface.
+ *
+ * Reference: [Mesh Generation with Python]{@link https://prideout.net/blog/old/blog/index.html@p=44.html}
+ *
+ * ```js
+ * const geometry = new THREE.ParametricGeometry( klein, 25, 25 );
+ * const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+ * const klein = new THREE.Mesh( geometry, material );
+ * scene.add( klein );
+ * ```
+ *
+ * @augments BufferGeometry
+ */
 class ParametricGeometry extends BufferGeometry {
 
+	/**
+	 * Constructs a new parametric geometry.
+	 *
+	 * @param {ParametricGeometry~Func} func - The parametric function. Default is a function that generates a curved plane surface.
+	 * @param {number} [slices=8] - The number of slices to use for the parametric function.
+	 * @param {number} [stacks=8] - The stacks of slices to use for the parametric function.
+	 */
 	constructor( func = ( u, v, target ) => target.set( u, v, Math.cos( u ) * Math.sin( v ) ), slices = 8, stacks = 8 ) {
 
 		super();
 
 		this.type = 'ParametricGeometry';
 
+		/**
+		 * Holds the constructor parameters that have been
+		 * used to generate the geometry. Any modification
+		 * after instantiation does not change the geometry.
+		 *
+		 * @type {Object}
+		 */
 		this.parameters = {
 			func: func,
 			slices: slices,
@@ -136,4 +159,13 @@ class ParametricGeometry extends BufferGeometry {
 
 }
 
+/**
+ * Parametric function definition of `ParametricGeometry`.
+ *
+ * @callback ParametricGeometry~Func
+ * @param {number} u - The `u` coordinate on the surface in the range `[0,1]`.
+ * @param {number} v - The `v` coordinate on the surface in the range `[0,1]`.
+ * @param {Vector3} target - The target vector that is used to store the method's result.
+ */
+
 export { ParametricGeometry };

+ 21 - 0
examples/jsm/geometries/RoundedBoxGeometry.js

@@ -38,8 +38,29 @@ function getUv( faceDirVector, normal, uvAxis, projectionAxis, radius, sideLengt
 
 }
 
+/**
+ * A special type of box geometry with rounded corners and edges.
+ *
+ * ```js
+ * const geometry = new THREE.RoundedBoxGeometry();
+ * const material = new THREE.MeshStandardMaterial( { color: 0x00ff00 } );
+ * const cube = new THREE.Mesh( geometry, material );
+ * scene.add( cube );
+ * ```
+ *
+ * @augments BoxGeometry
+ */
 class RoundedBoxGeometry extends BoxGeometry {
 
+	/**
+	 * Constructs a new rounded box geometry.
+	 *
+	 * @param {number} [width=1] - The width. That is, the length of the edges parallel to the X axis.
+	 * @param {number} [height=1] - The height. That is, the length of the edges parallel to the Y axis.
+	 * @param {number} [depth=1] - The depth. That is, the length of the edges parallel to the Z axis.
+	 * @param {number} [segments=2] - Number of segmented that form the rounded corners.
+	 * @param {number} [radius=0.1] - The radius of the rounded corners.
+	 */
 	constructor( width = 1, height = 1, depth = 1, segments = 2, radius = 0.1 ) {
 
 		// ensure segments is odd so we have a plane connecting the rounded corners

+ 22 - 38
examples/jsm/geometries/TeapotGeometry.js

@@ -9,53 +9,37 @@ import {
 /**
  * Tessellates the famous Utah teapot database by Martin Newell into triangles.
  *
- * Parameters: size = 50, segments = 10, bottom = true, lid = true, body = true,
- *   fitLid = true, blinn = true
- *
- * size is a relative scale: I've scaled the teapot to fit vertically between -1 and 1.
- * Think of it as a "radius".
- * segments - number of line segments to subdivide each patch edge;
- *   1 is possible but gives degenerates, so two is the real minimum.
- * bottom - boolean, if true (default) then the bottom patches are added. Some consider
- *   adding the bottom heresy, so set this to "false" to adhere to the One True Way.
- * lid - to remove the lid and look inside, set to true.
- * body - to remove the body and leave the lid, set this and "bottom" to false.
- * fitLid - the lid is a tad small in the original. This stretches it a bit so you can't
- *   see the teapot's insides through the gap.
- * blinn - Jim Blinn scaled the original data vertically by dividing by about 1.3 to look
- *   nicer. If you want to see the original teapot, similar to the real-world model, set
- *   this to false. True by default.
- *   See http://en.wikipedia.org/wiki/File:Original_Utah_Teapot.jpg for the original
- *   real-world teapot (from http://en.wikipedia.org/wiki/Utah_teapot).
- *
- * Note that the bottom (the last four patches) is not flat - blame Frank Crow, not me.
- *
  * The teapot should normally be rendered as a double sided object, since for some
  * patches both sides can be seen, e.g., the gap around the lid and inside the spout.
  *
- * Segments 'n' determines the number of triangles output.
- *   Total triangles = 32*2*n*n - 8*n    [degenerates at the top and bottom cusps are deleted]
+ * Segments 'n' determines the number of triangles output. Total triangles = 32*2*n*n - 8*n
+ * (degenerates at the top and bottom cusps are deleted).
  *
- *   size_factor   # triangles
- *       1          56
- *       2         240
- *       3         552
- *       4         992
+ * Code based on [SPD software]{@link http://tog.acm.org/resources/SPD/}
+ * Created for the Udacity course [Interactive Rendering]{@link http://bit.ly/ericity}
  *
- *      10        6320
- *      20       25440
- *      30       57360
- *
- * Code converted from my ancient SPD software, http://tog.acm.org/resources/SPD/
- * Created for the Udacity course "Interactive Rendering", http://bit.ly/ericity
- * YouTube video on teapot history: https://www.youtube.com/watch?v=DxMfblPzFNc
- *
- * See https://en.wikipedia.org/wiki/Utah_teapot for the history of the teapot
+ * ```js
+ * const geometry = new TeapotGeometry( 50, 18 );
+ * const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+ * const teapot = new THREE.Mesh( geometry, material );
+ * scene.add( teapot );
+ * ```
  *
+ * @augments BufferGeometry
  */
-
 class TeapotGeometry extends BufferGeometry {
 
+	/**
+	 * Constructs a new teapot geometry.
+	 *
+	 * @param {number} [size=50] - Relative scale of the teapot.
+	 * @param {number} [segments=10] - Number of line segments to subdivide each patch edge.
+	 * @param {boolean} [bottom=true] - Whether the bottom of the teapot is generated or not.
+	 * @param {boolean} [lid=true] - Whether the lid is generated or not.
+	 * @param {boolean} [body=true] - Whether the body is generated or not.
+	 * @param {boolean} [fitLid=true] - Whether the lid is slightly stretched to prevent gaps between the body and lid or not.
+	 * @param {boolean} [blinn=true] -  Whether the teapot is scaled vertically for better aesthetics or not.
+	 */
 	constructor( size = 50, segments = 10, bottom = true, lid = true, body = true, fitLid = true, blinn = true ) {
 
 		// 32 * 4 * 4 Bezier spline patches

+ 44 - 16
examples/jsm/geometries/TextGeometry.js

@@ -1,26 +1,37 @@
+import {
+	ExtrudeGeometry
+} from 'three';
+
 /**
- * Text = 3D Text
+ * A class for generating text as a single geometry. It is constructed by providing a string of text, and a set of
+ * parameters consisting of a loaded font and extrude settings.
+ *
+ * See the {@link FontLoader} page for additional details.
  *
- * parameters = {
- *  font: <THREE.Font>, // font
+ * `TextGeometry` uses [typeface.json]{@link http://gero3.github.io/facetype.js/} generated fonts.
+ * Some existing fonts can be found located in `/examples/fonts`.
  *
- *  size: <float>, // size of the text
- *  depth: <float>, // thickness to extrude text
- *  curveSegments: <int>, // number of points on the curves
+ * ```js
+ * const loader = new FontLoader();
+ * const fonst = await loader.loadAsync( 'fonts/helvetiker_regular.typeface.json' );
+ * const geometry = new TextGeometry( 'Hello three.js!', {
+ * 	font: font,
+ * 	size: 80,
+ * 	depth: 5,
+ * 	curveSegments: 12
+ * } );
+ * ```
  *
- *  bevelEnabled: <bool>, // turn on bevel
- *  bevelThickness: <float>, // how deep into text bevel goes
- *  bevelSize: <float>, // how far from text outline (including bevelOffset) is bevel
- *  bevelOffset: <float> // how far from text outline does bevel start
- * }
+ * @augments ExtrudeGeometry
  */
-
-import {
-	ExtrudeGeometry
-} from 'three';
-
 class TextGeometry extends ExtrudeGeometry {
 
+	/**
+	 * Constructs a new text geometry.
+	 *
+	 * @param {string} text - The text that should be transformed into a geometry.
+	 * @param {TextGeometry~Options} [parameters] - The text settings.
+	 */
 	constructor( text, parameters = {} ) {
 
 		const font = parameters.font;
@@ -50,5 +61,22 @@ class TextGeometry extends ExtrudeGeometry {
 
 }
 
+/**
+ * Represents the `options` type of the geometry's constructor.
+ *
+ * @typedef {Object} TextGeometry~Options
+ * @property {Font} [font] - The font.
+ * @property {number} [size=100] - The text size.
+ * @property {number} [depth=50] - Depth to extrude the shape.
+ * @property {number} [curveSegments=12] - Number of points on the curves.
+ * @property {number} [steps=1] - Number of points used for subdividing segments along the depth of the extruded spline.
+ * @property {boolean} [bevelEnabled=false] - Whether to beveling to the shape or not.
+ * @property {number} [bevelThickness=10] - How deep into the original shape the bevel goes.
+ * @property {number} [bevelSize=8] - Distance from the shape outline that the bevel extends.
+ * @property {number} [bevelOffset=0] - Distance from the shape outline that the bevel starts.
+ * @property {number} [bevelSegments=3] - Number of bevel layers.
+ * @property {?Curve} [extrudePath=null] - A 3D spline path along which the shape should be extruded. Bevels not supported for path extrusion.
+ * @property {Object} [UVGenerator] - An object that provides UV generator functions for custom UV generation.
+ **/
 
 export { TextGeometry };

BIN
examples/screenshots/webgl_geometries_parametric.jpg


+ 8 - 29
examples/webgl_geometries_parametric.html

@@ -26,9 +26,8 @@
 
 			import Stats from 'three/addons/libs/stats.module.js';
 
-			import * as Curves from 'three/addons/curves/CurveExtras.js';
 			import { ParametricGeometry } from 'three/addons/geometries/ParametricGeometry.js';
-			import { ParametricGeometries } from 'three/addons/geometries/ParametricGeometries.js';
+			import { plane, klein, mobius } from 'three/addons/geometries/ParametricFunctions.js';
 
 			let camera, scene, renderer, stats;
 
@@ -65,47 +64,27 @@
 
 				let geometry, object;
 
-				geometry = new ParametricGeometry( ParametricGeometries.plane( 100, 100 ), 10, 10 );
+				geometry = new ParametricGeometry( plane, 10, 10 );
+				geometry.scale( 100, 100, 100 );
 				geometry.center();
 				object = new THREE.Mesh( geometry, material );
-				object.position.set( - 200, 0, 200 );
+				object.position.set( - 200, 0, 0 );
 				scene.add( object );
 
-				geometry = new ParametricGeometry( ParametricGeometries.klein, 20, 20 );
+				geometry = new ParametricGeometry( klein, 20, 20 );
 				object = new THREE.Mesh( geometry, material );
-				object.position.set( 0, 0, 200 );
+				object.position.set( 0, 0, 0 );
 				object.scale.multiplyScalar( 5 );
 				scene.add( object );
 
-				geometry = new ParametricGeometry( ParametricGeometries.mobius, 20, 20 );
+				geometry = new ParametricGeometry( mobius, 20, 20 );
 				object = new THREE.Mesh( geometry, material );
-				object.position.set( 200, 0, 200 );
+				object.position.set( 200, 0, 0 );
 				object.scale.multiplyScalar( 30 );
 				scene.add( object );
 
 				//
 
-				const GrannyKnot = new Curves.GrannyKnot();
-
-				const torus = new ParametricGeometries.TorusKnotGeometry( 50, 10, 50, 20, 2, 3 );
-				const sphere = new ParametricGeometries.SphereGeometry( 50, 20, 10 );
-				const tube = new ParametricGeometries.TubeGeometry( GrannyKnot, 100, 3, 8, true );
-
-				object = new THREE.Mesh( torus, material );
-				object.position.set( - 200, 0, - 200 );
-				scene.add( object );
-
-				object = new THREE.Mesh( sphere, material );
-				object.position.set( 0, 0, - 200 );
-				scene.add( object );
-
-				object = new THREE.Mesh( tube, material );
-				object.position.set( 200, 0, - 200 );
-				object.scale.multiplyScalar( 2 );
-				scene.add( object );
-
-				//
-
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );

+ 1 - 0
utils/docs/jsdoc.config.json

@@ -19,6 +19,7 @@
             "examples/jsm/effects",
             "examples/jsm/environments",
             "examples/jsm/exporters",
+            "examples/jsm/geometries",
             "examples/jsm/helpers",
             "examples/jsm/interactive",
             "examples/jsm/lighting",

粤ICP备19079148号