How to remove the outer circle in rotation and planes in translation (in transform controls)

Hi, I am using transform controls in order to make my user to rotate and translate objects easily. But in rotation outer circle, and in translation the planes make it complex for my user. Therefore I want to remove them. I want my user to just rotate and translate by axis
how can I do that??
thanks in advance

I’m not proud of this code, but nevertheless, here it is:


More info:

  • change lines 50-51 to select initial mode (translation or rotation)
  • see lines 57-82 how gizmo components are being ‘evaporated’
  • and also, for future reference, have a look at this link
1 Like

thank you very much, It works

1 Like

there are two more questions in this topic about modifying transform controls:

  1. is it possible to get a graphical mirror eg +/-X axis (not mirror coordinates)?
  2. is it possible to hide graphic elements, e.g. axis -X and show only axis +X?

OK, I gave up hours of searching the structure of the transform controls… object to change the look of the arrows;
for me it was easier in this case to clone the TransformControls.js module and actually edit the dimensions of the arrows in the TransformControlsMy.js script :slight_smile:
of course then i changed the connection:

// import { TransformControls } from 'three/addons/controls/TransformControls.js';
import { TransformControls } from 'three/addons/controls/TransformControlsMy.js';