I currently have a scenario where I have a THREE.Scene containing two meshes, namely meshA and meshB. Both of these meshes have been rotated differently. My objective is to take meshB out of the scene and attach it as a child of meshA, while maintaining its global position and rotation unchanged. Essentially, I want the position and rotation of meshB to remain consistent before and after executing this code.
Here is my nearly successful attempt:
var globalOffset = new THREE.Vector3().subVectors( meshB.position, meshA.position );
var localOffset = meshA.worldToLocal( meshB.position );
var rotationOffset = meshA.quaternion.clone().inverse();
var rotation = meshB.quaternion.clone().multiply( rotationOffset );
scene.remove(meshB);
meshA.add(meshB);
meshB.position = localOffset;
meshB.rotation.setFromQuaternion(rotation);
The positioning aspect functions correctly; however, the rotation only stays accurate if both meshA and meshB have been rotated around the same axis. If they were rotated around different axes, then meshB's rotation seems to alter before and after running this code.
Do you have any suggestions on how I can rectify the above code (or perhaps propose an alternative method) so that meshB retains the same "global" rotation even after being removed and re-added to the scene?
Thank you!