Transform Control Error after Update

🌵 Needle Engine
1

Hello,

I got another error which I really don’t understand and I after update again :

initializeTransformControl(obj) {
    // @ts-ignore
    this.controls = new TransformControls(
      // @ts-ignore
      this.context.mainCamera,
      this.context.renderer.domElement
    );
    this.controls.space = "local";
    this.controls.attach(obj);
    this.context.scene.add(this.controls);

    console.log(this.controls)
    this.controls.matrixAutoUpdate = false
    this.controls.matrix.copy(this.controls.object.matrix)
    

    // Ecouteurs d'événements pour les modifications
    this.controls.addEventListener("dragging-changed", (event) =>
      this.handleDraggingChanged(event)
    );

    const planesToRemove: any = [];
    // Ajouter ces lignes pour masquer les plans de transformation
    this.controls.traverse((child: any) => {
      if (["XY", "XZ", "YZ", "XYZ"].includes(child.name)) {
        planesToRemove.push(child);
      }
    });

    planesToRemove.forEach((plane: any) => {
      plane.parent.remove(plane);
    });
  }

I don’t know why but now, my Transform control (three js one) work but doesn’t follow the mesh now
It’s locked to the origin of my scene, and it wasn’t the case before.
I verify the matrixAutoUpdate, etc but I don’t understand why it doesn’t move.

image.png
image.png481×531 103 KB

Original Post on Discord

by user 224464722878005248

2
  • I tried with the TransformGizmo of Needle, don’t work neither

by user 224464722878005248

3

Here each console.log :
console.log(this.controls.object.position)
console.log(this.controls.position)
=>
{x: 17.101999999999993, y: 2.8489999999999984, z: 17.680999999999994}
{x: 0, y: 0, z: 0}

But the controls doesn’t snap on my object

by user 224464722878005248

4

It snaps when you hold shift.

5

It doesn’t for me :confused:

by user 224464722878005248

6

image.png

by user 224464722878005248

7

That’s weird because when I drag my arrow, it knows the position of the object

by user 224464722878005248

8

this is with our TransformGizmo component
20231124-141320_My_Scene_-_Google_Chrome-logo.mp4

9

someObject.addComponent(TransformGizmo)

10

Here mine :

by user 224464722878005248

11

image.png

by user 224464722878005248

12

It’s the TransformGizmo fo the sphere

by user 224464722878005248

13

const sphere = this.addSphereToPosition(new THREE.Vector3(0, 20, 0), 0x00ff00)
sphere.addComponent(TransformGizmo)

by user 224464722878005248

14

Sorry i dont know what this screenshot tells me or what your code is doing. It works as expected when i add the gizmos (e.g. here to every mesh)
20231124-142245_My_Scene_-_Google_Chrome-logo.mp4

15

It
Animation2.gif

by user 224464722878005248

16

Here my problem

by user 224464722878005248

17

Before the update, it was working like this :
(With current TransformControls from three js)

by user 224464722878005248

18

Animation3.gif

by user 224464722878005248

19

I retried with another scene :

by user 224464722878005248

20

https://cdn.discordapp.com/attachments/1177591464453226576/1177607638746411049/Animation4.gif?ex=65d8a313&is=65c62e13&hm=5ac7c73a111340f54c64f61206873ac8e94f5a256e5d15cd01adf886dcc415a7&(image larger than 4 MB)

by user 224464722878005248