In my current project, I am utilizing three.js to render objects. The setup includes directional lighting and trackball controls. I understand that the light is static while the camera moves with the controls.
However, I want the light to move along with the camera's movement so that the lighting conditions remain constant at every viewpoint. This will create the illusion of the object rotating instead of the camera.
This is what I have implemented:
camera = new THREE.PerspectiveCamera(45, width / height, 0.01, 1000);
camera.position.z = 3;
light = new THREE.DirectionalLight(0xAAAAAA, 1);
light.position = camera.position;
scene.add(light);
Attempts made:
- Exploring various approaches using different types of lighting techniques (though favoring the current one).
- Trying to update the light position within the Render loop, without success.
The result is that the light remains stationary on the opposite side of the object, creating an odd effect. It's expected that since the light's position matches the camera's, it would illuminate from the same direction.
Update:
After adding the following lines:
light.castShadow = true;
light.shadowCameraVisible = true;
I noticed the frames outlining the cast lights. While the light's position changes, the actual illumination does not move accordingly. Is there a setting needed to refresh the light's position?
Any assistance would be greatly appreciated.