Three.js DirectionalLightHelper 当光连接到相机时答案

【问题标题】：Three.js DirectionalLightHelper when light is attached to cameraThree.js DirectionalLightHelper 当光连接到相机时
【发布时间】：2016-01-02 04:38:45
【问题描述】：

当我的定向灯连接到相机时，我正在尝试使用 DirectionalLightHelper。我将灯光附加到相机上，以便在使用 TrackballControls 时模拟场景旋转。

var directionalLight = new THREE.DirectionalLight( 0xffffff, 1.5 ); 
directionalLight.position.set( 100, 100, 0 ); 

camera.add( directionalLight );

directionalLightHelper = new THREE.DirectionalLightHelper(directionalLight, 50); 
camera.add( directionalLightHelper);

但是，这并没有给我预期的结果。如果我使用 TrackballControls 稍微移动相机，我最终会“找到”助手渲染的光平面和目标线，但它们不在正确的位置。我希望飞机以 0,0,0 为中心，面向光源，而线将从 100,100,0 到 0,0,0。我在这里误解了什么，还是在使用连接到相机的灯的助手时我需要做更多的事情？

【问题讨论】：

标签： 3d camera three.js light

【解决方案1】：

只需将灯光助手添加到场景，而不是相机。

【讨论】：

这仍然不适合我。光平面现在要大得多，但仍然漂浮在某个地方，似乎是随机的。我发现似乎将所有内容都放在正确位置的唯一一件事是在 DirectionalLightHelper.js 中注释掉以下行： this.matrix = light.matrixWorld;不知道为什么会这样？

【解决方案2】：

确保灯光跟随相机坐标，而不是世界坐标。

【讨论】：

可以是评论。

【解决方案3】：

在将 directionalLight 连接到相机时，我也遇到了这个问题。我不得不将我的 directionalLightHelper 附加到相机上，而不是把它附加到场景中。

scene.add(directionalLightHelper);

然后我必须在我的渲染循环中添加以下内容，以便在我的灯光改变位置时正确更新助手。

directionalLight.updateMatrixWorld();
directionalLightHelper.position.setFromMatrixPosition(directionalLight.matrixWorld);
directionalLightHelper.updateMatrix();
directionalLightHelper.update();

编辑：

破帮手的codepen https://codepen.io/briantjacobs/pen/dRNJpw
工作助手的代码笔https://codepen.io/briantjacobs/pen/VWProE

【讨论】：