Question

我正在玩一个非常基本的A帧场景。我正在寻找信息以在运行时获取相机位置。我应该使用Component和three.js代码吗？

我怎么能这样做？

Answer 1

首先，抓住相机实体（https://aframe.io/docs/core/entity.html#Retrieving-an-Entity）。相机实体将附加camera组件作为HTML属性。

document.querySelector('[camera]')或document.querySelector('a-scene').camera.el

然后使用getAttribute抓住位置。这将返回{X，Y，Z}对象。

document.querySelector('[camera]').getAttribute('position')

要在每次相机更新其位置时收到通知，我们都可以使用componentchanged事件（https://aframe.io/docs/core/entity.html#Listening-for-Component-Changes）：

document.querySelector('[camera]').addEventListener('componentchanged', function (evt) {
  if (evt.detail.name === 'position') {
    console.log('Camera position went from', evt.detail.oldData, 'to', evt.detail.newData);
  }
});

Answer 2

我终于采用了这个解决方案：

<script>
    AFRAME.registerComponent('acceleration', {
        tick: function() {
            var altitude = (this.el.getAttribute('position').z);
        }
    })
</script>
<a-scene>
    <a-entity position="0 0 150">
        <a-entity id="myCamera" camera acceleration look-controls keyboard-controls></a-entity>
    </a-entity>
</a-scene>

我的最后一个问题是我没有获得相机的绝对坐标，但相对于初始相机的位置而言。

运行时的摄像头位置

2 个答案: