角落里的聚光灯 Three.js答案

【问题标题】：Spotlight in corners Three.js角落里的聚光灯 Three.js
【发布时间】：2017-06-30 02:50:22
【问题描述】：

我正在尝试将 PointerLockControls 和聚光灯用作连接到相机的手电筒，但我得到了“不需要的结果”，或者我只是没有找到聚光灯将其光束指向相机的“工作示例”面对拐角时，拐角不在侧面。

可以用一个直线方向的聚光灯来实现，还是我必须从侧面操纵两个不同的灯才能使角落中心的光线或类似的东西？

Illustrative image of current behaviour and wanted result

使用Point SpotLight in same direction as camera three.js (Flashlight)中描述的手电筒示例

function user_box() {
    var group = new THREE.Group();
    group.position.y = 0.001 - 10;
    controls.getObject().add( group );

    bigball = new THREE.Mesh( new THREE.SphereGeometry( 0.3, 16, 16 ), new THREE.MeshBasicMaterial( { color: 0xff0040 } ) );
    group.add(bigball);
    bigball.position.set(0, 10, -5);

    flashlight = new THREE.SpotLight(0xffffff,4,40);
    group.add(flashlight);
    flashlight.position.set(0,10,0);
    flashlight.target = bigball;
}

按照建议添加了演示http://codepen.io/BringerOfTheDawn/pen/LxMbex

【问题讨论】：

很高兴看到您的代码知道如何创建THREE.SpotLight() 的实例以及如何设置其属性（例如jsfiddle）。你也可以看看THREE.SpotLight() documentation
@BringerOfTheDawn flashlight = new THREE.SpotLight( 0xffffff, 1, 1000, Math.PI / 8, 1 ); 进行实验，直到您了解所有参数的用途——这也适用于您的材料。
@WestLangley 我知道它必须是简单的。一开始我玩了这个角度，但是当我偶然发现我的角落时，我只是希望看到类似的东西，因为它是浇在墙上的。您能否发表您的评论作为答案，作为初学者，如果没有这些参数，我发现其他手电筒示例真的令人失望 =)

标签： three.js

【解决方案1】：

您的聚光灯具有广角和短距离。减小角度并增加范围。还可以试验其他参数，以便了解它们的含义。

flashlight = new THREE.SpotLight( 0xffffff, 1, 1000, Math.PI / 8, 1 )

three.js r.84

【讨论】：