Three.js：ExtrudeGeometry：为正面和背面设置不同材质的问题

Question

我正在创建一个六边形的ExtrudeGeometry，并尝试为正面和背面设置不同的材质，如this thread中所述。

let shape = new THREE.Shape();
/*...*/

let geometry = new THREE.ExtrudeGeometry(shape, {
    steps: 2,
    amount: 0.05,
    bevelEnabled: false,
    material: 0,                //frontMaterial = green
    extrudeMaterial: 1          //sideMaterial  = gray
});

//Searching for the back side and setting the marialIndex accordingly
for (let face of geometry.faces) {
    if (face.normal.z == 1) {
        face.materialIndex = 2; //backMaterial  = red
    }
}

let mesh = new THREE.Mesh(geometry, new THREE.MultiMaterial([frontMaterial, sideMaterial, backMaterial]));

现在的问题是，这个方法（在面上迭代并查找normal.z == 1的方法）与extrudeGeometry.amount = 0.05无法正常工作。值0.1可以正常工作。

See this jsfiddle

是否有其他方法可以为正面和背面设置不同的材质，还是我做错了？

感谢您的帮助！

Answer 1

问题是由于四舍五入。这样做，而不是

if ( face.normal.z < - 0.99999 ) { // instead of == - 1

    face.materialIndex = 2;

}

此外，背面法线理论上是（0,0，-1）。

更新小提琴：https://jsfiddle.net/xhbu2e01/3/

three.js r.84