threejs controls旋转 光源固定不变

今天有个需求，模型预览，打了一组平行光，然后有前视，后视...操作按钮，希望每个面不会因为光照而导致明暗不同，所以只能旋转模型，而不旋转场景，这样也可以，就是鼠标拖动旋转的时候就有问题，所以想到固定光源

假设你已经做好了所有准备，场景中添加了模型，添加了灯光...

一、定义一个全局变量

let lightHolderRef = ref()

二、新建一个Group，灯光添加进去

  var lightHolder = new Three.Group();
  lightHolder.add(directionalLight);
  model.scene.add(lightHolder);//光源
  lightHolderRef.value = lightHolder

三、在控制器渲染函数中设置位置

const animate = () => {
  //更新控制器
  model.controls.update();
  model.renderer.render(model.scene, model.camera);

  lightHolderRef.value.quaternion.copy(model.camera.quaternion);

  requestAnimationFrame(animate);
};

以上就是固定光源的全部操作