2017-06-14 4 views
0

私はVRツアーをシミュレートするためにWebVR starter kit(簡略化されたAPIはthree.jsのラッパーです)を使用しています。Three.js/web VR:アルファが黒くレンダリングされます。どのように透明に設定するのですか?

VR simulation

私はレンダラがVR.rendererであると信じて、私は透明に黒い色を設定するrenderer.setClearColor(0x000000を、0)を使用してみてください。問題は、レンダラがアルファ黒をレンダリングすることです。それはうまくいかなかった。今私は手がかりがなく、完全に立ち往生しています。

HTML

<!DOCTYPE html> 
<html> 

<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width"> 
    <title>JS Bin</title> 
</head> 

<body> 
<script src="//povdocs.github.io/webvr-starter-kit/build/vr.js"></script> 
</body> 

</html> 

JavaScriptが

var renderer = VR.renderer; 
renderer.setClearColor(0x000000, 0); 

var mark1 = VR.image('http://i.imgur.com/6Pae8y7.png').setScale(0.2); 

mark1.text({text:"Focus"}).moveTo(0,0.8,0); 

var focus = VR.camera.torus({radius:0.02, 
      tube:0.01, 
      color:"white", 
      }).moveTo(0,0,-4); 

var img1 = "http://i.imgur.com/7Wc2FZh.jpg"; 
var img2 = "http://i.imgur.com/hkf4fvk.jpg" 
var img3 = "http://i.imgur.com/4nMNbYY.png"; 
var imgs = [img1, img2, img3]; 
var i = 0; 

VR.panorama(imgs[i]); 

VR.on('lookat', function(target){ 
    if (target === mark1.object) 
     VR.vibrate(250); 
     i=(i+1)%3; 
     VR.panorama(imgs[i]); 
    }); 

あなたは、私が()THREE.Object3Dを返すmark1.textを見るものからhere

答えて

3

のコードでプレイしてもよいです。あなたは(その呼び出しの後)は、次の材料特性を設定する必要があります。

mark1.material.transparent=true; 
mark1.material.alphaTest=0.5; 

ニーズに合わせてalphaTest値を変更してください。

+0

あなたは素晴らしいです!!!!!!!!! –

関連する問題