在天空元素的A框架光标监听器没有射击

时间:2016-11-11 20:40:02

标签: html aframe

我正在尝试将光标侦听器附加到A-Frame中的天空元素(equirectangular图像作为纹理映射到球体)。最终目标是在光标与点击球体相交的点处获得纹理的2D坐标。但是,我目前无法点击事件。有什么想法吗?

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Hello, World! - A-Frame</title>
    <meta name="description" content="Hello, World! - A-Frame">
    <script src="aframe.js"></script>
    <script type="text/javascript">
    window.onload = function () {
      AFRAME.registerComponent('cursor-listener', {
        init: function () {
          this.el.addEventListener('click', function () {
            console.log('I was clicked!');
          });
        }
      }); 
    }
    </script>
  </head>
  <body>
    <a-scene>
      <a-camera>
        <a-cursor></a-cursor>
      </a-camera>
      <a-sky cursor-listener src="image.jpg"></a-sky>
    </a-scene>
  </body>
</html>

1 个答案:

答案 0 :(得分:0)

即将发布的A-Frame版本具有修复功能,可以在click事件中显示光标UV交叉点数据。 https://github.com/aframevr/aframe/tree/master/dist。首先,我建议抓住它。

天空很远,所以你需要延长raycaster的maxDistance

<a-entity raycaster="maxDistance: 6000; objects: a-sky" cursor></a-entity>

https://aframe.io/docs/0.3.0/components/cursor.html#configuring-the-cursor-through-the-raycaster-component