Initialize spring bone

packages/three-vrm/examples/animations.html

@@ -68,6 +68,7 @@
 						currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						prepareAnimation( vrm );
 

packages/three-vrm/examples/basic.html

@@ -70,6 +70,7 @@
 						scene.add( vrm.scene );
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 					} );
 

packages/three-vrm/examples/blendshapes.html

@@ -67,6 +67,7 @@
 						currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						console.log( vrm );
 

packages/three-vrm/examples/bones.html

@@ -67,6 +67,7 @@
 						currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						console.log( vrm );
 

packages/three-vrm/examples/debug.html

@@ -70,6 +70,7 @@
 						scene.add( vrm.scene );
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 					} );
 

packages/three-vrm/examples/dnd.html

@@ -77,6 +77,7 @@
 							scene.add( vrm.scene );
 
 							vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+							vrm.springBoneManager.reset();
 
 							console.log( vrm );
 

packages/three-vrm/examples/encoding.html

@@ -79,6 +79,7 @@
 						scene.add( vrm.scene );
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 					} );
 

packages/three-vrm/examples/envmap.html

@@ -104,6 +104,7 @@
 						scene.add( vrm.scene );
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 					} );
 

packages/three-vrm/examples/firstperson.html

@@ -67,6 +67,7 @@
             currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
             // generate firstperson mesh
             vrm.firstPerson.setup();

packages/three-vrm/examples/lookat-advanced.html

@@ -139,6 +139,7 @@
 						currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						vrm.lookAt.target = camera;
 

packages/three-vrm/examples/lookat.html

@@ -71,6 +71,7 @@
 						currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						vrm.lookAt.target = lookAtTarget;
 

packages/three-vrm/examples/materials-debug.html

@@ -67,6 +67,7 @@
 						currentVrm = vrm;
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						console.log( vrm );
 

packages/three-vrm/examples/meta.html

@@ -80,6 +80,7 @@
 						scene.add( vrm.scene );
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 						// print meta fields
 						Object.keys( vrm.meta ).forEach( ( key ) => {

packages/three-vrm/examples/mouse.html

@@ -64,6 +64,7 @@
 						console.log( vrm );
 
 						vrm.humanoid.getBoneNode( THREE.VRMSchema.HumanoidBoneName.Hips ).rotation.y = Math.PI;
+						vrm.springBoneManager.reset();
 
 					} );
 

packages/three-vrm/src/springbone/VRMSpringBone.ts

@@ -200,6 +200,7 @@ export class VRMSpringBone {
       this._initialLocalChildPosition.copy(firstChild.position);
     }
 
+    // Apply updated position to tail states
     this.bone.localToWorld(this._currentTail.copy(this._initialLocalChildPosition));
     this._prevTail.copy(this._currentTail);
     this._nextTail.copy(this._currentTail);
@@ -241,10 +242,6 @@ export class VRMSpringBone {
   public update(delta: number): void {
     if (delta <= 0) return;
 
-    // 親スプリングボーンの姿勢は常に変化している。
-    // それに基づいて処理直前に自分のworldMatrixを更新しておく
-    this.bone.matrixWorld.multiplyMatrices(this._getParentMatrixWorld(), this.bone.matrix);
-
     if (this.bone.parent) {
       // SpringBoneは親から順に処理されていくため、
       // 親のmatrixWorldは最新状態の前提でworldMatrixからquaternionを取り出す。

packages/three-vrm/src/springbone/VRMSpringBoneManager.ts

@@ -36,14 +36,32 @@ export class VRMSpringBoneManager {
     });
   }
 
+  /**
+   * Update worldMatrix of given object, respecting its ancestors.
+   * called before update springbone.
+   * @param updatedObjectSet Set of node which worldMatrix is updated.
+   * @param node target bone node.
+   */
+  private _updateWorldMatrix(updatedObjectSet: Set<THREE.Object3D>, node: THREE.Object3D): void {
+    if (updatedObjectSet.has(node)) return;
+
+    if (node.parent) this._updateWorldMatrix(updatedObjectSet, node.parent);
+    node.updateWorldMatrix(false, false);
+
+    updatedObjectSet.add(node);
+  }
+
   /**
    * Update every spring bone attached to this manager.
    *
    * @param delta deltaTime
    */
   public lateUpdate(delta: number): void {
+    const updatedObjectSet = new Set<THREE.Object3D>();
+
     this.springBoneGroupList.forEach((springBoneGroup) => {
       springBoneGroup.forEach((springBone) => {
+        this._updateWorldMatrix(updatedObjectSet, springBone.bone);
         springBone.update(delta);
       });
     });
@@ -53,8 +71,11 @@ export class VRMSpringBoneManager {
    * Reset every spring bone attached to this manager.
    */
   public reset(): void {
+    const updatedObjectSet = new Set<THREE.Object3D>();
+
     this.springBoneGroupList.forEach((springBoneGroup) => {
       springBoneGroup.forEach((springBone) => {
+        this._updateWorldMatrix(updatedObjectSet, springBone.bone);
         springBone.reset();
       });
     });