Volume rendering using THREE.JS and WEBGL does not display correctly in VR

I am learning to implement volume rendering using WebGL and Three.js. I saw the results of LEBARBA research (http://www.lebarba.com/ ), I want to improve this, put the results of volume rendering in VR.

I saw some examples of three.js implementing VR, so I used WebVR.js and set renderer.vr.enabled = true ; document.body.appendChild( WEBVR.createButton( renderer ) ); renderer.setAnimationLoop( render );

But when I run my program, the results of the rendering look fine on my browser screen, and I can do some rotation interaction.

When I took Oculus and entered vr mode, I could only see a cube box that was almost full-filled and I couldn’t see the texture. When I look up my HMD, I can see part of the texture, but the direction of Motion of the texture is opposite to the direction of movement of my head. The texture and the box seem to be separated . sceneFirstPass and sceneSecondPass are not combined.:sob:

Is it the VR mode that changed the position of two scenes?:thinking:

Here is my app volumeRendering.rar (2.5 MB)

1 Like