CODEWITHSUNDEEP
javascriptthree.js
takeyourcode
takeyourcode

Reputation: 445

threejs How to rotate transformcontrol itself

I'd like to rotate transformcontrol itself when object which attach to transformcontrol is rotate.

Before rotate

enter image description here

After rotate

enter image description here

As image shown, before rotate, cylinder's top direction is z-axis of transformcontrol, however after rotate is not.

I'd like that the transformcontrol's z axis to be always in the upward direction of the cylinder.

Upvotes: 4

Views: 1441

Answers (1)

Cody Bennett
Cody Bennett

Reputation: 786

TransformControls returns an object that you can modify directly.

const controls = new TransformControls(camera, renderer.domElement);
controls.setSpace('local');
controls.rotation.x = Math.PI / -2;

If you want to sync its rotation with your mesh, you can add it as a child of that mesh or use Euler#copy.

mesh.add(controls);

// or manually in a render loop, for example

scene.add(controls);

renderer.setAnimationLoop(() => {
  controls.rotation.copy(mesh.rotation);

  renderer.render(scene, camera);
});

Upvotes: 4

Related Questions