TransformControls: How to control the visibility of helper axes?

Questions
1

how to show x-axis(or y,z) for one transformation property and not showing it for other transformation property simultaneously?

2

You can do this by modify the showX, showY and showZ properties.

Live demo: https://jsfiddle.net/kL2unhr9/

3

Thanks, but I have already did this, actually what I want is to disable x-axis for scaling by changing value of showX=false, is there any way that x-axis for translation still remains enabled.

This perfectly happens in blender.

4

How do can you still scale along an axis if it is hidden and thus not selectable?

5

have you seen transformations in blender, in that they are using lock/unlock toggle in that when x-axis is disabled for one property(let’s say scaling) then also transformations are allowed for other properties(translation or rotation). Do we have some way of implementing it in three js.

lockCheckTranslate(axis) {

console.log(transformControl);

if (axis == "x") {

  if (toggleObject.lockPositionX == true || toggleObject.lockPositionX == false && transformControl.showX === false) {

    transformControl.showX = !transformControl.showX;

  }

}

else if (axis == "y") {

  if (toggleObject.lockPositionY == true || toggleObject.lockPositionY == false && transformControl.showY === false) {

    transformControl.showY = !transformControl.showY;

  }

}

else {

  if (toggleObject.lockPositionZ == true || toggleObject.lockPositionZ == false && transformControl.showZ === false) {

    transformControl.showZ = !transformControl.showZ;

  }

}

}

lockCheckScale(axis) {

if (axis == "x") {

  if (toggleObject.lockScaleX == true || toggleObject.lockScaleX == false && transformControl.showX === false) {

    transformControl.showX = !transformControl.showX;

  }

}

else if (axis == "y") {

  if (toggleObject.lockScaleY == true || toggleObject.lockScaleY == false && transformControl.showY === false) {

    transformControl.showY = !transformControl.showY;

  }

}

else {

  if (toggleObject.lockScaleZ == true || toggleObject.lockScaleZ == false && transformControl.showZ === false) {

    transformControl.showZ = !transformControl.showZ;

  }

}

}

lockCheckRotate(axis) {

if (axis == "x") {

  if (toggleObject.lockRotateX == true || toggleObject.lockRotateX == false && transformControl.showX === false) {

    transformControl.showX = !transformControl.showX;

  }

}

else if (axis == "y") {

  if (toggleObject.lockRotateY == true || toggleObject.lockRotateY == false && transformControl.showY === false) {

    transformControl.showY = !transformControl.showY;

  }

}

else {

  if (toggleObject.lockRotateZ == true || toggleObject.lockRotateZ == false && transformControl.showZ === false) {

    transformControl.showZ = !transformControl.showZ;

  }

}

}

I tried using this logic, but results are not proper.
In this I’m using slide toggles for each property and for each axis in that property. toggleObject contains the boolean values of slide toggles

7

is there any way ?

8

TransformControls does not provide this feature out-of-the-box. You have to implement it by yourself.

9

Alright! Thanks