From d71c3b77f6fa86c128e07267711ac270ddcd10fa Mon Sep 17 00:00:00 2001 From: mrdoob Date: Mon, 29 Dec 2025 18:23:27 +0900 Subject: [PATCH 1/3] Fixed typos. (#32629) --- src/animation/AnimationAction.js | 2 +- src/animation/AnimationClip.js | 2 +- src/animation/KeyframeTrack.js | 2 +- src/math/Vector3.js | 6 +++--- src/nodes/core/Node.js | 2 +- src/renderers/WebGLRenderer.js | 4 ++-- src/textures/Texture.js | 4 ++-- 7 files changed, 11 insertions(+), 11 deletions(-) diff --git a/src/animation/AnimationAction.js b/src/animation/AnimationAction.js index 3a1b6de872a0aa..bae663002e81b7 100644 --- a/src/animation/AnimationAction.js +++ b/src/animation/AnimationAction.js @@ -548,7 +548,7 @@ class AnimationAction { } - // Interna + // Internal _update( time, deltaTime, timeDirection, accuIndex ) { diff --git a/src/animation/AnimationClip.js b/src/animation/AnimationClip.js index 566632c0f7af20..f23cf6c5e233b8 100644 --- a/src/animation/AnimationClip.js +++ b/src/animation/AnimationClip.js @@ -301,7 +301,7 @@ class AnimationClip { * @static * @deprecated since r175. * @param {Object} animation - A serialized animation clip as JSON. - * @param {Array} bones - An array of bones. + * @param {Array} bones - An array of bones. * @return {?AnimationClip} The new animation clip. */ static parseAnimation( animation, bones ) { diff --git a/src/animation/KeyframeTrack.js b/src/animation/KeyframeTrack.js index 56e9b4f5495831..b40d07bb69d2b6 100644 --- a/src/animation/KeyframeTrack.js +++ b/src/animation/KeyframeTrack.js @@ -425,7 +425,7 @@ class KeyframeTrack { * Optimizes this keyframe track by removing equivalent sequential keys (which are * common in morph target sequences). * - * @return {AnimationClip} A reference to this animation clip. + * @return {KeyframeTrack} A reference to this keyframe track. */ optimize() { diff --git a/src/math/Vector3.js b/src/math/Vector3.js index 862abb9f0bf524..fee3a6db5ef445 100644 --- a/src/math/Vector3.js +++ b/src/math/Vector3.js @@ -106,7 +106,7 @@ class Vector3 { } /** - * Sets the vector's x component to the given value + * Sets the vector's x component to the given value. * * @param {number} x - The value to set. * @return {Vector3} A reference to this vector. @@ -120,7 +120,7 @@ class Vector3 { } /** - * Sets the vector's y component to the given value + * Sets the vector's y component to the given value. * * @param {number} y - The value to set. * @return {Vector3} A reference to this vector. @@ -134,7 +134,7 @@ class Vector3 { } /** - * Sets the vector's z component to the given value + * Sets the vector's z component to the given value. * * @param {number} z - The value to set. * @return {Vector3} A reference to this vector. diff --git a/src/nodes/core/Node.js b/src/nodes/core/Node.js index 241ec9d2c4adf1..2c81062219eebd 100644 --- a/src/nodes/core/Node.js +++ b/src/nodes/core/Node.js @@ -132,7 +132,7 @@ class Node extends EventDispatcher { this._cacheKey = null; /** - * The cache key 's version. + * The cache key's version. * * @private * @type {number} diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index ea16241325b482..7de6972f275867 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -149,7 +149,7 @@ class WebGLRenderer { // public properties /** - * A canvas where the renderer draws its output.This is automatically created by the renderer + * A canvas where the renderer draws its output. This is automatically created by the renderer * in the constructor (if not provided already); you just need to add it to your page like so: * ```js * document.body.appendChild( renderer.domElement ); @@ -165,7 +165,7 @@ class WebGLRenderer { * - `checkShaderErrors`: If it is `true`, defines whether material shader programs are * checked for errors during compilation and linkage process. It may be useful to disable * this check in production for performance gain. It is strongly recommended to keep these - * checks enabled during development. If the shader does not compile and link - it will not + * checks enabled during development. If the shader does not compile and link, it will not * work and associated material will not render. * - `onShaderError(gl, program, glVertexShader,glFragmentShader)`: A callback function that * can be used for custom error reporting. The callback receives the WebGL context, an instance diff --git a/src/textures/Texture.js b/src/textures/Texture.js index 9fe70166f2e6a7..9b5937c5920087 100644 --- a/src/textures/Texture.js +++ b/src/textures/Texture.js @@ -68,7 +68,7 @@ class Texture extends EventDispatcher { Object.defineProperty( this, 'id', { value: _textureId ++ } ); /** - * The UUID of the material. + * The UUID of the texture. * * @type {string} * @readonly @@ -76,7 +76,7 @@ class Texture extends EventDispatcher { this.uuid = generateUUID(); /** - * The name of the material. + * The name of the texture. * * @type {string} */ From 62749d5c264b604e8b128db4f9b91f3b9c3db5a1 Mon Sep 17 00:00:00 2001 From: satelllte <20585619+satelllte@users.noreply.github.com> Date: Mon, 29 Dec 2025 11:25:02 +0200 Subject: [PATCH 2/3] Docs: Frame-rate independent cube rotation example (#32627) --- manual/en/creating-a-scene.html | 14 +++++++------- manual/fr/creating-a-scene.html | 16 ++++++++-------- 2 files changed, 15 insertions(+), 15 deletions(-) diff --git a/manual/en/creating-a-scene.html b/manual/en/creating-a-scene.html index 7d9cd480465957..443480ab48eddb 100644 --- a/manual/en/creating-a-scene.html +++ b/manual/en/creating-a-scene.html @@ -92,7 +92,7 @@

Rendering the scene

If you copied the code from above into the main.js file we created earlier, you wouldn't be able to see anything. This is because we're not actually rendering anything yet. For that, we need what's called a render or animation loop.

-function animate() {
+function animate( time ) {
   renderer.render( scene, camera );
 }
 renderer.setAnimationLoop( animate );
@@ -107,8 +107,8 @@ 

Animating the cube

Add the following code right above the `renderer.render` call in your `animate` function:

-cube.rotation.x += 0.01;
-cube.rotation.y += 0.01;
+cube.rotation.x = time / 2000;
+cube.rotation.y = time / 1000;
 

This will be run every frame (normally 60 times per second), and give the cube a nice rotation animation. Basically, anything you want to move or change while the app is running has to go through the animation loop. You can of course call other functions from there, so that you don't end up with an `animate` function that's hundreds of lines.

@@ -116,7 +116,7 @@

Animating the cube

The result

Congratulations! You have now completed your first three.js application. It's simple, but you have to start somewhere.

-

The full code is available below and as an editable [link:https://jsfiddle.net/tswh48fL/ live example]. Play around with it to get a better understanding of how it works.

+

The full code is available below and as an editable [link:https://jsfiddle.net/zycqb61k/ live example]. Play around with it to get a better understanding of how it works.

index.html —

@@ -156,10 +156,10 @@

The result

camera.position.z = 5; -function animate() { +function animate( time ) { - cube.rotation.x += 0.01; - cube.rotation.y += 0.01; + cube.rotation.x = time / 2000; + cube.rotation.y = time / 1000; renderer.render( scene, camera ); diff --git a/manual/fr/creating-a-scene.html b/manual/fr/creating-a-scene.html index c5b71c40a9d085..53686a7267e264 100644 --- a/manual/fr/creating-a-scene.html +++ b/manual/fr/creating-a-scene.html @@ -92,7 +92,7 @@

Afficher la scène

Si vous copiez le code ci-dessus dans le fichier main.js que nous avons créé précédemment, vous ne pourrez rien voir. C'est parce que nous n'affichons encore rien. Pour cela, nous avons besoin de ce qu'on appelle une boucle de rendu ou d'animation.

-function animate() {
+function animate( time ) {
   renderer.render( scene, camera );
 }
 renderer.setAnimationLoop( animate );
@@ -107,8 +107,8 @@ 

Animer le cube

Ajoutez le code suivant juste au-dessus de l'appel `renderer.render` dans votre fonction `animate` :

-cube.rotation.x += 0.01;
-cube.rotation.y += 0.01;
+cube.rotation.x = time / 2000;
+cube.rotation.y = time / 1000;
 

Cela sera exécuté à chaque image (normalement 60 fois par seconde) et donnera au cube une belle animation de rotation. En gros, tout ce que vous voulez déplacer ou modifier pendant que l'application est en cours d'exécution doit passer par la boucle d'animation. Vous pouvez bien sûr appeler d'autres fonctions à partir de là, afin de ne pas vous retrouver avec une fonction `animate` de plusieurs centaines de lignes.

@@ -116,7 +116,7 @@

Animer le cube

Le résultat

Félicitations ! Vous avez maintenant terminé votre première application three.js. C'est simple, mais il faut bien commencer quelque part.

-

Le code complet est disponible ci-dessous et sous forme d'un [link:https://jsfiddle.net/tswh48fL/ exemple live] modifiable. Jouez avec pour mieux comprendre comment cela fonctionne.

+

Le code complet est disponible ci-dessous et sous forme d'un [link:https://jsfiddle.net/zycqb61k/ exemple live] modifiable. Jouez avec pour mieux comprendre comment cela fonctionne.

index.html —

@@ -156,10 +156,10 @@

Le résultat

camera.position.z = 5; -function animate() { +function animate( time ) { - cube.rotation.x += 0.01; - cube.rotation.y += 0.01; + cube.rotation.x = time / 2000; + cube.rotation.y = time / 1000; renderer.render( scene, camera ); @@ -176,4 +176,4 @@

Le résultat

- \ No newline at end of file + From d8e70a4cd14b9b6a9b87cea4d0e8ed308ed0e04c Mon Sep 17 00:00:00 2001 From: mrdoob Date: Mon, 29 Dec 2025 19:37:00 +0900 Subject: [PATCH 3/3] Fixed typos in /examples/jsm folder. (#32631) --- examples/jsm/animation/CCDIKSolver.js | 4 ++-- examples/jsm/controls/ArcballControls.js | 6 +++--- examples/jsm/loaders/GLTFLoader.js | 4 ++-- examples/jsm/postprocessing/RenderTransitionPass.js | 2 +- examples/jsm/renderers/CSS3DRenderer.js | 2 +- examples/jsm/renderers/SVGRenderer.js | 4 ++-- 6 files changed, 11 insertions(+), 11 deletions(-) diff --git a/examples/jsm/animation/CCDIKSolver.js b/examples/jsm/animation/CCDIKSolver.js index 5ea11161d14e86..c29169a456eb13 100644 --- a/examples/jsm/animation/CCDIKSolver.js +++ b/examples/jsm/animation/CCDIKSolver.js @@ -50,7 +50,7 @@ class CCDIKSolver { /** * The IK objects. * - * @type {SkinnedMesh} + * @type {Array} */ this.iks = iks; @@ -357,7 +357,7 @@ class CCDIKHelper extends Object3D { /** * The helpers sphere geometry. * - * @type {SkinnedMesh} + * @type {SphereGeometry} */ this.sphereGeometry = new SphereGeometry( sphereSize, 16, 8 ); diff --git a/examples/jsm/controls/ArcballControls.js b/examples/jsm/controls/ArcballControls.js index 94cb5b4453ad07..d427d75f4980a9 100644 --- a/examples/jsm/controls/ArcballControls.js +++ b/examples/jsm/controls/ArcballControls.js @@ -98,9 +98,9 @@ const _EPS = 0.000001; * consistent camera movements. Dragging cursor/fingers will cause camera to orbit around the center of the trackball in a conservative * way (returning to the starting point will make the camera return to its starting orientation). * - * In addition to supporting pan, zoom and pinch gestures, Arcball controls provide focus< functionality with a double click/tap for intuitively - * moving the object's point of interest in the center of the virtual trackball. Focus allows a much better inspection and navigation in complex - * environment. Moreover Arcball controls allow FOV manipulation (in a vertigo-style method) and z-rotation. Saving and restoring of Camera State + * In addition to supporting pan, zoom and pinch gestures, double clicking/tapping focuses on a point, intuitively moving the object's + * point of interest to the center of the virtual trackball. Focus allows a much better inspection and navigation in complex environment. + * Moreover Arcball controls allow FOV manipulation (in a vertigo-style method) and z-rotation. Saving and restoring of Camera State * is supported also through clipboard (use ctrl+c and ctrl+v shortcuts for copy and paste the state). * * Unlike {@link OrbitControls} and {@link TrackballControls}, `ArcballControls` doesn't require `update()` to be called externally in an diff --git a/examples/jsm/loaders/GLTFLoader.js b/examples/jsm/loaders/GLTFLoader.js index 5f7b268b15db3a..cf2d7c3c90e6b2 100644 --- a/examples/jsm/loaders/GLTFLoader.js +++ b/examples/jsm/loaders/GLTFLoader.js @@ -71,7 +71,7 @@ import { clone } from '../utils/SkeletonUtils.js'; /** * A loader for the glTF 2.0 format. * - * [glTF](https://www.khronos.org/gltf/} (GL Transmission Format) is an [open format specification]{@link https://github.com/KhronosGroup/glTF/tree/main/specification/2.0) + * [glTF](https://www.khronos.org/gltf/) (GL Transmission Format) is an [open format specification]{@link https://github.com/KhronosGroup/glTF/tree/main/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, @@ -408,7 +408,7 @@ class GLTFLoader extends Loader { } /** - * Parses the given FBX data and returns the resulting group. + * Parses the given glTF data and returns the resulting group. * * @param {string|ArrayBuffer} data - The raw glTF data. * @param {string} path - The URL base path. diff --git a/examples/jsm/postprocessing/RenderTransitionPass.js b/examples/jsm/postprocessing/RenderTransitionPass.js index 4e1535bb9e4026..7008604526e136 100644 --- a/examples/jsm/postprocessing/RenderTransitionPass.js +++ b/examples/jsm/postprocessing/RenderTransitionPass.js @@ -114,7 +114,7 @@ class RenderTransitionPass extends Pass { } /** - * Sets the texture threshold. This value defined how strong the texture effects + * Sets the texture threshold. This value defines how strong the texture effects * the transition. Must be in the range `[0,1]` (0 means full effect, 1 means no effect). * * @param {boolean|number} value - The threshold value. diff --git a/examples/jsm/renderers/CSS3DRenderer.js b/examples/jsm/renderers/CSS3DRenderer.js index d42faa510ff430..93262aab4fa40f 100644 --- a/examples/jsm/renderers/CSS3DRenderer.js +++ b/examples/jsm/renderers/CSS3DRenderer.js @@ -141,7 +141,7 @@ const _matrix2 = new Matrix4(); * This renderer can be used to apply hierarchical 3D transformations to DOM elements * via the CSS3 [transform](https://www.w3schools.com/cssref/css3_pr_transform.asp) property. * `CSS3DRenderer` is particularly interesting if you want to apply 3D effects to a website without - * canvas based rendering. It can also be used in order to combine DOM elements with WebGLcontent. + * canvas based rendering. It can also be used in order to combine DOM elements with WebGL content. * * There are, however, some important limitations: * diff --git a/examples/jsm/renderers/SVGRenderer.js b/examples/jsm/renderers/SVGRenderer.js index 0a6dc836925879..6013aeb3809b16 100644 --- a/examples/jsm/renderers/SVGRenderer.js +++ b/examples/jsm/renderers/SVGRenderer.js @@ -188,8 +188,8 @@ class SVGRenderer { }; /** - * Sets the render quality. Setting to `high` means This value indicates that the browser - * tries to improve the SVG quality over rendering speed and geometric precision. + * Sets the render quality. Setting to `high` makes the browser improve SVG quality + * over rendering speed and geometric precision. * * @param {('low'|'high')} quality - The quality. */