javascript 是否有与three.js 等效的背面可见性?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10287186/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is there a backface-visibility equivalent for three.js?
提问by Danny Garcia
I have an object with a mesh that uses a semi-transparent png texture.
我有一个使用半透明 png 纹理的网格对象。
Is there a flag or option for the MeshBasicMaterial so that the back of the object is visible through the front?
MeshBasicMaterial 是否有标志或选项,以便通过正面可以看到对象的背面?
Here is some sample code:
下面是一些示例代码:
var texture = THREE.ImageUtils.loadTexture('world.png');
// create the sphere's material
var sphereMaterial = new THREE.MeshBasicMaterial({
map: texture,
transparent: true,
blending: THREE.AdditiveAlpha
});
sphereMaterial.depthTest = false;
// set up the sphere vars
var radius = 50, segments = 20, rings = 20;
// create a new mesh with sphere geometry -
var sphere = new THREE.SceneUtils.createMultiMaterialObject(
new THREE.SphereGeometry(radius, segments, rings),[
sphereMaterial,
new THREE.MeshBasicMaterial({
color: 0xa7f1ff,
opacity: 0.6,
wireframe: true
})
]);
This will accurately render the sphere but the back remains invisible.
这将准确地渲染球体,但背面仍然不可见。
回答by rickdmer
The new way to do this is by using the side
property of material
.
执行此操作的新方法是使用 的side
属性material
。
Example:
例子:
new THREE.MeshPhongMaterial( { map: texture, side: THREE.BackSide } )
Possible values are THREE.FrontSide
, THREE.BackSide
and THREE.DoubleSide
.
可能的值为THREE.FrontSide
、THREE.BackSide
和THREE.DoubleSide
。
回答by sole
The backface property is set in the mesh itself:
背面属性在网格本身中设置:
sphere.doubleSided = true;