【问题标题】:AFrame click model load URL issueAFrame点击模型加载URL问题
【发布时间】:2018-10-14 02:46:12
【问题描述】:

我正在使用 AR.js 和 Aframe,因此当我点击我的模型时,它会加载一个 URL。

当我使用基本的盒子形状时,下面的效果很好,但是当我添加一个 3D 模型时,模型需要几秒钟来加载,然后在加载后执行 document.location.href 函数,但我只想触发点击模型被点击了吗?

<html>
    <head>
      <script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
      <script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.0/aframe/build/aframe-ar.js"></script>

      <script>
        AFRAME.registerComponent('mas', {

          init: function () {
            var data = this.data;
            var el = this.el;  // <a-box>

            el.addEventListener('click', function () {
              console.log('click');
              masClick();
            });

            function masClick() {
              document.location.href = "http://www.google.com";
            };
          }
        });
      </script>

    </head>

    <body style='margin : 0px; overflow: hidden;'>

    <a-scene embedded arjs='sourceType: webcam;' cursor="rayOrigin: mouse">

      <a-entity rotation="0 90 0" dur="7000" mas>
        <a-gltf-model src="scene.gltf" scale="0.05 0.05 0.05" position='0 0.5 0' >
          <a-animation 
             dur="8000" 
             attribute="rotation" 
             to="0 360 0" 
             repeat="indefinite">
          </a-animation>   
        </a->
      </a-entity>

      <a-marker-camera preset='hiro'></a-marker-camera>
    </a-scene> 

    </body>
    </html>

【问题讨论】:

    标签: aframe


    【解决方案1】:

    cursor 组件放在 &lt;a-marker&gt; 实体中时可以工作:

    <a-marker preset='hiro' cursor="rayOrigin: mouse">
      .....
    </a-marker>
    

    codepen here.

    【讨论】:

    • 感谢您的回复,但是当我使用 3D 模型时,重定向会触发而不点击模型?
    • here 您有一个 3D 模型示例,其中只有在使用鼠标单击时才会发生单击。 here 是一个小故障,点击后会打开 google.com
    猜你喜欢
    • 1970-01-01
    • 2019-07-31
    • 2018-08-27
    • 2019-05-12
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-03-15
    • 2016-09-18
    相关资源
    最近更新 更多