是否有三个.js的背面可见性?

Dan*_*cia 7 javascript 3d canvas webgl three.js

我有一个使用半透明png纹理的网格对象.

是否有MeshBasicMaterial的标志或选项,以便通过前面可以看到对象的背面?

以下是一些示例代码:

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
        })
   ]);
Run Code Online (Sandbox Code Playgroud)

这将准确渲染球体,但背部仍然不可见.

小智 25

执行此操作的新方法是使用的side属性material.

例:

new THREE.MeshPhongMaterial( { map: texture, side: THREE.BackSide } )
Run Code Online (Sandbox Code Playgroud)

可能的值是THREE.FrontSide,THREE.BackSideTHREE.DoubleSide.

请参阅:https://github.com/mrdoob/three.js/wiki/Migration


sol*_*ole 7

backface属性在网格本身中设置:

sphere.doubleSided = true;
Run Code Online (Sandbox Code Playgroud)