aframe

Question

我是 aframe 的新手，正在尝试根据场景中的用户交互动态更改相机位置，以靠近对象并返回到之前的位置。

但不知何故这在 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

谢谢，阿基

Answer 1

设置和更改包装器而非相机的位置：

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

同样在 HTML 位置包装器而不是相机：

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

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

请记住，在移动设备中，光标在凝视/融合模式下运行，而不是在点击屏幕时运行

aframe - 动态改变相机位置

aframe - changing camera position dynamically