Question

我已经阅读了很多关于这个问题的问题和文章，但无论如何，模型的png图像都不透明。相反，它有白色背景。像：

也许有人有想法如何解决它以及要添加的代码？

renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true });

var loader = new THREE.OBJMTLLoader();
loader.crossOrigin = 'anonymous';
loader.load( 'model.obj', 'model.mtl', function ( object ) {
    object.position.set(0, 0, 0);
    object.traverse( function ( child ) {
        if ( child instanceof THREE.Mesh ) {
            child.castShadow = true;
            child.receiveShadow = true;
        }
        if ( child.material instanceof THREE.MeshPhongMaterial ) {
            child.material.opacity = 1;
            // child.material.alphaTest = 0.5;
            // child.material.depthWrite = false;
            // child.material.depthTest = false;
            // child.material.side = THREE.BackSide;
            child.material.transparent = true;
        }
    });
    scene.add(object);
});

model.mtl：

newmtl Cap
    Ns 37.6553
    Ni 1.5000
    d 0.9990
    Tr 0.0010
    Tf 0.9990 0.9990 0.9990 
    illum 2
    Ka 0.7333 0.7333 0.7333
    Kd 1.0000 1.0000 1.0000
    Ks 0.0980 0.0980 0.0980
    Ke 0.0000 0.0000 0.0000
    map_Kd Cap_01.png
    map_bump Cap_01_Normal.png
    bump Cap_01_Normal.png

newmtl Bark
    Ns 37.6553
    Ni 1.5000
    d 1.0000
    Tr 0.0000
    Tf 1.0000 1.0000 1.0000 
    illum 2
    Ka 0.7333 0.7333 0.7333
    Kd 1.0000 1.0000 1.0000
    Ks 0.0980 0.0980 0.0980
    Ke 0.0000 0.0000 0.0000
    map_Kd BroadleafBark.png
    map_bump BroadleafBark_Normal.png
    bump BroadleafBark_Normal.png

newmtl Leaves
    Ns 37.6553
    Ni 1.5000
    d 1.0000
    Tr 0.0000
    Tf 1.0000 1.0000 1.0000 
    illum 2
    Ka 0.7647 0.7647 0.7647
    Kd 1.0000 1.0000 1.0000
    Ks 0.4118 0.4118 0.4118
    Ke 0.0000 0.0000 0.0000
    map_Kd BroadleafLeaves.png
    map_Ks BroadleafLeaves_Spec.png
    map_d BroadleafLeaves_Alpha.png
    map_bump BroadleafLeaves_Normal.png
    bump BroadleafLeaves_Normal.png

Answer 1

最后！我找到了解决方案我已将.obj转换为带有threejs python脚本（How to convert object to json file for three.js model loader）的作者的.js加载器，然后使用JSONLoader()：

var loader = new THREE.JSONLoader();
loader.load('model.js', function(geometry, materials) {
   var material = new THREE.MeshFaceMaterial(materials);
   var object = new THREE.Mesh(geometry, material);
   ...

OBJMTLLoader（）在模型中不是透明的.png

1 个答案: