挤压形状的背面和正面的不同材料答案

【问题标题】：Different material on back and frontside of extruded shape挤压形状的背面和正面的不同材料
【发布时间】：2013-05-05 06:57:46
【问题描述】：

我正在尝试在挤压形状的正面和背面应用不同的材料，但不知道在哪里放置 side: THREE.FrontSide 和 side: THREE.BackSide。应该放在哪里？

我的相关代码部分是：

更新：根据 WestLangley 的评论，我成功地将不同的纹理添加到背面：

// ... var 材料 = [materialFront, materialSide,materialBack]; // ... for ( var face in mesh.geometry.faces ) { if (mesh.geometry.faces[ face ].normal.z == 1) mesh.geometry.faces[ face ].materialIndex = 2; }

【问题讨论】：

THREE.FrontSide 指的是face 的正面，而不是mesh 或shape 的正面。究竟是什么不工作？
使用上面的代码，当我从背面看网格时，materialFront 也在那里。我想在网格的背面添加不同的材料，比如stemkoski.github.io/Three.js/Textures.html 中的骰子。
在three.js 源中有“material: // 正面和背面的材料索引”。这似乎意味着正反面不能有不同的材料，因为它们只有一个索引。这是问题的核心。我应该能够将一个索引用于后面，一个索引用于前面。
就是这样。您必须按照我的回答中的说明更改几何体背面所有面的材料索引。
我怎么知道哪些脸是背面？

标签： three.js

【解决方案1】：

创建网格几何体后，在第一次调用render() 之前，您必须将背面的materialIndex 更改为2。然后，在材质数组中添加第三个材质。

您可以通过面部法线识别背面。几何体背面的面法线应全部指向同一方向。

three.js r.58

【讨论】：

感谢您的回答！我检查了 f3() 和 f4()，但他们没有给出如何“将背面的 materialIndex 设置为 2”的答案。你能澄清一下吗？
好的。如果你能在这方面帮助我，我会很高兴。到目前为止，我所有的尝试都失败了。
谢谢！我用所需的代码更新了我的问题：stackoverflow.com/q/16484835/1691517。我会接受这个答案。

【解决方案2】：

尝试使用：

var materialFront = new THREE.MeshPhongMaterial({ ambient: 0xffffff, map: frontTexture, side: THREE.FrontSide });
var materialSide = new THREE.MeshPhongMaterial({ color: 0xE68A00, ambient: 0xffffff, side: THREE.BackSide });

即使您可能应该降低环境贡献并为 FrontSide 材料提供color。

然后：

var materials = [materialFront, materialSide];
scene.add( THREE.SceneUtils.createMultiMaterialObject( geometry, materials ));

【讨论】：

在我的代码中materialSide 附加到extrudeSettings.extrudeMaterial。所以我不能将它用于背面。我看不出你的提议如何运作。