ThreeJS WebXR изменяет свойства камеры при повторном входе в VR второй / третий / энный раз

Я столкнулся с очень странным опытом работы с WebXR API. WebXR API изменяет свойства камеры VR, когда я снова вхожу в VR. Камера каким-то образом обрезает мои объекты (как показано ниже), когда я повторно вхожу в режим VR во второй, третий или энный раз. введите описание изображения здесь

Когда я впервые вхожу в виртуальную реальность, он всегда работает правильно (как показано ниже).  введите описание изображения здесь

Я хотел бы знать, почему объекты обрезаются при второй / третьей / n-й попытке VR, а также как отлаживать свойства камеры WebXR immersive-vr.

Я использую очень простые коды API WebXR следующим образом:

    window.onload=function()
{
    init();
    animate();
}

function init()
{   
    canvas = document.getElementById( 'vw_canvas' );
    canvas.width  = canvas.clientWidth;
    canvas.height = canvas.clientHeight;
    canvasCssWidth = canvas.style.width;
    canvasCssHeight = canvas.style.height;
    group = new THREE.Object3D();//we create this to make it a parent of camera object.
    camera = new THREE.PerspectiveCamera( 75, canvas.width / canvas.height, 1, 10000 );
    group.rotation.order = 'XZY';//default is XYZ..we change this to XZY. because in case of XYZ when we rotate the object around its Y axis even the X and Z axis changes. so to avoid that we give higher priority to Z axis.
    scene = new THREE.Scene();
    group.add(camera);
    scene.add(group);

    //add more 3D objects to scene

    renderer = new THREE.WebGLRenderer({antialias:true, powerPreference: "high-performance"});
    renderer.setPixelRatio( canvas.devicePixelRatio );
    renderer.setSize( canvas.width, canvas.height );
    renderer.xr.enabled = true;
    renderer.xr.setReferenceSpaceType( 'local' );
    canvas.appendChild(renderer.domElement);

    var WEBVR = 
    {
        createButton: function ( renderer ) 
        {
            function showEnterXR( /*device*/ ) {

                var currentSession = null;

                function onSessionStarted( session ) 
                {
                    session.addEventListener( 'end', onSessionEnded );
                    renderer.xr.setSession( session );
                    vrButton.style.backgroundImage="url('icons/noVR.svg')";
                    document.getElementById("vr-button-tooltip").setAttribute("tooltip","Exit VR");
                    currentSession = session;
                    isVRpresenting=true;
                    openVRMenu();
                }

                function onSessionEnded( event ) 
                {
                    currentSession.removeEventListener( 'end', onSessionEnded );
                    renderer.xr.setSession( null );
                    vrButton.style.backgroundImage="url('icons/yesVR.svg')";
                    document.getElementById("vr-button-tooltip").setAttribute("tooltip","Enter VR");
                    currentSession = null;
                    isVRpresenting=false;
                    closeVRMenu();
                }

                vrButton.style.backgroundImage="url('icons/yesVR.svg')";
                document.getElementById("vr-button-tooltip").setAttribute("tooltip","Enter VR");
                isVRpresenting=false;
                vrButton.onclick = function () 
                {
                    if (runOnlyOnce) 
                    {
                        makeVRMenuItems();
                        runOnlyOnce=false;
                    }
                    if ( currentSession === null ) 
                    {
                        var sessionInit = { optionalFeatures: [ 'local-floor', 'bounded-floor' ] };
                        navigator.xr.requestSession( 'immersive-vr', sessionInit ).then( onSessionStarted );
                    } 
                    else 
                    {
                        currentSession.end();
                    }
                };

            }

            function showVRNotFound() 
            {
                vrButton.onclick = function () 
                {
                    //open VR popup that shows devices to use in order to exp VR
                };
                isVRavailable=false;
                vrButton.style.backgroundImage="url('icons/noVR.svg')";
                document.getElementById("vr-button-tooltip").setAttribute("tooltip","VR is not supported on your device");
                vrButton.onclick = null;
                // renderer.xr.setDevice( null );
                isVRpresenting=false;
            }

            if ( 'xr' in navigator ) 
            {
                isVRavailable=true;

                navigator.xr.isSessionSupported( 'immersive-vr' ).then( function ( supported ) {
                    supported ? showEnterXR() : showVRNotFound();
                } );

            } 

            else 
            {
                vrButton.onclick = function () 
                {
                    //open VR popup that shows devices to use in order to exp VR
                };
                isVRavailable=false;
                vrButton.style.backgroundImage="url('icons/noVR.svg')";
                document.getElementById("vr-button-tooltip").setAttribute("tooltip","VR is not supported on you device");
                isVRpresenting=false;
            }
        },
    };
    WEBVR.createButton( renderer );
}

function animate() 
{
    renderer.setAnimationLoop( animate );
    update();
}
function update() 
{
    renderer.render( scene, camera );
}

person CuriousHash    schedule 17.05.2020    source источник


Ответы (1)


Похоже, что сеанс WebXR впервые принимает параметры камеры сцены, когда входит в VR. Затем при втором и последующих посещениях сеанс WebXR устанавливает для камеры настройки по умолчанию. Следовательно, чтобы обновить свойства камеры так, чтобы они были такими же, как свойства камеры сцены, нам нужно использовать это session.updateRenderState({ depthFar: 10000 });. В моем случае у моей камеры сцены было depthFar=10000, но камера WebXR сбрасывает свойство depthFar на 1000 во втором и последующих посещениях в VR, что было причиной выбраковки усеченной кости (рассматриваемое изображение).

person CuriousHash    schedule 17.05.2020
comment
где вы добавили этот код? - person Toniq; 07.04.2021