Three.js - 双面平面一侧反转答案

【问题标题】：Three.js - Double sided plane one side reversedThree.js - 双面平面一侧反转
【发布时间】：2013-12-06 02:30:14
【问题描述】：

我使用了将面推到几何体的方法来实现双面平面。

for (var i=0, len=geometry.faces.length; i<len; i++) {
    var face = geometry.faces[i].clone();
    face.materialIndex = 1;
    geometry.faces.push(face);
    geometry.faceVertexUvs[0].push(geometry.faceVertexUvs[0][i].slice(0));
}

但这里有一个颠倒的一面是小提琴http://jsfiddle.net/bN8ZH/

【问题讨论】：

标签： three.js textures

【解决方案1】：

如果要将两架飞机背靠背放置，最好的方法是这样：

var geometry = new THREE.PlaneGeometry(80, 116, 20, 20);

var geometry2 = geometry.clone();
geometry2.applyMatrix( new THREE.Matrix4().makeRotationY( Math.PI ) );

THREE.GeometryUtils.merge( geometry, geometry2, 1 );

这样做时，请确保每个平面的材质都有material.side = THREE.FrontSide。

更新小提琴：http://jsfiddle.net/bN8ZH/1/

three.js r.63

【讨论】：

这会使顶点加倍，我需要做一些重的变换，这种方法会使计算加倍
不，不会。两种方法都有相同数量的面、法线、顶点法线、uv——只是顶点列表不同。如果需要，可以调用geometry.mergeVertices()，顶点将是相同的。
虽然看起来不错，但是动画开始的时候就是一团糟，等我可以分享项目我会告诉你的；现在我只是翻转图像:)
是的，CanvasRenderer 有其局限性。