有没有办法重新定位/重置方向?
Is there a way to recenter / reset orientation?
我只是想知道是否有重置头部旋转的内置功能。
我见过的大多数 VR SDK(Oculus、Carboard 等)都有一种方法可以将当前旋转设置为默认的正向旋转。
有没有一种简单的方法可以在框架中做到这一点?
您可以在相机周围添加一个包装器实体,并在发生事件时,将实体包装器绕 Y 轴的旋转设置为负相机绕 Y 轴的旋转。
这是一个使用 shake.js 的示例(但在 React 中)@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');
我只是想知道是否有重置头部旋转的内置功能。 我见过的大多数 VR SDK(Oculus、Carboard 等)都有一种方法可以将当前旋转设置为默认的正向旋转。 有没有一种简单的方法可以在框架中做到这一点?
您可以在相机周围添加一个包装器实体,并在发生事件时,将实体包装器绕 Y 轴的旋转设置为负相机绕 Y 轴的旋转。
这是一个使用 shake.js 的示例(但在 React 中)@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');