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

Tim*_*nen 11 three.js

我试图在挤压形状的正面和背面涂抹不同的材料,但无法弄清楚放在哪里side: THREE.FrontSideside: THREE.BackSide.他们应该在哪里推杆?

我的相关代码部分是:

var materialFront = new THREE.MeshPhongMaterial({ ambient: 0xffffff, map: frontTexture });

var materialSide = new THREE.MeshPhongMaterial({color: 0xE68A00, ambient: 0xffffff});

var extrusionSettings = {
          amount: 10,
          bevelEnabled: false,
          bevelThickness: 0.2,
          bevelSize: 0.2,
          bevelSegments: 8,
          material: 0,
          extrudeMaterial: 1
};

var geometry = new THREE.ExtrudeGeometry(shapes, extrusionSettings);

var materials = [materialFront, materialSide];

var material = new THREE.MeshFaceMaterial(materials);

mesh = new THREE.Mesh(geometry, material);

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

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

Wes*_*ley 9

在您建立网格几何体,并在第一次调用之前render(),你必须改变materialIndex,以2的背面.然后,在材质数组中添加第三种材质.

您可以通过面法线识别背面.几何体背面的面的法线应该都指向相同的方向.

three.js r.58