使用 Three.js 和 Physijs 查看映射材料的背面答案

【问题标题】：See back of mapped material with Three.js and Physijs使用 Three.js 和 Physijs 查看映射材料的背面
【发布时间】：2016-02-26 09:05:30
【问题描述】：

我使用 Three.js 和 Physijs 创建了一个非常基本的立方体。我正在映射一个具有透明度的纹理，我想通过透明度看到立方体另一侧的纹理。现在，我通过透明度看到了背景，但看不到立方体背面的纹理。

var cube = new Physijs.BoxMesh( 
    new THREE.BoxGeometry( 2, 2, 2),
    new THREE.MeshPhongMaterial( { map: THREE.ImageUtils.loadTexture('border.png') } ), 
    1 );

使用的纹理：

结果：

如您所见，背景通过立方体显示，而不是背面的纹理。我猜是看不到 2d 纹理的背面，但无论如何我可以将纹理应用到每个面的两侧？

这是我第一次使用 Threejs，看起来有很多东西要吸收，所以我希望我没有错过一些明显的东西 :)

【问题讨论】：

标签： javascript three.js physijs

【解决方案1】：

将side 设置为THREE.DoubleSide 可能对你有用：

var material = new THREE.MeshPhongMaterial( {
    map: new THREE.TextureLoader().load( "image.png" ),
    transparent: true,
    side: THREE.DoubleSide // apply to both sides of the faces
} );

但是你在这里看到的幻觉并不完美：

【讨论】：

这正是我想要的，谢谢！我在摆弄side 参数，但认为我不需要设置transparency，因为我已经可以通过地图看到背景了:)