有没有办法更新/重置方向? [英] Is there a way to recenter / reset orientation?
本文介绍了有没有办法更新/重置方向?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我只是想知道是否有内置功能可以重置磁头旋转。
我见过的大多数VR SDK(Oculus,Carboard等)都可以将当前旋转设为默认的正向旋转。
是否可以在a帧中执行此操作?
I just wanted to know if there is a buit-in function to reset head rotation. Most VR SDKs I've seen (Oculus, Carboard, etc) have a way to make current rotation the default forward rotation. Is there a simple way to do this in a-frame?
推荐答案
您可以在框架周围添加包装器实体相机,并在一个事件中,将实体包装器绕Y轴的旋转设置为负值,使相机绕Y轴的旋转为负。
You can add a wrapper entity around the camera, and on an event, set the entity wrapper's rotation about the Y-axis to be negative the camera's rotation about the Y-axis.
以下是一个示例(但在React)使用@jhsu的shake.js:
Here's an example (but in React) using shake.js by @jhsu:
import React from 'react';
import Camera from './Camera';
import Shake from 'shake.js';
class Player extends Component {
componentDidMount() {
this.shaker = new Shake({
threshold: 5,
timeout: 250,
});
this.shaker.start();
window.addEventListener('shake', this.reorient, false);
}
reorient() {
if (this.camera) {
const rotation = this.camera.getAttribute('rotation');
this.setState({
orientation: { x: 0, y: -1 * rotation.y, z: 0 }
});
}
}
cameraMounted = (camera) => {
this.camera = camera;
}
render() {
return <Camera
rotation={this.state.orientation}
onMount={this.cameraMounted}
/>
}
}
一个组件为:
AFRAME.registerComponent('resetorientation', {
init: function () {
var el = this.el;
el.addEventListener('resetorientation', function () {
var y = el.querySelector('[camera]').getAttribute('rotation').y;
el.setAttribute('rotation', {y: -1 * y});
});
}
});
<a-entity id="cameraWrapper" resetorientation><a-camera></a-camera></a-entity>
document.querySelector('#cameraWrapper').emit('resetorientation');
这篇关于有没有办法更新/重置方向?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文