Question

我刚接触镜框，并尝试根据场景中的用户交互动态更改摄影机位置，以使其更接近物体并返回到先前的位置。

但是这在VR模式下不起作用。在桌面浏览器中，相机正在根据需要更改位置。

HTML：

<a-entity id='cameraWrappers1' position="0 0 0" rotation="0 90 0">
            <a-camera position="0.001 1.85 -0.52" id="cameraPositions1">
                    <a-cursor id="cam2cursor" color="#f000f0" material="" raycaster="" cursor="" geometry="" position="-0.007 -0.04 -2.05" scale="3 3 3"></a-cursor>
            </a-camera>
        </a-entity>

脚本：

var m1HotSpot = document.querySelector("#cameraPositions1");
                    var position = m1HotSpot.getAttribute("position");
                    console.log("position:::::" + position.z)
                    //document.querySelector("#m-1").setAttribute('scale', '1 1; 1');
                    if(position.z == -0.52){

                        m1HotSpot.setAttribute("position",'0.001 1.85 -2.35');

                    }
                    else if(position.z == -2.35){

                        m1HotSpot.setAttribute("position",'0.001 1.85 -0.52');
                  }


    }

我已经尝试了解决方法

禁用轨道控制，更改位置，然后启用轨道控制
放入相机包装纸，然后尝试更改在VR中仍无法使用的包装纸的位置

我正在使用最新的Aframe版本。请告诉我您是否有实现此目标的想法。

我在笔下放了一个演示。当您单击球体时，您将变换到接近球体的位置，再次单击它将返回原始位置。此功能适用于台式机浏览器，但不适用于VR模式下的像素Chrome浏览器。请帮助。 DEMO replica

谢谢， Akki

Answer 1

设置并更改包装器而不是相机的位置：

var camPos = document.querySelector("#cameraWrappers1");

在HTML位置中，包装器也不是相机：

 <a-entity id='cameraWrappers1' position="0.001 1.85 -0.52">

这是上述解决方案（定位和移动相机包装）的一个故障示例，并在装有Chrome的Pixel手机上进行了测试：http://glitch.com/edit/#!/nebulous-kidney

请记住，在移动设备中，光标以注视/融合模式操作，而不是在点击屏幕时操作

aframe-动态更改相机位置

1 个答案: