屏幕上的实时相机度数

时间:2018-04-17 16:14:06

标签: javascript aframe

我试图在aframe的文本字段中获得实时相机/光标位置。我找到了一些提示,但仍然没有工作(没有任何职位)。 这是我到目前为止所得到的。我没有经验丰富的aframe,js所以希望你不要怪我。

<html>
<body>
<a-entity position="0 -2 0">
      <a-camera rotation-reader>
        <a-cursor color="white"></a-cursor>
      </a-camera>
</a-entity> 

<a-entity id="positieX" bmfont-text="text: X" position="1 0.5 -2"></a-entity>
      <a-entity id="positieY" bmfont-text="text: Y" position="1 0 -2"></a-entity>
      <a-entity id="positieZ" bmfont-text="text: Z" position="1 -0.5 -2"></a-entity>
</body>
</html>

的Javascript

 $(document).ready(function()
       {

        var rotation = document.getElementById('positieX')
        var y = document.getElementById('positieY')
        var z = document.getElementById('positieZ')
        console.log("1")

        AFRAME.registerComponent('rotation-reader', {
        schema: {type: 'string'},

        init: function () {
            var rotation1 = this.data;
            rotation.setAttribute('bmfont-text', rotation1);

  }
});
    console.log("2")
    });

这就是我想要的。如果有人正在向左看,我想要获得他正在寻找的学位数,向上和向下。向左看是一样的。

1 个答案:

答案 0 :(得分:0)

您应该使用tick功能。它在每个渲染循环中调用,因此它就像你可以得到的那样是实时的。在每个刻度线上,您可以获得轮换,并做任何您需要的事情。

AFRAME.registerComponent('foo', {
  init: function() {
    this.camera = document.querySelector("[camera]")
  },
  tick: function() {
    var rotation = this.camera.getAttribute("rotation")
    //set the text components value accordingly to rotation.x, rotation.y
  }
})

在我的fiddle

上查看