2012-12-15 3 views
10

저는 threejs에 익숙하지 않고 간단한 3D 모델을 만들려고합니다. 그럼에도 불구하고 불투명도로 게임을 시작한 이래로 나는 약간의 투명성/불일치 문제를 가지고 있습니다.Three.js transparency/disparition

내 코드의 중요한 부분은 여기에 있습니다 : 당신이 볼 수 있듯이

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 개 실린더를 넣어 시도 특정 범위 내에서 회전 함.

답변

25

큰 실린더의 재료에는 transparent: true을 설정해야합니다.

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

초보자는 투명도 실험을 통해 심도 깊게 뛰어 올 것입니다.

투명도는 WebGL에서 까다로울 수 있습니다. 이 길을 계속 진행할 계획이라면 구글을 미친 듯이 생각하고 관련된 이슈들에 관해 할 수있는 모든 것들과 그것들이 어떻게 three.js에서 다루어 지는지를 배우십시오.

three.js r.53