Get object position in a three.js scene dynamically
THREE.TransformControls
requires a few steps to use.
- Create your THREE.TransformControls object
- Add it to your scene
- Attach it to the object you wish to manipulate
var xformControl = new THREE.TransformControls(camera, renderer.domElement);
scene.add(xformControls);
// assuming you add "myObj" to your scene...
xformControl.attach(myObj);
// and then later...
xformControl.detatch();
Attaching the control to an object will insert a manipulation "gizmo" into the scene. Dragging the various parts of the gizmo will perform different kinds of transformations. After you are done transforming the part with the gizmo, checking mesh.position
should reflect the new position.
Additional information for clarity:
The position of the object will not be updated until you use the "gizmo" to move it. Example:
- Your object is in the scene at (10, 10, 10)
xformControl.attach(yourObject)
- The "gizmo" is created at (10, 10, 10)
- Your object remains at (10, 10, 10)
- Use the "gizmo" to translate the object in +Y direction
- Your object will now have an updated position
console.log(yourObject.position.y > 10); // true
I might be too late, but you can get the updated value by using TransformControls' objectChange
event.
Example code:
const transformControls = new TransformControls(camera, renderer.domElement);
transformControls.addEventListener('objectChange', (e) => {
console.log(e.target.object.position.x);
})