A-Frame中如何监听相机旋转的变化？

Question

有没有办法在当前视角添加监听器？

换句话说，我想在用户每次回头看时触发一个函数。

最快的方法似乎是让一个侦听器检查当前的头部旋转，如果在一定的度数范围内，则信任会触发该函数

Answer 1

编辑

componentchange 事件被限制。并且不通过事件系统进行频繁更新的性能更高。相机旋转总是在 VR 中改变每一帧，因此无需考虑相机是否发生了变化。所以我们用组件刻度读取每一帧的旋转。

AFRAME.registerComponent('rotation-reader', {
    tick: function () {
        var rotation = this.el.getAttribute('rotation');
        if (rotation.y < 180) {
            // ...
        }
    }
  });

// <a-camera rotation-reader>

原创

https://aframe.io/docs/0.2.0/core/entity.html#listening-for-component-changes

您可以使用 componentchanged 事件来监听旋转的变化：

document.querySelector('[camera]').addEventListener('componentchanged', function (evt) {
  if (evt.name !== 'rotation') { return; }
  if (evt.newData.y < 180) { // ... }
});

或者作为一个组件更好（这会在旋转到一定数量时触发事件）：

AFRAME.registerComponent('trigger-on-look-behind', {
  schema: {type: 'string'},

  init: function () {
    var eventName = this.data;
    this.el.addEventListener('componentchanged', function (evt) {
      if (evt.name !== 'rotation') { return; }
      if (evt.newData.y < 180) {
        this.emit(eventName);
      }
    });
  }
});

然后：

<a-camera trigger-on-look-behind="looked-behind"></a-camera>

A-Frame中如何监听相机旋转的变化？

How to listen to changes in the rotation of the camera in A-Frame?

aframe

编辑

原创