How to control Directional Light Helper with Transform Controls

Hello, I am trying to achieve the same result as shown in the photo
so I am trying to make creat directional light helper and control it with transform controls

 const light_container = new THREE.Object3D(); = "DirectionalLight";
      light_container.lookAt(new THREE.Vector3());

      const directional_light = new THREE.DirectionalLight(0xffffff, 0.5);
      directional_light.position.set(0, 0, 0);

      var helper = new THREE.DirectionalLightHelper(
      helper.position.set(0, 0, 0);

transform_controls.attach(light_container ); 

this is part of my code and it is working not correctly
thank you in advance

Have you considered to use the same approach like in the editor? The respective code is part of the three.js repository.

I could not find that part of the code in the Editor.
I only found the part that you can add Directional Light


this is what I achieve the transform arrow are not line up with the center of the directional light helper

Maybe like so:

Notice that the helper needs to be a child of the scene.

1 Like

thank you :slight_smile: