Three.js transparent/disparition

Question

私はthreejsを使い始めました。私は単純な3Dモデルを作ろうとしています。 しかし、私は不透明で遊ぶようになって以来、いくつかの透明性/相違の問題があります。

私のコードの重要な部分は、ここにある：あなたが見ることができるように

var cylJaun = new THREE.MeshNormalMaterial({color: 0xFFFF00, opacity: 1}); 
    var cylBleu = new THREE.MeshNormalMaterial({color: 0x0000FF, opacity: 0.5 }); 

    var cylJaun1 = new THREE.Mesh(new THREE.CylinderGeometry(50,50,50,100,1,false),cylJaun); 
    var cylJaun2 = new THREE.Mesh(new THREE.CylinderGeometry(50,50,50,100,1,false),cylJaun); 
    var cylJaun3 = new THREE.Mesh(new THREE.CylinderGeometry(50,50,50,100,1,false),cylJaun); 

    var cylBleu1 = new THREE.Mesh(new THREE.CylinderGeometry(70,70,200,100,1,false),cylBleu); 

    cylJaun1.position.y -= 60; 
    cylJaun3.position.y += 60; 

    group.add(cylBleu1); 

    group.add(cylJaun1); 
    group.add(cylJaun2); 
    group.add(cylJaun3); 

    scene.add(group); 

が、私はそれらの3つのシリンダーのいくつかは私のオブジェクトがあるときに消えるということですfourth.The問題に3つのシリンダーを配置しよう特定の範囲内で回転します。

Answer 1

大きなシリンダの材質にtransparent: trueを設定する必要があります。

var cylBleu = new THREE.MeshNormalMaterial({ transparent: true, opacity: 0.5 }); 

初心者の方であれば、透明性を試して深いところに飛び込んでいます。

透明性はWebGLで扱いにくいことがあります。この道を続けようと計画している場合は、Googleを狂ったように思って、関わる問題や、three.jsでどのように扱われるかについて学べます。

three.js r.53