Docs: More JSDoc. (#30646)

examples/jsm/effects/AnaglyphEffect.js

@@ -9,8 +9,21 @@ import {
 } from 'three';
 import { FullScreenQuad } from '../postprocessing/Pass.js';
 
+/**
+ * A class that creates an anaglyph effect.
+ *
+ * Note that this class can only be used with {@link WebGLRenderer}.
+ * When using {@link WebGPURenderer}, use {@link AnaglyphPassNode}.
+ */
 class AnaglyphEffect {
 
+	/**
+	 * Constructs a new anaglyph effect.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {number} width - The width of the effect in physical pixels.
+	 * @param {number} height - The height of the effect in physical pixels.
+	 */
 	constructor( renderer, width = 512, height = 512 ) {
 
 		// Dubois matrices from https://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.7.6968&rep=rep1&type=pdf#page=4
@@ -94,6 +107,12 @@ class AnaglyphEffect {
 
 		const _quad = new FullScreenQuad( _material );
 
+		/**
+		 * Resizes the effect.
+		 *
+		 * @param {number} width - The width of the effect in logical pixels.
+		 * @param {number} height - The height of the effect in logical pixels.
+		 */
 		this.setSize = function ( width, height ) {
 
 			renderer.setSize( width, height );
@@ -105,6 +124,13 @@ class AnaglyphEffect {
 
 		};
 
+		/**
+		 * When using this effect, this method should be called instead of the
+		 * default {@link WebGLRenderer#render}.
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.render = function ( scene, camera ) {
 
 			const currentRenderTarget = renderer.getRenderTarget();
@@ -130,6 +156,10 @@ class AnaglyphEffect {
 
 		};
 
+		/**
+		 * Frees internal resources. This method should be called
+		 * when the effect is no longer required.
+		 */
 		this.dispose = function () {
 
 			_renderTargetL.dispose();

examples/jsm/effects/AsciiEffect.js

@@ -1,11 +1,17 @@
 /**
- * Ascii generation is based on https://github.com/hassadee/jsascii/blob/master/jsascii.js
+ * A class that creates a ASCII effect.
  *
- * 16 April 2012 - @blurspline
+ * The ASCII generation is based on [jsascii]{@link https://github.com/hassadee/jsascii/blob/master/jsascii.js}.
  */
-
 class AsciiEffect {
 
+	/**
+	 * Constructs a new ASCII effect.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {string} [charSet=' .:-=+*#%@'] - The char set.
+	 * @param {AsciiEffect~Options} [options] - The configuration parameter.
+	 */
 	constructor( renderer, charSet = ' .:-=+*#%@', options = {} ) {
 
 		// ' .,:;=|iI+hHOE#`$';
@@ -14,12 +20,12 @@ class AsciiEffect {
 
 		// Some ASCII settings
 
-		const fResolution = options[ 'resolution' ] || 0.15; // Higher for more details
+		const fResolution = options[ 'resolution' ] || 0.15;
 		const iScale = options[ 'scale' ] || 1;
-		const bColor = options[ 'color' ] || false; // nice but slows down rendering!
-		const bAlpha = options[ 'alpha' ] || false; // Transparency
-		const bBlock = options[ 'block' ] || false; // blocked characters. like good O dos
-		const bInvert = options[ 'invert' ] || false; // black is white, white is black
+		const bColor = options[ 'color' ] || false;
+		const bAlpha = options[ 'alpha' ] || false;
+		const bBlock = options[ 'block' ] || false;
+		const bInvert = options[ 'invert' ] || false;
 		const strResolution = options[ 'strResolution' ] || 'low';
 
 		let width, height;
@@ -33,6 +39,12 @@ class AsciiEffect {
 		let iWidth, iHeight;
 		let oImg;
 
+		/**
+		 * Resizes the effect.
+		 *
+		 * @param {number} w - The width of the effect in logical pixels.
+		 * @param {number} h - The height of the effect in logical pixels.
+		 */
 		this.setSize = function ( w, h ) {
 
 			width = w;
@@ -44,7 +56,13 @@ class AsciiEffect {
 
 		};
 
-
+		/**
+		 * When using this effect, this method should be called instead of the
+		 * default {@link WebGLRenderer#render}.
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.render = function ( scene, camera ) {
 
 			renderer.render( scene, camera );
@@ -52,6 +70,12 @@ class AsciiEffect {
 
 		};
 
+		/**
+		 * The DOM element of the effect. This element must be used instead of the
+		 * default {@link WebGLRenderer#domElement}.
+		 *
+		 * @type {HTMLDivElement}
+		 */
 		this.domElement = domElement;
 
 
@@ -260,4 +284,17 @@ class AsciiEffect {
 
 }
 
+/**
+ * This type represents configuration settings of `AsciiEffect`.
+ *
+ * @typedef {Object} AsciiEffect~Options
+ * @property {number} [resolution=0.15] - A higher value leads to more details.
+ * @property {number} [scale=1] - The scale of the effect.
+ * @property {boolean} [color=false] - Whether colors should be enabled or not. Better quality but slows down rendering.
+ * @property {boolean} [alpha=false] - Whether transparency should be enabled or not.
+ * @property {boolean} [block=false] - Whether blocked characters should be enabled or not.
+ * @property {boolean} [invert=false] - Whether colors should be inverted or not.
+ * @property {('low'|'medium'|'high')} [strResolution='low'] - The string resolution.
+ **/
+
 export { AsciiEffect };

examples/jsm/effects/OutlineEffect.js

@@ -7,12 +7,12 @@ import {
 } from 'three';
 
 /**
- * Reference: https://en.wikipedia.org/wiki/Cel_shading
+ * An outline effect for toon shaders.
  *
- * API
- *
- * 1. Traditional
+ * Note that this class can only be used with {@link WebGLRenderer}.
+ * When using {@link WebGPURenderer}, use {@link ToonOutlinePassNode}.
  *
+ * ```js
  * const effect = new OutlineEffect( renderer );
  *
  * function render() {
@@ -20,50 +20,16 @@ import {
  * 	effect.render( scene, camera );
  *
  * }
- *
- * 2. VR compatible
- *
- * const effect = new OutlineEffect( renderer );
- * let renderingOutline = false;
- *
- * scene.onAfterRender = function () {
- *
- * 	if ( renderingOutline ) return;
- *
- * 	renderingOutline = true;
- *
- * 	effect.renderOutline( scene, camera );
- *
- * 	renderingOutline = false;
- *
- * };
- *
- * function render() {
- *
- * 	renderer.render( scene, camera );
- *
- * }
- *
- * // How to set default outline parameters
- * new OutlineEffect( renderer, {
- * 	defaultThickness: 0.01,
- * 	defaultColor: [ 0, 0, 0 ],
- * 	defaultAlpha: 0.8,
- * 	defaultKeepAlive: true // keeps outline material in cache even if material is removed from scene
- * } );
- *
- * // How to set outline parameters for each material
- * material.userData.outlineParameters = {
- * 	thickness: 0.01,
- * 	color: [ 0, 0, 0 ],
- * 	alpha: 0.8,
- * 	visible: true,
- * 	keepAlive: true
- * };
+ * ```
  */
-
 class OutlineEffect {
 
+	/**
+	 * Constructs a new outline effect.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 * @param {OutlineEffect~Options} [parameters] - The configuration parameter.
+	 */
 	constructor( renderer, parameters = {} ) {
 
 		this.enabled = true;
@@ -413,6 +379,13 @@ class OutlineEffect {
 
 		}
 
+		/**
+		 * When using this effect, this method should be called instead of the
+		 * default {@link WebGLRenderer#render}.
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.render = function ( scene, camera ) {
 
 			if ( this.enabled === false ) {
@@ -433,6 +406,30 @@ class OutlineEffect {
 
 		};
 
+		/**
+		 * This method can be used to render outlines in VR.
+		 *
+		 * ```js
+		 * const effect = new OutlineEffect( renderer );
+		 * let renderingOutline = false;
+		 *
+		 * scene.onAfterRender = function () {
+		 *
+		 * 	if ( renderingOutline ) return;
+		 *
+		 * 	renderingOutline = true;
+		 * 	effect.renderOutline( scene, camera );
+		 * 	renderingOutline = false;
+		 * };
+		 *
+		 * function render() {
+		 * 	renderer.render( scene, camera );
+		 * }
+		 * ```
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.renderOutline = function ( scene, camera ) {
 
 			const currentAutoClear = renderer.autoClear;
@@ -460,75 +457,15 @@ class OutlineEffect {
 
 		};
 
-		/*
-		 * See #9918
-		 *
-		 * The following property copies and wrapper methods enable
-		 * OutlineEffect to be called from other *Effect, like
-		 *
-		 * effect = new StereoEffect( new OutlineEffect( renderer ) );
-		 *
-		 * function render () {
+		/**
+		 * Resizes the effect.
 		 *
-	 	 * 	effect.render( scene, camera );
-		 *
-		 * }
+		 * @param {number} width - The width of the effect in logical pixels.
+		 * @param {number} height - The height of the effect in logical pixels.
 		 */
-		this.autoClear = renderer.autoClear;
-		this.domElement = renderer.domElement;
-		this.shadowMap = renderer.shadowMap;
-
-		this.clear = function ( color, depth, stencil ) {
-
-			renderer.clear( color, depth, stencil );
+		this.setSize = function ( width, height ) {
 
-		};
-
-		this.getPixelRatio = function () {
-
-			return renderer.getPixelRatio();
-
-		};
-
-		this.setPixelRatio = function ( value ) {
-
-			renderer.setPixelRatio( value );
-
-		};
-
-		this.getSize = function ( target ) {
-
-			return renderer.getSize( target );
-
-		};
-
-		this.setSize = function ( width, height, updateStyle ) {
-
-			renderer.setSize( width, height, updateStyle );
-
-		};
-
-		this.setViewport = function ( x, y, width, height ) {
-
-			renderer.setViewport( x, y, width, height );
-
-		};
-
-		this.setScissor = function ( x, y, width, height ) {
-
-			renderer.setScissor( x, y, width, height );
-
-		};
-
-		this.setScissorTest = function ( boolean ) {
-
-			renderer.setScissorTest( boolean );
-
-		};
-
-		this.setRenderTarget = function ( renderTarget ) {
-
-			renderer.setRenderTarget( renderTarget );
+			renderer.setSize( width, height );
 
 		};
 
@@ -536,4 +473,15 @@ class OutlineEffect {
 
 }
 
+/**
+ * This type represents configuration settings of `OutlineEffect`.
+ *
+ * @typedef {Object} OutlineEffect~Options
+ * @property {number} [defaultThickness=0.003] - The outline thickness.
+ * @property {Array<number>} [defaultColor=[0,0,0]] - The outline color.
+ * @property {number} [defaultAlpha=1] - The outline alpha value.
+ * @property {boolean} [defaultKeepAlive=false] - Whether to keep alive cached internal materials or not.
+ **/
+
+
 export { OutlineEffect };

examples/jsm/effects/ParallaxBarrierEffect.js

@@ -8,8 +8,19 @@ import {
 } from 'three';
 import { FullScreenQuad } from '../postprocessing/Pass.js';
 
+/**
+ * A class that creates an parallax barrier effect.
+ *
+ * Note that this class can only be used with {@link WebGLRenderer}.
+ * When using {@link WebGPURenderer}, use {@link ParallaxBarrierPassNode}.
+ */
 class ParallaxBarrierEffect {
 
+	/**
+	 * Constructs a new parallax barrier effect.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 */
 	constructor( renderer ) {
 
 		const _stereo = new StereoCamera();
@@ -72,6 +83,12 @@ class ParallaxBarrierEffect {
 
 		const _quad = new FullScreenQuad( _material );
 
+		/**
+		 * Resizes the effect.
+		 *
+		 * @param {number} width - The width of the effect in logical pixels.
+		 * @param {number} height - The height of the effect in logical pixels.
+		 */
 		this.setSize = function ( width, height ) {
 
 			renderer.setSize( width, height );
@@ -83,6 +100,13 @@ class ParallaxBarrierEffect {
 
 		};
 
+		/**
+		 * When using this effect, this method should be called instead of the
+		 * default {@link WebGLRenderer#render}.
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.render = function ( scene, camera ) {
 
 			const currentRenderTarget = renderer.getRenderTarget();
@@ -108,6 +132,10 @@ class ParallaxBarrierEffect {
 
 		};
 
+		/**
+		 * Frees internal resources. This method should be called
+		 * when the effect is no longer required.
+		 */
 		this.dispose = function () {
 
 			_renderTargetL.dispose();

examples/jsm/effects/PeppersGhostEffect.js

@@ -5,11 +5,17 @@ import {
 } from 'three';
 
 /**
- * peppers ghost effect based on http://www.instructables.com/id/Reflective-Prism/?ALLSTEPS
+ * A class that implements a peppers ghost effect.
+ *
+ * Reference: [Reflective Prism]{@link http://www.instructables.com/id/Reflective-Prism/?ALLSTEPS}
  */
-
 class PeppersGhostEffect {
 
+	/**
+	 * Constructs a new peppers ghost effect.
+	 *
+	 * @param {(Renderer|WebGLRenderer)} renderer - The renderer.
+	 */
 	constructor( renderer ) {
 
 		const scope = this;
@@ -32,6 +38,12 @@ class PeppersGhostEffect {
 		// Initialization
 		renderer.autoClear = false;
 
+		/**
+		 * Resizes the effect.
+		 *
+		 * @param {number} width - The width of the effect in logical pixels.
+		 * @param {number} height - The height of the effect in logical pixels.
+		 */
 		this.setSize = function ( width, height ) {
 
 			_halfWidth = width / 2;
@@ -51,6 +63,13 @@ class PeppersGhostEffect {
 
 		};
 
+		/**
+		 * When using this effect, this method should be called instead of the
+		 * default {@link WebGLRenderer#render}.
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.render = function ( scene, camera ) {
 
 			if ( scene.matrixWorldAutoUpdate === true ) scene.updateMatrixWorld();

examples/jsm/effects/StereoEffect.js

@@ -3,26 +3,55 @@ import {
 	Vector2
 } from 'three';
 
+/**
+ * A class that creates an stereo effect.
+ *
+ * Note that this class can only be used with {@link WebGLRenderer}.
+ * When using {@link WebGPURenderer}, use {@link StereoPassNode}.
+ */
 class StereoEffect {
 
+	/**
+	 * Constructs a new stereo effect.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 */
 	constructor( renderer ) {
 
 		const _stereo = new StereoCamera();
 		_stereo.aspect = 0.5;
 		const size = new Vector2();
 
+		/**
+		 * Sets the given eye separation.
+		 *
+		 * @param {number} eyeSep - The eye separation to set.
+		 */
 		this.setEyeSeparation = function ( eyeSep ) {
 
 			_stereo.eyeSep = eyeSep;
 
 		};
 
+		/**
+		 * Resizes the effect.
+		 *
+		 * @param {number} width - The width of the effect in logical pixels.
+		 * @param {number} height - The height of the effect in logical pixels.
+		 */
 		this.setSize = function ( width, height ) {
 
 			renderer.setSize( width, height );
 
 		};
 
+		/**
+		 * When using this effect, this method should be called instead of the
+		 * default {@link WebGLRenderer#render}.
+		 *
+		 * @param {Object3D} scene - The scene to render.
+		 * @param {Camera} camera - The camera.
+		 */
 		this.render = function ( scene, camera ) {
 
 			if ( scene.matrixWorldAutoUpdate === true ) scene.updateMatrixWorld();

examples/jsm/exporters/DRACOExporter.js

@@ -1,24 +1,34 @@
 import { Color, ColorManagement, SRGBColorSpace } from 'three';
 
+/* global DracoEncoderModule */
+
 /**
- * Export draco compressed files from threejs geometry objects.
+ * An exporter to compress geometry with the Draco library.
  *
- * Draco files are compressed and usually are smaller than conventional 3D file formats.
+ * [Draco]{@link https://google.github.io/draco/} is an open source library for compressing and
+ * decompressing 3D meshes and point clouds. Compressed geometry can be significantly smaller,
+ * at the cost of additional decoding time on the client device.
  *
- * The exporter receives a options object containing
- *  - decodeSpeed, indicates how to tune the encoder regarding decode speed (0 gives better speed but worst quality)
- *  - encodeSpeed, indicates how to tune the encoder parameters (0 gives better speed but worst quality)
- *  - encoderMethod
- *  - quantization, indicates the presision of each type of data stored in the draco file in the order (POSITION, NORMAL, COLOR, TEX_COORD, GENERIC)
- *  - exportUvs
- *  - exportNormals
- *  - exportColor
+ * Standalone Draco files have a `.drc` extension, and contain vertex positions,
+ * normals, colors, and other attributes. Draco files *do not* contain materials,
+ * textures, animation, or node hierarchies – to use these features, embed Draco geometry
+ * inside of a glTF file. A normal glTF file can be converted to a Draco-compressed glTF file
+ * using [glTF-Pipeline]{@link https://github.com/AnalyticalGraphicsInc/gltf-pipeline}.
+ *
+ * ```js
+ * const exporter = new DRACOExporter();
+ * const data = exporter.parse( mesh, options );
+ * ```
  */
-
-/* global DracoEncoderModule */
-
 class DRACOExporter {
 
+	/**
+	 * Parses the given mesh or point cloud and generates the Draco output.
+	 *
+	 * @param {(Mesh|Points)} object - The mesh or point cloud to export.
+	 * @param {DRACOExporter~Options} options - The export options.
+	 * @return {ArrayBuffer} The exported Draco.
+	 */
 	parse( object, options = {} ) {
 
 		options = Object.assign( {
@@ -249,7 +259,24 @@ function createVertexColorSRGBArray( attribute ) {
 
 // Encoder methods
 
+/**
+ * Edgebreaker encoding.
+ *
+ * @static
+ * @constant
+ * @type {number}
+ * @default 1
+ */
 DRACOExporter.MESH_EDGEBREAKER_ENCODING = 1;
+
+/**
+ * Sequential encoding.
+ *
+ * @static
+ * @constant
+ * @type {number}
+ * @default 0
+ */
 DRACOExporter.MESH_SEQUENTIAL_ENCODING = 0;
 
 // Geometry type
@@ -266,4 +293,17 @@ DRACOExporter.COLOR = 2;
 DRACOExporter.TEX_COORD = 3;
 DRACOExporter.GENERIC = 4;
 
+/**
+ * Export options of `DRACOExporter`.
+ *
+ * @typedef {Object} DRACOExporter~Options
+ * @property {number} [decodeSpeed=5] - Indicates how to tune the encoder regarding decode speed (0 gives better speed but worst quality).
+ * @property {number} [encodeSpeed=5] - Indicates how to tune the encoder parameters (0 gives better speed but worst quality).
+ * @property {number} [encoderMethod=1] - Either sequential (very little compression) or Edgebreaker. Edgebreaker traverses the triangles of the mesh in a deterministic, spiral-like way which provides most of the benefits of this data format.
+ * @property {Array<number>} [quantization=[ 16, 8, 8, 8, 8 ]] - Indicates the precision of each type of data stored in the draco file in the order (POSITION, NORMAL, COLOR, TEX_COORD, GENERIC).
+ * @property {boolean} [exportUvs=true] - Whether to export UVs or not.
+ * @property {boolean} [exportNormals=true] - Whether to export normals or not.
+ * @property {boolean} [exportColor=false] - Whether to export colors or not.
+ **/
+
 export { DRACOExporter };

examples/jsm/exporters/EXRExporter.js

@@ -1,10 +1,3 @@
-/**
- * @author sciecode / https://github.com/sciecode
- *
- * EXR format references:
- * 	https://www.openexr.com/documentation/openexrfilelayout.pdf
- */
-
 import {
 	FloatType,
 	HalfFloatType,
@@ -19,13 +12,41 @@ const NO_COMPRESSION = 0;
 const ZIPS_COMPRESSION = 2;
 const ZIP_COMPRESSION = 3;
 
+/**
+ * An exporter for EXR.
+ *
+ * EXR ( Extended Dynamic Range) is an [open format specification]{@link https://github.com/AcademySoftwareFoundation/openexr}
+ * for professional-grade image storage format of the motion picture industry. The purpose of
+ * format is to accurately and efficiently represent high-dynamic-range scene-linear image data
+ * and associated metadata. The library is widely used in host application software where accuracy
+ * is critical, such as photorealistic rendering, texture access, image compositing, deep compositing,
+ * and DI.
+ *
+ * ```js
+ * const exporter = new EXRExporter();
+ * const result = await exporter.parse( renderer, options );
+ * ```
+ */
 class EXRExporter {
 
+	/**
+	 * This method has two variants.
+	 *
+	 * - When exporting a data texture, it receives two paramters. The texture and the exporter options.
+	 * - When exporting a render target (e.g. a PMREM), it receives three parameters. The renderer, the
+	 * render target and the exporter options.
+	 *
+	 * @async
+	 * @param {(DataTexture|WebGPURenderer|WebGLRenderer)} arg1 - The data texture to export or a renderer.
+	 * @param {(EXRExporter~Options|RenderTarget)} arg2 - The exporter options or a render target.
+	 * @param {EXRExporter~Options} [arg3] - The exporter options.
+	 * @return {Promise<Uint8Array>} A Promise that resolves with the exported EXR.
+	 */
 	async parse( arg1, arg2, arg3 ) {
 
 		if ( ! arg1 || ! ( arg1.isWebGLRenderer || arg1.isWebGPURenderer || arg1.isDataTexture ) ) {
 
-			throw Error( 'EXRExporter.parse: Unsupported first parameter, expected instance of WebGLRenderer or DataTexture.' );
+			throw Error( 'EXRExporter.parse: Unsupported first parameter, expected instance of WebGLRenderer, WebGPURenderer or DataTexture.' );
 
 		} else if ( arg1.isWebGLRenderer || arg1.isWebGPURenderer ) {
 
@@ -584,4 +605,12 @@ function getFloat32( arr, i ) {
 
 }
 
+/**
+ * Export options of `EXRExporter`.
+ *
+ * @typedef {Object} EXRExporter~Options
+ * @property {(HalfFloatType|FloatType)} [type=HalfFloatType] - Output data type.
+ * @property {(NO_COMPRESSION|ZIP_COMPRESSION|ZIPS_COMPRESSION)} [type=ZIP_COMPRESSION] - The compression algorithm.
+ **/
+
 export { EXRExporter, NO_COMPRESSION, ZIP_COMPRESSION, ZIPS_COMPRESSION };

examples/jsm/exporters/GLTFExporter.js

@@ -61,11 +61,55 @@ const KHR_mesh_quantization_ExtraAttrTypes = {
 	],
 };
 
-
+/**
+ * An exporter for `glTF` 2.0.
+ *
+ * glTF (GL Transmission Format) is an [open format specification]{@link https://github.com/KhronosGroup/glTF/tree/master/specification/2.0}
+ * for efficient delivery and loading of 3D content. Assets may be provided either in JSON (.gltf)
+ * or binary (.glb) format. External files store textures (.jpg, .png) and additional binary
+ * data (.bin). A glTF asset may deliver one or more scenes, including meshes, materials,
+ * textures, skins, skeletons, morph targets, animations, lights, and/or cameras.
+ *
+ * GLTFExporter supports the [glTF 2.0 extensions]{@link https://github.com/KhronosGroup/glTF/tree/master/extensions/}:
+ *
+ * - KHR_lights_punctual
+ * - KHR_materials_clearcoat
+ * - KHR_materials_dispersion
+ * - KHR_materials_emissive_strength
+ * - KHR_materials_ior
+ * - KHR_materials_iridescence
+ * - KHR_materials_specular
+ * - KHR_materials_sheen
+ * - KHR_materials_transmission
+ * - KHR_materials_unlit
+ * - KHR_materials_volume
+ * - KHR_mesh_quantization
+ * - KHR_texture_transform
+ * - EXT_materials_bump
+ * - EXT_mesh_gpu_instancing
+ *
+ * The following glTF 2.0 extension is supported by an external user plugin:
+ *
+ * - [KHR_materials_variants]{@link https://github.com/takahirox/three-gltf-extensions}
+ *
+ * ```js
+ * const exporter = new GLTFExporter();
+ * const data = await exporter.parseAsync( scene, options );
+ * ```
+ */
 class GLTFExporter {
 
+	/**
+	 * Constructs a new glTF exporter.
+	 */
 	constructor() {
 
+		/**
+		 * A reference to a texture utils module.
+		 *
+		 * @type {?(WebGLTextureUtils|WebGPUTextureUtils)}
+		 * @default null
+		 */
 		this.textureUtils = null;
 
 		this.pluginCallbacks = [];
@@ -156,6 +200,14 @@ class GLTFExporter {
 
 	}
 
+	/**
+	 * Registers a plugin callback. This API is iternally used to implement the various
+	 * glTF extensions but can also used by third-party code to add additional logic
+	 * to the exporter.
+	 *
+	 * @param {function(writer:GLTFWriter)} callback - The callback function to register.
+	 * @return {GLTFExporter} A reference to this exporter.
+	 */
 	register( callback ) {
 
 		if ( this.pluginCallbacks.indexOf( callback ) === - 1 ) {
@@ -168,6 +220,12 @@ class GLTFExporter {
 
 	}
 
+	/**
+	 * Unregisters a plugin callback.
+	 *
+	 * @param {Function} callback - The callback function to unregister.
+	 * @return {GLTFExporter} A reference to this exporter.
+	 */
 	unregister( callback ) {
 
 		if ( this.pluginCallbacks.indexOf( callback ) !== - 1 ) {
@@ -180,6 +238,15 @@ class GLTFExporter {
 
 	}
 
+	/**
+	 * Sets the texture utils for this exporter. Only relevant when compressed textures have to be exported.
+	 *
+	 * Depending on whether you use {@link WebGLRenderer} or {@link WebGPURenderer}, you must inject the
+	 * corresponding texture utils {@link WebGLTextureUtils} or {@link WebGPUTextureUtils}.
+	 *
+	 * @param {WebGLTextureUtils|WebGPUTextureUtils} utils - The texture utils.
+	 * @return {GLTFExporter} A reference to this exporter.
+	 */
 	setTextureUtils( utils ) {
 
 		this.textureUtils = utils;
@@ -189,12 +256,12 @@ class GLTFExporter {
 	}
 
 	/**
-	 * Parse scenes and generate GLTF output
+	 * Parses the given scenes and generates the glTF output.
 	 *
-	 * @param  {Scene|Array<Scene>} input   Scene or Array of THREE.Scenes
-	 * @param  {Function} onDone  Callback on completed
-	 * @param  {Function} onError  Callback on errors
-	 * @param  {Object} options options
+	 * @param {Scene|Array<Scene>} input - A scene or an array of scenes.
+	 * @param {GLTFExporter~OnDone} onDone - A callback function that is executed when the export has finished.
+	 * @param {GLTFExporter~OnError} onError - A callback function that is executed when an error happens.
+	 * @param {GLTFExporter~Options} options - options
 	 */
 	parse( input, onDone, onError, options ) {
 
@@ -213,6 +280,13 @@ class GLTFExporter {
 
 	}
 
+	/**
+	 * Async version of {@link GLTFExporter#parse}.
+	 *
+	 * @param {Scene|Array<Scene>} input - A scene or an array of scenes.
+	 * @param {GLTFExporter~Options} options - options.
+	 * @return {Promise<ArrayBuffer|string>} A Promise that resolved with the exported glTF data.
+	 */
 	parseAsync( input, options ) {
 
 		const scope = this;
@@ -304,6 +378,8 @@ const GLB_CHUNK_TYPE_BIN = 0x004E4942;
 
 /**
  * Compare two arrays
+ *
+ * @private
  * @param  {Array} array1 Array 1 to compare
  * @param  {Array} array2 Array 2 to compare
  * @return {boolean}        Returns true if both arrays are equal
@@ -320,6 +396,8 @@ function equalArray( array1, array2 ) {
 
 /**
  * Converts a string to an ArrayBuffer.
+ *
+ * @private
  * @param  {string} text
  * @return {ArrayBuffer}
  */
@@ -332,6 +410,7 @@ function stringToArrayBuffer( text ) {
 /**
  * Is identity matrix
  *
+ * @private
  * @param {Matrix4} matrix
  * @returns {boolean} Returns true, if parameter is identity matrix
  */
@@ -344,6 +423,7 @@ function isIdentityMatrix( matrix ) {
 /**
  * Get the min and max vectors from the given attribute
  *
+ * @private
  * @param  {BufferAttribute} attribute Attribute to find the min/max in range from start to start + count
  * @param  {number} start Start index
  * @param  {number} count Range to cover
@@ -400,6 +480,7 @@ function getMinMax( attribute, start, count ) {
  * Get the required size + padding for a buffer, rounded to the next 4-byte boundary.
  * https://github.com/KhronosGroup/glTF/tree/master/specification/2.0#data-alignment
  *
+ * @private
  * @param {number} bufferSize The size the original buffer. Should be an integer.
  * @returns {number} new buffer size with required padding as an integer.
  *
@@ -413,6 +494,7 @@ function getPaddedBufferSize( bufferSize ) {
 /**
  * Returns a buffer aligned to 4-byte boundary.
  *
+ * @private
  * @param {ArrayBuffer} arrayBuffer Buffer to pad
  * @param {number} [paddingByte=0] Should be an integer
  * @returns {ArrayBuffer} The same buffer if it's already aligned to 4-byte boundary or a new buffer
@@ -489,6 +571,8 @@ function getToBlobPromise( canvas, mimeType ) {
 
 /**
  * Writer
+ *
+ * @private
  */
 class GLTFWriter {
 
@@ -2511,6 +2595,8 @@ class GLTFWriter {
  * Punctual Lights Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_lights_punctual
+ *
+ * @private
  */
 class GLTFLightExtension {
 
@@ -2606,6 +2692,8 @@ class GLTFLightExtension {
  * Unlit Materials Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_unlit
+ *
+ * @private
  */
 class GLTFMaterialsUnlitExtension {
 
@@ -2639,6 +2727,8 @@ class GLTFMaterialsUnlitExtension {
  * Clearcoat Materials Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_clearcoat
+ *
+ * @private
  */
 class GLTFMaterialsClearcoatExtension {
 
@@ -2712,6 +2802,8 @@ class GLTFMaterialsClearcoatExtension {
  * Materials dispersion Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_dispersion
+ *
+ * @private
  */
 class GLTFMaterialsDispersionExtension {
 
@@ -2746,6 +2838,8 @@ class GLTFMaterialsDispersionExtension {
  * Iridescence Materials Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_iridescence
+ *
+ * @private
  */
 class GLTFMaterialsIridescenceExtension {
 
@@ -2806,6 +2900,8 @@ class GLTFMaterialsIridescenceExtension {
  * Transmission Materials Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_transmission
+ *
+ * @private
  */
 class GLTFMaterialsTransmissionExtension {
 
@@ -2851,6 +2947,8 @@ class GLTFMaterialsTransmissionExtension {
  * Materials Volume Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_volume
+ *
+ * @private
  */
 class GLTFMaterialsVolumeExtension {
 
@@ -2904,6 +3002,8 @@ class GLTFMaterialsVolumeExtension {
  * Materials ior Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_ior
+ *
+ * @private
  */
 class GLTFMaterialsIorExtension {
 
@@ -2938,6 +3038,8 @@ class GLTFMaterialsIorExtension {
  * Materials specular Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_materials_specular
+ *
+ * @private
  */
 class GLTFMaterialsSpecularExtension {
 
@@ -2997,6 +3099,8 @@ class GLTFMaterialsSpecularExtension {
  * Sheen Materials Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_materials_sheen
+ *
+ * @private
  */
 class GLTFMaterialsSheenExtension {
 
@@ -3054,6 +3158,8 @@ class GLTFMaterialsSheenExtension {
  * Anisotropy Materials Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/main/extensions/2.0/Khronos/KHR_materials_anisotropy
+ *
+ * @private
  */
 class GLTFMaterialsAnisotropyExtension {
 
@@ -3097,6 +3203,8 @@ class GLTFMaterialsAnisotropyExtension {
  * Materials Emissive Strength Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/blob/5768b3ce0ef32bc39cdf1bef10b948586635ead3/extensions/2.0/Khronos/KHR_materials_emissive_strength/README.md
+ *
+ * @private
  */
 class GLTFMaterialsEmissiveStrengthExtension {
 
@@ -3132,6 +3240,8 @@ class GLTFMaterialsEmissiveStrengthExtension {
  * Materials bump Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/EXT_materials_bump
+ *
+ * @private
  */
 class GLTFMaterialsBumpExtension {
 
@@ -3179,6 +3289,8 @@ class GLTFMaterialsBumpExtension {
  * GPU Instancing Extension
  *
  * Specification: https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/EXT_mesh_gpu_instancing
+ *
+ * @private
  */
 class GLTFMeshGpuInstancing {
 
@@ -3238,6 +3350,8 @@ class GLTFMeshGpuInstancing {
 
 /**
  * Static utility functions
+ *
+ * @private
  */
 GLTFExporter.Utils = {
 
@@ -3458,4 +3572,30 @@ GLTFExporter.Utils = {
 
 };
 
+/**
+ * Export options of `GLTFExporter`.
+ *
+ * @typedef {Object} GLTFExporter~Options
+ * @property {boolean} [trs=false] - Export position, rotation and scale instead of matrix per node.
+ * @property {boolean} [onlyVisible=true] - Export only visible 3D objects.
+ * @property {boolean} [binary=false] - Export in binary (.glb) format, returning an ArrayBuffer.
+ * @property {number} [maxTextureSize=Infinity] - Restricts the image maximum size (both width and height) to the given value.
+ * @property {Array<AnimationClip>} [animations=[]] - List of animations to be included in the export.
+ * @property {boolean} [includeCustomExtensions=false] - Export custom glTF extensions defined on an object's `userData.gltfExtensions` property.
+ **/
+
+/**
+ * onDone callback of `GLTFExporter`.
+ *
+ * @callback GLTFExporter~OnDone
+ * @param {ArrayBuffer|string} result - The generated .gltf (JSON) or .glb (binary).
+ */
+
+/**
+ * onError callback of `GLTFExporter`.
+ *
+ * @callback GLTFExporter~OnError
+ * @param {Error} error - The error object.
+ */
+
 export { GLTFExporter };

examples/jsm/exporters/KTX2Exporter.js

@@ -127,8 +127,28 @@ const ERROR_FORMAT = 'THREE.KTX2Exporter: Supported formats are RGBAFormat, RGFo
 const ERROR_TYPE = 'THREE.KTX2Exporter: Supported types are FloatType, HalfFloatType, or UnsignedByteType."';
 const ERROR_COLOR_SPACE = 'THREE.KTX2Exporter: Supported color spaces are SRGBColorSpace (UnsignedByteType only), LinearSRGBColorSpace, or NoColorSpace.';
 
+/**
+ * An exporter for KTX2.
+ *
+ * ```js
+ * const exporter = new KTX2Exporter();
+ * const result = await exporter.parse( dataTexture );
+ * ```
+ */
 export class KTX2Exporter {
 
+	/**
+	 * This method has two variants.
+	 *
+	 * - When exporting a data texture, it receives one paramter. The data or 3D data texture.
+	 * - When exporting a render target (e.g. a PMREM), it receives two parameters. The renderer and the
+	 * render target.
+	 *
+	 * @async
+	 * @param {(DataTexture|Data3DTexture|WebGPURenderer|WebGLRenderer)} arg1 - The data texture to export or a renderer.
+	 * @param {RenderTarget} [arg2] - The render target that should be exported
+	 * @return {Promise<Uint8Array>} A Promise that resolves with the exported KTX2.
+	 */
 	async parse( arg1, arg2 ) {
 
 		let texture;

examples/jsm/exporters/OBJExporter.js

@@ -7,8 +7,26 @@ import {
 	Vector3
 } from 'three';
 
+/**
+ * An exporter for OBJ.
+ *
+ * `OBJExporter` is not able to export material data into MTL files so only geometry data are supported.
+ *
+ * ```js
+ * const exporter = new OBJExporter();
+ * const data = exporter.parse( scene );
+ * ```
+ */
 class OBJExporter {
 
+	/**
+	 * Parses the given 3D object and generates the OBJ output.
+	 *
+	 * If the 3D object is composed of multiple children and geometry, they are merged into a single mesh in the file.
+	 *
+	 * @param {Object3D} object - The 3D object to export.
+	 * @return {string} The exported OBJ.
+	 */
 	parse( object ) {
 
 		let output = '';

examples/jsm/exporters/PLYExporter.js

@@ -7,22 +7,34 @@ import {
 } from 'three';
 
 /**
- * https://github.com/gkjohnson/ply-exporter-js
+ * An exporter for PLY.
  *
- * Usage:
- *  const exporter = new PLYExporter();
+ * PLY (Polygon or Stanford Triangle Format) is a file format for efficient delivery and l
+ * oading of simple, static 3D content in a dense format. Both binary and ascii formats are
+ * supported. PLY can store vertex positions, colors, normals and uv coordinates. No textures
+ * or texture references are saved.
  *
- *  // second argument is a list of options
- *  exporter.parse(mesh, data => console.log(data), { binary: true, excludeAttributes: [ 'color' ], littleEndian: true });
- *
- * Format Definition:
- * http://paulbourke.net/dataformats/ply/
+ * ```js
+ * const exporter = new PLYExporter();
+ * const data = exporter.parse( scene, options );
+ * ```
  */
-
 class PLYExporter {
 
+	/**
+	 * Parses the given 3D object and generates the PLY output.
+	 *
+	 * If the 3D object is composed of multiple children and geometry, they are merged into a single mesh in the file.
+	 *
+	 * @param {Object3D} object - The 3D object to export.
+	 * @param {PLYExporter~OnDone} onDone - A callback function that is executed when the export has finished.
+	 * @param {PLYExporter~Options} options - The export options.
+	 * @return {string|ArrayBuffer} The exported PLY.
+	 */
 	parse( object, onDone, options = {} ) {
 
+		// reference https://github.com/gkjohnson/ply-exporter-js
+
 		// Iterate over the valid meshes in the object
 		function traverseMeshes( cb ) {
 
@@ -527,4 +539,22 @@ class PLYExporter {
 
 }
 
+/**
+ * Export options of `PLYExporter`.
+ *
+ * @typedef {Object} PLYExporter~Options
+ * @property {boolean} [binary=false] - Whether to export in binary format or ASCII.
+ * @property {Array<string>} [excludeAttributes] - Which properties to explicitly exclude from
+ * the exported PLY file. Valid values are `'color'`, `'normal'`, `'uv'`, and `'index'`. If triangle
+ * indices are excluded, then a point cloud is exported.
+ * @property {boolean} [littleEndian=false] - Whether the binary export uses little or big endian.
+ **/
+
+/**
+ * onDone callback of `PLYExporter`.
+ *
+ * @callback PLYExporter~OnDone
+ * @param {string|ArrayBuffer} result - The generated PLY ascii or binary.
+ */
+
 export { PLYExporter };

examples/jsm/exporters/STLExporter.js

@@ -1,16 +1,29 @@
 import { Vector3 } from 'three';
 
 /**
- * Usage:
- *  const exporter = new STLExporter();
+ * An exporter for STL.
  *
- *  // second argument is a list of options
- *  const data = exporter.parse( mesh, { binary: true } );
+ * STL files describe only the surface geometry of a three-dimensional object without
+ * any representation of color, texture or other common model attributes. The STL format
+ * specifies both ASCII and binary representations, with binary being more compact.
+ * STL files contain no scale information or indexes, and the units are arbitrary.
  *
+ * ```js
+ * const exporter = new STLExporter();
+ * const data = exporter.parse( mesh, { binary: true } );
+ * ```
  */
-
 class STLExporter {
 
+	/**
+	 * Parses the given 3D object and generates the STL output.
+	 *
+	 * If the 3D object is composed of multiple children and geometry, they are merged into a single mesh in the file.
+	 *
+	 * @param {Object3D} scene - A scene, mesh or any other 3D object containing meshes to encode.
+	 * @param {STLExporter~Options} options - The export options.
+	 * @return {string|ArrayBuffer} The exported STL.
+	 */
 	parse( scene, options = {} ) {
 
 		options = Object.assign( {
@@ -196,4 +209,11 @@ class STLExporter {
 
 }
 
+/**
+ * Export options of `STLExporter`.
+ *
+ * @typedef {Object} STLExporter~Options
+ * @property {boolean} [binary=false] - Whether to export in binary format or ASCII.
+ **/
+
 export { STLExporter };

examples/jsm/exporters/USDZExporter.js

@@ -9,26 +9,67 @@ import {
 	zipSync,
 } from '../libs/fflate.module.js';
 
+/**
+ * An exporter for USDZ.
+ *
+ * ```js
+ * const exporter = new USDZExporter();
+ * const arraybuffer = await exporter.parseAsync( scene );
+ * ```
+ */
 class USDZExporter {
 
+	/**
+	 * Constructs a new USDZ exporter.
+	 */
 	constructor() {
 
+		/**
+		 * A reference to a texture utils module.
+		 *
+		 * @type {?(WebGLTextureUtils|WebGPUTextureUtils)}
+		 * @default null
+		 */
 		this.textureUtils = null;
 
 	}
 
+	/**
+	 * Sets the texture utils for this exporter. Only relevant when compressed textures have to be exported.
+	 *
+	 * Depending on whether you use {@link WebGLRenderer} or {@link WebGPURenderer}, you must inject the
+	 * corresponding texture utils {@link WebGLTextureUtils} or {@link WebGPUTextureUtils}.
+	 *
+	 * @param {WebGLTextureUtils|WebGPUTextureUtils} utils - The texture utils.
+	 */
 	setTextureUtils( utils ) {
 
 		this.textureUtils = utils;
 
 	}
 
+	/**
+	 * Parse the given 3D object and generates the USDZ output.
+	 *
+	 * @param {Object3D} scene - The 3D object to export.
+	 * @param {USDZExporter~OnDone} onDone - A callback function that is executed when the export has finished.
+	 * @param {USDZExporter~OnError} onError - A callback function that is executed when an error happens.
+	 * @param {USDZExporter~Options} options - The export options.
+	 */
 	parse( scene, onDone, onError, options ) {
 
 		this.parseAsync( scene, options ).then( onDone ).catch( onError );
 
 	}
 
+	/**
+	 * Async version of {@link USDZExporter#parse}.
+	 *
+	 * @async
+	 * @param {Object3D} scene - The 3D object to export.
+	 * @param {USDZExporter~Options} options - The export options.
+	 * @return {Promise<ArrayBuffer>} A Promise that resolved with the exported USDZ data.
+	 */
 	async parseAsync( scene, options = {} ) {
 
 		options = Object.assign( {
@@ -779,4 +820,30 @@ function buildCamera( camera ) {
 
 }
 
+/**
+ * Export options of `USDZExporter`.
+ *
+ * @typedef {Object} USDZExporter~Options
+ * @property {number} [maxTextureSize=1024] - The maxiumum texture size that is going to be exported.
+ * @property {boolean} [includeAnchoringProperties=false] - Whether to include anchoring properties or not.
+ * @property {Object} [ar] - If `includeAnchoringProperties` is set to `true`, the anchoring type and alignment
+ * can be configured via `ar.anchoring.type` and `ar.planeAnchoring.alignment`.
+ * @property {boolean} [quickLookCompatible=false] - Whether to make the exported USDZ compatible to QuickLook
+ * which means the asset is modified to accomodate the bugs FB10036297 and FB11442287 (Apple Feedback).
+ **/
+
+/**
+ * onDone callback of `USDZExporter`.
+ *
+ * @callback USDZExporter~OnDone
+ * @param {ArrayBuffer} result - The generated USDZ.
+ */
+
+/**
+ * onError callback of `USDZExporter`.
+ *
+ * @callback USDZExporter~OnError
+ * @param {Error} error - The error object.
+ */
+
 export { USDZExporter };

examples/jsm/helpers/LightProbeHelper.js

@@ -4,8 +4,27 @@ import {
 	SphereGeometry
 } from 'three';
 
+/**
+ * Renders a sphere to visualize a light probe in the scene.
+ *
+ * This helper can only be used with {@link WebGLRenderer}.
+ * When using {@link WebGPURenderer}, import from `LightProbeHelperGPU.js`.
+ *
+ * ```js
+ * const helper = new LightProbeHelper( lightProbe );
+ * scene.add( helper );
+ * ```
+ *
+ * @augments Mesh
+ */
 class LightProbeHelper extends Mesh {
 
+	/**
+	 * Constructs a new light probe helper.
+	 *
+	 * @param {LightProbe} lightProbe - The light probe to visualize.
+	 * @param {number} [size=1] - The size of the helper.
+	 */
 	constructor( lightProbe, size = 1 ) {
 
 		const material = new ShaderMaterial( {
@@ -99,7 +118,19 @@ class LightProbeHelper extends Mesh {
 
 		super( geometry, material );
 
+		/**
+		 * The light probe to visualize.
+		 *
+		 * @type {LightProbe}
+		 */
 		this.lightProbe = lightProbe;
+
+		/**
+		 * The size of the helper.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.size = size;
 		this.type = 'LightProbeHelper';
 
@@ -107,6 +138,10 @@ class LightProbeHelper extends Mesh {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/LightProbeHelperGPU.js

@@ -5,8 +5,28 @@ import {
 } from 'three';
 import { float, Fn, getShIrradianceAt, normalWorld, uniformArray, uniform, vec4 } from 'three/tsl';
 
+/**
+ * Renders a sphere to visualize a light probe in the scene.
+ *
+ * This helper can only be used with {@link WebGPURenderer}.
+ * When using {@link WebGLRenderer}, import from `LightProbeHelper.js`.
+ *
+ * ```js
+ * const helper = new LightProbeHelper( lightProbe );
+ * scene.add( helper );
+ * ```
+ *
+ * @private
+ * @augments Mesh
+ */
 class LightProbeHelper extends Mesh {
 
+	/**
+	 * Constructs a new light probe helper.
+	 *
+	 * @param {LightProbe} lightProbe - The light probe to visualize.
+	 * @param {number} [size=1] - The size of the helper.
+	 */
 	constructor( lightProbe, size = 1 ) {
 
 		const sh = uniformArray( lightProbe.sh.coefficients );
@@ -31,7 +51,19 @@ class LightProbeHelper extends Mesh {
 
 		super( geometry, material );
 
+		/**
+		 * The light probe to visualize.
+		 *
+		 * @type {LightProbe}
+		 */
 		this.lightProbe = lightProbe;
+
+		/**
+		 * The size of the helper.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.size = size;
 		this.type = 'LightProbeHelper';
 
@@ -42,6 +74,10 @@ class LightProbeHelper extends Mesh {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/OctreeHelper.js

@@ -5,13 +5,40 @@ import {
 	LineBasicMaterial
 } from 'three';
 
+/**
+ * A helper for visualizing an Octree.
+ *
+ * ```js
+ * const helper = new OctreeHelper( octree );
+ * scene.add( helper );
+ * ```
+ *
+ * @augments LineSegments
+ */
 class OctreeHelper extends LineSegments {
 
+	/**
+	 * Constructs a new Octree helper.
+	 *
+	 * @param {Octree} octree - The octree to visualize.
+	 * @param {number|Color|string} [color=0xffff00] - The helper's color.
+	 */
 	constructor( octree, color = 0xffff00 ) {
 
 		super( new BufferGeometry(), new LineBasicMaterial( { color: color, toneMapped: false } ) );
 
+		/**
+		 * The octree to visualize.
+		 *
+		 * @type {Octree}
+		 */
 		this.octree = octree;
+
+		/**
+		 * The helper's color.
+		 *
+		 * @type {number|Color|string}
+		 */
 		this.color = color;
 
 		this.type = 'OctreeHelper';
@@ -20,6 +47,10 @@ class OctreeHelper extends LineSegments {
 
 	}
 
+	/**
+	 * Updates the helper. This method must be called whenever the Octree's
+	 * structure is changed.
+	 */
 	update() {
 
 		const vertices = [];
@@ -61,6 +92,10 @@ class OctreeHelper extends LineSegments {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/PositionalAudioHelper.js

@@ -6,8 +6,32 @@ import {
 	MathUtils
 } from 'three';
 
+/**
+ * This helper displays the directional cone of a positional audio.
+ *
+ * `PositionalAudioHelper` must be added as a child of the positional audio.
+ *
+ * ```js
+ * const positionalAudio = new THREE.PositionalAudio( listener );
+ * positionalAudio.setDirectionalCone( 180, 230, 0.1 );
+ * scene.add( positionalAudio );
+ *
+ * const helper = new PositionalAudioHelper( positionalAudio );
+ * positionalAudio.add( helper );
+ * ```
+ *
+ * @augments Line
+ */
 class PositionalAudioHelper extends Line {
 
+	/**
+	 * Constructs a new positional audio helper.
+	 *
+	 * @param {PositionalAudio} audio - The audio to visualize.
+	 * @param {number} [range=1] - The range of the directional cone.
+	 * @param {number} [divisionsInnerAngle=16] - The number of divisions of the inner part of the directional cone.
+	 * @param {number} [divisionsOuterAngle=2] The number of divisions of the outer part of the directional cone.
+	 */
 	constructor( audio, range = 1, divisionsInnerAngle = 16, divisionsOuterAngle = 2 ) {
 
 		const geometry = new BufferGeometry();
@@ -20,16 +44,47 @@ class PositionalAudioHelper extends Line {
 
 		super( geometry, [ materialOuterAngle, materialInnerAngle ] );
 
+		/**
+		 * The audio to visualize.
+		 *
+		 * @type {PositionalAudio}
+		 */
 		this.audio = audio;
+
+		/**
+		 * The range of the directional cone.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.range = range;
+
+		/**
+		 * The number of divisions of the inner part of the directional cone.
+		 *
+		 * @type {number}
+		 * @default 16
+		 */
 		this.divisionsInnerAngle = divisionsInnerAngle;
+
+		/**
+		 * The number of divisions of the outer part of the directional cone.
+		 *
+		 * @type {number}
+		 * @default 2
+		 */
 		this.divisionsOuterAngle = divisionsOuterAngle;
+
 		this.type = 'PositionalAudioHelper';
 
 		this.update();
 
 	}
 
+	/**
+	 * Updates the helper. This method must be called whenever the directional cone
+	 * of the positional audio is changed.
+	 */
 	update() {
 
 		const audio = this.audio;
@@ -95,6 +150,10 @@ class PositionalAudioHelper extends Line {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/RectAreaLightHelper.js

@@ -9,11 +9,27 @@ import {
 } from 'three';
 
 /**
- *  This helper must be added as a child of the light
+ * Creates a visual aid for rect area lights.
+ *
+ * `RectAreaLightHelper` must be added as a child of the light.
+ *
+ * ```js
+ * const light = new THREE.RectAreaLight( 0xffffbb, 1.0, 5, 5 );
+ * const helper = new RectAreaLightHelper( light );
+ * light.add( helper );
+ * ```
+ *
+ * @augments Line
  */
-
 class RectAreaLightHelper extends Line {
 
+	/**
+	 * Constructs a new rect area light helper.
+	 *
+	 * @param {RectAreaLight} light - The light to visualize.
+	 * @param {number|Color|string} [color] - The helper's color.
+	 * If this is not the set, the helper will take the color of the light.
+	 */
 	constructor( light, color ) {
 
 		const positions = [ 1, 1, 0, - 1, 1, 0, - 1, - 1, 0, 1, - 1, 0, 1, 1, 0 ];
@@ -26,8 +42,20 @@ class RectAreaLightHelper extends Line {
 
 		super( geometry, material );
 
+		/**
+		 * The light to visualize.
+		 *
+		 * @type {RectAreaLight}
+		 */
 		this.light = light;
-		this.color = color; // optional hardwired color for the helper
+
+		/**
+		 * The helper's color. If `undefined`, the helper will take the color of the light.
+		 *
+		 * @type {number|Color|string|undefined}
+		 */
+		this.color = color;
+
 		this.type = 'RectAreaLightHelper';
 
 		//
@@ -71,6 +99,10 @@ class RectAreaLightHelper extends Line {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/TextureHelper.js

@@ -9,8 +9,26 @@ import {
 } from 'three';
 import { mergeGeometries } from '../utils/BufferGeometryUtils.js';
 
+/**
+ * A helper that can be used to display any type of texture for
+ * debugging purposes. Depending on the type of texture (2D, 3D, Array),
+ * the helper becomes a plane or box mesh.
+ *
+ * This helper can only be used with {@link WebGLRenderer}.
+ * When using {@link WebGPURenderer}, import from `TextureHelperGPU.js`.
+ *
+ * @augments Mesh
+ */
 class TextureHelper extends Mesh {
 
+	/**
+	 * Constructs a new texture helper.
+	 *
+	 * @param {Texture} texture - The texture to visualize.
+	 * @param {number} [width=1] - The helper's width.
+	 * @param {number} [height=1] - The helper's height.
+	 * @param {number} [depth=1] - The helper's depth.
+	 */
 	constructor( texture, width = 1, height = 1, depth = 1 ) {
 
 		const material = new ShaderMaterial( {
@@ -81,11 +99,20 @@ class TextureHelper extends Mesh {
 
 		super( geometry, material );
 
+		/**
+		 * The texture to visualize.
+		 *
+		 * @type {Texture}
+		 */
 		this.texture = texture;
 		this.type = 'TextureHelper';
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/TextureHelperGPU.js

@@ -10,8 +10,27 @@ import {
 import { texture as textureNode, cubeTexture, texture3D, float, vec4, attribute } from 'three/tsl';
 import { mergeGeometries } from '../utils/BufferGeometryUtils.js';
 
+/**
+ * A helper that can be used to display any type of texture for
+ * debugging purposes. Depending on the type of texture (2D, 3D, Array),
+ * the helper becomes a plane or box mesh.
+ *
+ * This helper can only be used with {@link WebGPURenderer}.
+ * When using {@link WebGLRenderer}, import from `TextureHelper.js`.
+ *
+ * @private
+ * @augments Mesh
+ */
 class TextureHelper extends Mesh {
 
+	/**
+	 * Constructs a new texture helper.
+	 *
+	 * @param {Texture} texture - The texture to visualize.
+	 * @param {number} [width=1] - The helper's width.
+	 * @param {number} [height=1] - The helper's height.
+	 * @param {number} [depth=1] - The helper's depth.
+	 */
 	constructor( texture, width = 1, height = 1, depth = 1 ) {
 
 		const material = new NodeMaterial();
@@ -51,11 +70,20 @@ class TextureHelper extends Mesh {
 
 		super( geometry, material );
 
+		/**
+		 * The texture to visualize.
+		 *
+		 * @type {Texture}
+		 */
 		this.texture = texture;
 		this.type = 'TextureHelper';
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/VertexNormalsHelper.js

@@ -11,8 +11,32 @@ const _v1 = new Vector3();
 const _v2 = new Vector3();
 const _normalMatrix = new Matrix3();
 
+/**
+ * Visualizes an object's vertex normals.
+ *
+ * Requires that normals have been specified in the geometry as a buffer attribute or
+ * have been calculated using {@link BufferGeometry#computeVertexNormals}.
+ * ```js
+ * const geometry = new THREE.BoxGeometry( 10, 10, 10, 2, 2, 2 );
+ * const material = new THREE.MeshStandardMaterial();
+ * const mesh = new THREE.Mesh( geometry, material );
+ * scene.add( mesh );
+ *
+ * const helper = new VertexNormalsHelper( mesh, 1, 0xff0000 );
+ * scene.add( helper );
+ * ```
+ *
+ * @augments LineSegments
+ */
 class VertexNormalsHelper extends LineSegments {
 
+	/**
+	 * Constructs a new vertex normals helper.
+	 *
+	 * @param {Object3D} object - The object for which to visualize vertex normals.
+	 * @param {number} [size=1] - The helper's size.
+	 * @param {number|Color|string} [color=0xff0000] - The helper's color.
+	 */
 	constructor( object, size = 1, color = 0xff0000 ) {
 
 		const geometry = new BufferGeometry();
@@ -24,20 +48,48 @@ class VertexNormalsHelper extends LineSegments {
 
 		super( geometry, new LineBasicMaterial( { color, toneMapped: false } ) );
 
+		/**
+		 * The object for which to visualize vertex normals.
+		 *
+		 * @type {Object3D}
+		 */
 		this.object = object;
+
+		/**
+		 * The helper's size.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.size = size;
-		this.type = 'VertexNormalsHelper';
 
-		//
+		this.type = 'VertexNormalsHelper';
 
+		/**
+		 * Overwritten and set to `false` since the object's world transformation
+		 * is encoded in the helper's geometry data.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.matrixAutoUpdate = false;
 
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
 		this.isVertexNormalsHelper = true;
 
 		this.update();
 
 	}
 
+	/**
+	 * Updates the vertex normals preview based on the object's world transform.
+	 */
 	update() {
 
 		this.object.updateMatrixWorld( true );
@@ -86,6 +138,10 @@ class VertexNormalsHelper extends LineSegments {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/VertexTangentsHelper.js

@@ -9,8 +9,27 @@ import {
 const _v1 = new Vector3();
 const _v2 = new Vector3();
 
+/**
+ * Visualizes an object's vertex tangents.
+ *
+ * Requires that tangents have been specified in the geometry as a buffer attribute or
+ * have been calculated using {@link BufferGeometry#computeTangents}.
+ * ```js
+ * const helper = new VertexTangentsHelper( mesh, 1, 0xff0000 );
+ * scene.add( helper );
+ * ```
+ *
+ * @augments LineSegments
+ */
 class VertexTangentsHelper extends LineSegments {
 
+	/**
+	 * Constructs a new vertex tangents helper.
+	 *
+	 * @param {Object3D} object - The object for which to visualize vertex tangents.
+	 * @param {number} [size=1] - The helper's size.
+	 * @param {number|Color|string} [color=0xff0000] - The helper's color.
+	 */
 	constructor( object, size = 1, color = 0x00ffff ) {
 
 		const geometry = new BufferGeometry();
@@ -22,18 +41,39 @@ class VertexTangentsHelper extends LineSegments {
 
 		super( geometry, new LineBasicMaterial( { color, toneMapped: false } ) );
 
+		/**
+		 * The object for which to visualize vertex tangents.
+		 *
+		 * @type {Object3D}
+		 */
 		this.object = object;
+
+		/**
+		 * The helper's size.
+		 *
+		 * @type {number}
+		 * @default 1
+		 */
 		this.size = size;
-		this.type = 'VertexTangentsHelper';
 
-		//
+		this.type = 'VertexTangentsHelper';
 
+		/**
+		 * Overwritten and set to `false` since the object's world transformation
+		 * is encoded in the helper's geometry data.
+		 *
+		 * @type {boolean}
+		 * @default false
+		 */
 		this.matrixAutoUpdate = false;
 
 		this.update();
 
 	}
 
+	/**
+	 * Updates the vertex normals preview based on the object's world transform.
+	 */
 	update() {
 
 		this.object.updateMatrixWorld( true );
@@ -76,6 +116,10 @@ class VertexTangentsHelper extends LineSegments {
 
 	}
 
+	/**
+	 * Frees the GPU-related resources allocated by this instance. Call this
+	 * method whenever this instance is no longer used in your app.
+	 */
 	dispose() {
 
 		this.geometry.dispose();

examples/jsm/helpers/ViewHelper.js

@@ -17,15 +17,51 @@ import {
 	Vector4
 } from 'three';
 
+/**
+ * A special type of helper that visualizes the camera's transformation
+ * in a small viewport area as an axes helper. Such a helper is often wanted
+ * in 3D modeling tools or scene editors like the [three.js editor]{@link https://threejs.org/editor}.
+ *
+ * The helper allows to click on the X, Y and Z axes which animates the camera
+ * so it looks along the selected axis.
+ *
+ * @augments Object3D
+ */
 class ViewHelper extends Object3D {
 
+	/**
+	 * Constructs a new view helper.
+	 *
+	 * @param {Camera} camera - The camera whose transformation should be visualized.
+	 * @param {HTMLDOMElement} [domElement] - The DOM element that is used to render the view.
+	 */
 	constructor( camera, domElement ) {
 
 		super();
 
+		/**
+		 * This flag can be used for type testing.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default true
+		 */
 		this.isViewHelper = true;
 
+		/**
+		 * Whether the helper is currently animating or not.
+		 *
+		 * @type {boolean}
+		 * @readonly
+		 * @default false
+		 */
 		this.animating = false;
+
+		/**
+		 * The helper's center point.
+		 *
+		 * @type {Vector3}
+		 */
 		this.center = new Vector3();
 
 		const color1 = new Color( '#ff4466' );
@@ -104,6 +140,12 @@ class ViewHelper extends Object3D {
 		const dim = 128;
 		const turnRate = 2 * Math.PI; // turn rate in angles per second
 
+		/**
+		 * Renders the helper in a separate view in the bottom-right corner
+		 * of the viewport.
+		 *
+		 * @param {WebgLRenderer|Renderer} renderer - The renderer.
+		 */
 		this.render = function ( renderer ) {
 
 			this.quaternion.copy( camera.quaternion ).invert();
@@ -135,6 +177,13 @@ class ViewHelper extends Object3D {
 		const viewport = new Vector4();
 		let radius = 0;
 
+		/**
+		 * This method should be called when a click or pointer event
+		 * has happened in the app.
+		 *
+		 * @param {Event} event - The event to process.
+		 * @return {boolean} Whether an intersection with the helper has been detected or not.
+		 */
 		this.handleClick = function ( event ) {
 
 			if ( this.animating === true ) return false;
@@ -168,6 +217,13 @@ class ViewHelper extends Object3D {
 
 		};
 
+		/**
+		 * Sets labels for each axis. By default, they are unlabeled.
+		 *
+		 * @param {string|undefined} labelX - The label for the x-axis.
+		 * @param {string|undefined} labelY - The label for the y-axis.
+		 * @param {string|undefined} labelZ - The label for the z-axis.
+		 */
 		this.setLabels = function ( labelX, labelY, labelZ ) {
 
 			options.labelX = labelX;
@@ -178,6 +234,13 @@ class ViewHelper extends Object3D {
 
 		};
 
+		/**
+		 * Sets the label style. Has no effect when the axes are unlabeled.
+		 *
+		 * @param {string} [font='24px Arial'] - The label font.
+		 * @param {string} [color='#000000'] - The label color.
+		 * @param {number} [radius=14] - The label radius.
+		 */
 		this.setLabelStyle = function ( font, color, radius ) {
 
 			options.font = font;
@@ -188,6 +251,12 @@ class ViewHelper extends Object3D {
 
 		};
 
+		/**
+		 * Updates the helper. This method should be called in the app's animation
+		 * loop.
+		 *
+		 * @param {number} delta - The delta time in seconds.
+		 */
 		this.update = function ( delta ) {
 
 			const step = delta * turnRate;
@@ -209,6 +278,10 @@ class ViewHelper extends Object3D {
 
 		};
 
+		/**
+		 * Frees the GPU-related resources allocated by this instance. Call this
+		 * method whenever this instance is no longer used in your app.
+		 */
 		this.dispose = function () {
 
 			geometry.dispose();

src/extras/PMREMGenerator.js

@@ -73,12 +73,16 @@ const _origin = /*@__PURE__*/ new Vector3();
  * higher roughness levels. In this way we maintain resolution to smoothly
  * interpolate diffuse lighting while limiting sampling computation.
  *
- * Paper: Fast, Accurate Image-Based Lighting
- * https://drive.google.com/file/d/15y8r_UpKlU9SvV4ILb0C3qCPecS8pvLz/view
+ * Paper: Fast, Accurate Image-Based Lighting:
+ * {@link https://drive.google.com/file/d/15y8r_UpKlU9SvV4ILb0C3qCPecS8pvLz/view}
 */
-
 class PMREMGenerator {
 
+	/**
+	 * Constructs a new PMREM generator.
+	 *
+	 * @param {WebGLRenderer} renderer - The renderer.
+	 */
 	constructor( renderer ) {
 
 		this._renderer = renderer;
@@ -104,12 +108,14 @@ class PMREMGenerator {
 	 * in radians to be applied to the scene before PMREM generation. Optional near
 	 * and far planes ensure the scene is rendered in its entirety.
 	 *
-	 * @param {Scene} scene
-	 * @param {number} sigma
-	 * @param {number} near
-	 * @param {number} far
-	 * @param {Object} [options={}]
-	 * @return {WebGLRenderTarget}
+	 * @param {Scene} scene - The scene to be captured.
+	 * @param {number} [sigma=0] - The blur radius in radians.
+	 * @param {number} [near=0.1] - The near plane distance.
+	 * @param {number} [far=100] - The far plane distance.
+	 * @param {Object} [options={}] - The configuration options.
+	 * @param {number} [options.size=256] - The texture size of the PMREM.
+	 * @param {Vector3} [options.renderTarget=origin] - The position of the internal cube camera that renders the scene.
+	 * @return {WebGLRenderTarget} The resulting PMREM.
 	 */
 	fromScene( scene, sigma = 0, near = 0.1, far = 100, options = {} ) {
 
@@ -149,11 +155,10 @@ class PMREMGenerator {
 	 * Generates a PMREM from an equirectangular texture, which can be either LDR
 	 * or HDR. The ideal input image size is 1k (1024 x 512),
 	 * as this matches best with the 256 x 256 cubemap output.
-	 * The smallest supported equirectangular image size is 64 x 32.
 	 *
-	 * @param {Texture} equirectangular
-	 * @param {?WebGLRenderTarget} [renderTarget=null] - Optional render target.
-	 * @return {WebGLRenderTarget}
+	 * @param {Texture} equirectangular - The equirectangular texture to be converted.
+	 * @param {?WebGLRenderTarget} [renderTarget=null] - The render target to use.
+	 * @return {WebGLRenderTarget} The resulting PMREM.
 	 */
 	fromEquirectangular( equirectangular, renderTarget = null ) {
 
@@ -165,11 +170,10 @@ class PMREMGenerator {
 	 * Generates a PMREM from an cubemap texture, which can be either LDR
 	 * or HDR. The ideal input cube size is 256 x 256,
 	 * as this matches best with the 256 x 256 cubemap output.
-	 * The smallest supported cube size is 16 x 16.
 	 *
-	 * @param {Texture} cubemap
-	 * @param {null} [renderTarget=null] - Optional render target.
-	 * @return {WebGLRenderTarget}
+	 * @param {Texture} cubemap - The cubemap texture to be converted.
+	 * @param {?WebGLRenderTarget} [renderTarget=null] - The render target to use.
+	 * @return {WebGLRenderTarget} The resulting PMREM.
 	 */
 	fromCubemap( cubemap, renderTarget = null ) {
 
@@ -492,6 +496,7 @@ class PMREMGenerator {
 	 * the poles) to approximate the orthogonally-separable blur. It is least
 	 * accurate at the poles, but still does a decent job.
 	 *
+	 * @private
 	 * @param {WebGLRenderTarget} cubeUVRenderTarget
 	 * @param {number} lodIn
 	 * @param {number} lodOut

src/renderers/common/extras/PMREMGenerator.js

@@ -100,6 +100,11 @@ const _outputDirection = /*@__PURE__*/ vec3( _direction.x, _direction.y, _direct
 */
 class PMREMGenerator {
 
+	/**
+	 * Constructs a new PMREM generator.
+	 *
+	 * @param {Renderer} renderer - The renderer.
+	 */
 	constructor( renderer ) {
 
 		this._renderer = renderer;
@@ -641,6 +646,7 @@ class PMREMGenerator {
 	 * the poles) to approximate the orthogonally-separable blur. It is least
 	 * accurate at the poles, but still does a decent job.
 	 *
+	 * @private
 	 * @param {RenderTarget} cubeUVRenderTarget - The cubemap render target.
 	 * @param {number} lodIn - The input level-of-detail.
 	 * @param {number} lodOut - The output level-of-detail.

utils/docs/jsdoc.config.json

@@ -16,12 +16,17 @@
             "examples/jsm/capabilities",
             "examples/jsm/controls",
             "examples/jsm/curves",
+            "examples/jsm/effects",
             "examples/jsm/environments",
+            "examples/jsm/exporters",
+            "examples/jsm/helpers",
             "examples/jsm/tsl",
             "src"
         ],
         "exclude": [
-            "src/extras/PMREMGenerator.js"
+            "src/renderers/common/extras/PMREMGenerator.js",
+            "examples/jsm/helpers/LightProbeHelperGPU.js",
+            "examples/jsm/helpers/TextureHelperGPU.js"
         ]
     }
 }