three.js透明材料:对象并不总是透明的

问题描述 投票:0回答:1

我使用Three.js进行对象查看和拾取,但是我有可见性问题

我在three.js中加载collada对象我的collada加载程序与回购库略有不同。我加了

function copyMaterial (_material) {
    var newMaterial = new THREE.MeshLambertMaterial();
    for (var p in _material) {
        if (_material.hasOwnProperty(p) && p !== "id") {
            var obj = _material[p];
            newMaterial[p] = obj;
        }
    }
    return newMaterial;
}

并且在加载材料时,我只是在分配之前复制它

这使我可以分别更改每个对象的不透明度,即使它们使用相同的collada材质。

效果很好。现在,通过这样做,我现在看到了一些奇怪的行为。根据对象的方向,某些部分是否通过透明显示。屏幕截图会更好地解释,

we dont see the internal parts

we see the internal parts

关于正在发生的事情以及如何解决的任何想法?

谢谢

three.js trace transparent
1个回答
3
投票

据我所知,这种情况有2次发生:

1]当在同一位置上设置了多于一个的刻面时,一个可见,而另一个不可见。因此,在渲染时,它取决于首先要面对的摄影机角度。

2)通常,当您尝试将对象的所有部分设置为透明时,但仍然希望能够通过其他人看到某些人脸。同样,这就是渲染器的工作方式。

现在,我找到的唯一解决方案是将FrondSide和BackSide分配给单独的材质,并将它们都设置为同一对象(我想是对象的一部分):

texture = new THREE.Texture(textureImage);
texture.needsUpdate = true;
material = new THREE.MeshBasicMaterial({
    map: texture,
    transparent: true,
    side: THREE.BackSide
 }); 
material2 = new THREE.MeshBasicMaterial({
    map: texture,
    transparent: true
});
geometry = new THREE.SphereGeometry(RADIUS, 40, 20);
mesh = new THREE.Mesh(geometry, material);
scene.add(mesh);
mesh = new THREE.Mesh(geometry, material2);
scene.add(mesh);

https://github.com/mrdoob/three.js/issues/2476了解有关此问题的更多信息

© www.soinside.com 2019 - 2024. All rights reserved.