aframe - 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>