three.js - 如何设置初始相机位置(Three.js/VR)?
问题描述
如果我没有为相机设置初始位置,WEB borwser 和 Oculus Go 浏览器的行为会有所不同(见下图)。
const camera = new THREE.PerspectiveCamera( 45, width / height, 1, 1000 );
// camera position is Vector3(0, 0, 0)
scene.add( camera );
图片。1 - 网络浏览器中的初始相机位置(例如 Google Chrome)
图片。2 - VR 浏览器中的初始相机位置(例如 Oculus Go 的默认浏览器)
看起来Three.js
的场景知道它在哪个环境中运行并自动调整相机位置。如何更改相机的初始位置?
目前,我正在做这样的事情:
const cameraHolder = new Group();
cameraHolder.add(camera);
cameraHolder.position.set(0, 1, 0);
scene.add(cameraHolder);
但同样,它并不能解决不同环境中不同职位的问题。
解决方案
我相信这是参考空间的行为。如果您使用*-floor
设备的参考空间类型,就知道您有多高。然后将相机 y 设置为您的设备 y 位置,这是有道理的。因为我找不到从哪里获取设备高度,所以我只是将参考空间类型设置为本地。
this.renderer.xr.setReferenceSpaceType( 'local' );
对我来说这scene.add(cameraHolder)
是必要的,否则相机将无法接收位置/旋转。旧的 HMD 将摄像头连接到“头部”模型,然后你会转动头部而不是摄像头。
推荐阅读
- spring-boot - 如何压缩 Spring WebClient 发布请求的正文?
- python - python中'\xe2\x80\x93'和'-'有什么区别?我如何将所有更改为后者?
- wordpress - 基于 cookie 数据的产品价格 - WooCommerce
- python - 为什么我在 RGB 中得到负数?
- apache-spark - 如何在控制台中查看数据帧(相当于结构化流的 .show() )?
- sql-server - 根据特定日期返回行
- javascript - JavaScript 代码在进行下拉选择时无法显示图片
- protocol-buffers - 如何创建具有通用类型作为字段的消息?
- python - 如何修复:错误:找不到满足要求 tensorflow-gpu==1.14.0 的版本(来自版本:无)
- javascript - 如何按 mongoDB 中的对象数量连续对表进行编号?