三.js 禁用光照答案

【问题标题】：Three.js disable lighting三.js 禁用光照
【发布时间】：2014-05-14 10:30:15
【问题描述】：

我想在 three.js 中完全禁用光照，并渲染一个 3D 对象。目前，由于照明以某种形式处于活动状态，因此对象看起来完全是黑色的。我的程序中目前没有调用任何类型的照明，并且我无法通过搜索找到解决方案。

编辑：代码

var white = 0xFFFFFF;

var facemat = new THREE.MeshBasicMaterial( { color: white, opacity: 1.0, shading: THREE.FlatShading } );

vrmlLoader.addEventListener('load', function ( event ) {
    var object = event.content;
    object.material = facemat;
    scene.add(object);
});

vrmlLoader.load("ship.wrl");

我对这篇特定帖子的问题大多已得到解答。如果我要问更多，我会把这篇文章赶走主题。

【问题讨论】：

您认为最终结果会是什么样子？
@Nikola Dimitroff 一个完全白色的无阴影模型

标签： javascript three.js lighting

【解决方案1】：

阴影/照明负责以您可以感知其深度的方式绘制对象。在您的示例图片中，阴影被禁用 - 没有深度，对象到处都是相同的 - 你无法区分它的一部分。

现在，很明显你不能没有颜色就画东西——就像你不能在没有铅笔或任何其他工具的纸上画画一样。您所看到的只是用黑色绘制的对象。您想看到的是用白色绘制的对象，这几乎是相同的，但如果您现在这样做，您将什么也看不到，因为您的背景是白色的！

无论如何，在这些澄清之后，这里是一个操作方法：

将渲染器的背景颜色更改为白色：

renderer.setClearColor(0, 1)
通过更改材质来更改对象的颜色：

object.material = new THREE.MeshBasicMaterial(0xFFFFFF)

【讨论】：

我已经测试了你的想法，它们似乎表明在 three.js 中以某种方式启用了照明。虽然我将材质设置为纯白色，并将透明颜色设置为黑色，但模型仍然显示为纯黑色。
对不起，误导了你，我相信你是对的。但是，您现在可以恢复光照，因为 THREE.MeshBasicMaterial 提供了您想要的效果 - 它不会渲染任何线条并且您将看不到深度感知。您实际上可以在three.js editor 中进行测试。从File 菜单导入网格，选择它，然后从右侧窗格中选择材质 -> MeshBasicMaterial。
奇怪的是，在您的 three.js 编辑器中，我的模型可以正常工作和渲染。它似乎只是没有在我的代码中呈现。我将在主帖中发布我遇到问题的金额。我的模型仍然呈现黑色。
加载模型后，所有面的材质索引都是0吗？ object.geometry.faces.forEach(function (face) { console.log(face.materialIndex) }) 应该打印无数个零，仅此而已。如果没有，则需要手动设置（face.materialIndex = 0;）