【THREE.JS笔记】移动端陀螺仪、VR双屏以及漫游的实现

一.陀螺仪

DeviceOrientationControls 陀螺仪相机控制器,实现移动端陀螺仪控制相机

1.1引用

import {DeviceOrientationControls} from "./three.js-dev/examples/jsm/controls/DeviceOrientationControls.js";

1.2代码

//定义控制器dControls并使用
let dControls;
dControls = new DeviceOrientationControls(camera);
//写在animate更新函数处
dControls.update();

二.VR双屏

2.1引用

import {StereoEffect} from "./three.js-dev/examples/jsm/effects/StereoEffect.js";

2.2代码

//定义effect并使用
let effect;
effect = new StereoEffect(renderer);
effect.setSize(window.innerWidth, window.innerHeight);
//写在animate更新函数处
 effect.render(scene, camera);

三.移动端漫游的实现

由于之前增加了陀螺仪等,在移动端使用FirstPersonControls也不知道是什么原因并没有如愿成功,因此使用了一种笨办法,即直接获取照相机的朝向,然后向朝向的方向移动

let direction = new THREE.Vector3();
//speed控制移动速度
let speed = 0.01;
camera.getWorldDirection(direction);
camera.position.add(direction.multiplyScalar(speed))
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。